<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>{{htmlTitle}}</title>
    <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Maven+Pro:400,700">
    <link rel="stylesheet" href="{{yuiGridsUrl}}">
    <link rel="stylesheet" href="{{projectAssets}}/css/main.css">
    <link rel="stylesheet" href="{{projectAssets}}/css/bottle_doc.css">
    <link rel="stylesheet" href="{{projectAssets}}/js/gallery-bottle/assets/skins/sam/gallery-bottle.css">
    <link rel="stylesheet" href="{{projectAssets}}/vendor/prettify/prettify-min.css">
{{>device-metas}}
</head>
<body class="yui3-skin-sam">
<div id="doc" data-role="page">
 <div data-role="container"> 
  <div class="btn menu" data-role="header" data-position="fixed"></div>
  <div data-role="body">
    <div id="hd">
     <ul>
      <li><a href="{{#if displayName}}..{{else}}.{{/if}}/">{{projectName}}</a></li>
<script>
if (location.href.match(/yahoo\.com/)) {
    document.write('<li><a href="{{twikiUrl}}" target="_blank">Twiki</a></li>');
}
</script>
      <li><a href="{{#if relUrl}}{{#if displayName}}..{{else}}.{{/if}}{{/if}}{{apiDocUrl}}" target="_blank">Api Documents</a></li>
      <li><a href="{{sourceUrl}}" target="_blank">Source</a></li>
<script>
if (location.href.match(/yahoo\.com/)) {
    document.write('<li><a href="{{bugUrl}}" target="_blank">Report Bug</a></li>');
}
</script>
     </ul>
    </div>
    <h1>{{title}}</h1>

    {{^hideTableOfContents}}
        <a href="#toc" class="jump">Jump to Table of Contents</a>
    {{/hideTableOfContents}}

    <div class="yui3-g">
        <div class="yui3-u-3-4">
            <div id="main">
                <div class="content">{{>layout_content}}</div>
            </div>
        </div>

        <div class="yui3-u-1-4" data-role="shortcut">
            <div class="sidebar" data-role="container">
             <div data-role="body">
                {{^hideTableOfContents}}
                    <div id="toc" class="sidebox">
                        <div class="hd">
                            <h2 class="no-toc">Table of Contents</h2>
                        </div>

                        <div class="bd">
                            {{toc}}
                        </div>
                    </div>
                {{/hideTableOfContents}}

                {{#if components}}
                    <div class="sidebox">
                        <div class="hd">
                            <h2 class="no-toc">Components</h2>
                        </div>

                        <div class="bd">
                            <ul>
                                {{#components}}
                                  {{#meta}}
                                        <li data-description="{{description}}">
                                            <a href="{{name}}/">{{displayName}}{{#unless galleryTag}} (testing){{/unless}}</a>
                                        </li>
                                  {{/meta}}
                                {{/components}}
                            </ul>
                        </div>
                    </div>
                {{/if}}

                {{#if hasOwnExamples}}
                    <div class="sidebox">
                        <div class="hd">
                            <h2 class="no-toc">Examples</h2>
                        </div>

                        <div class="bd">
                            <ul class="examples">
                                {{#examples}}
                                    {{^forTest}}
                                    {{#unless inherited}}
                                        <li data-description="{{description}}">
                                            <a href="{{name}}.html">{{displayName}}</a>
                                        </li>
                                    {{/unless}}
                                    {{/forTest}}
                                {{/examples}}
                            </ul>
                        </div>
                    </div>
                {{/if}}

                {{#if hasInheritedExamples}}
                    <div class="sidebox">
                        <div class="hd">
                            <h2 class="no-toc">Examples That Use This Component</h2>
                        </div>

                        <div class="bd">
                            <ul class="examples">
                                {{#examples}}
                                    {{#if inherited}}
                                    {{^forTest}}
                                        <li data-description="{{description}}">
                                            <a href="../{{componentName}}/{{name}}.html">{{displayName}}</a>
                                        </li>
                                    {{/forTest}}
                                    {{/if}}
                                {{/examples}}
                            </ul>
                        </div>
                    </div>
                {{/if}}
             </div>
            </div>
        </div>
    </div>
    <div id="ft">
{{projectName}} is Created by Brian Huang, Eric Chuang, John Wu, Montie Tsai and Zordius Chen, please visit <a href="{{#if examples}}../{{/if}}contributers.html">this page</a> to know where to contact us.
    </div>
  </div>
 </div>
</div>

<script src="{{projectAssets}}/vendor/prettify/prettify-min.js"></script>
<script>prettyPrint();</script>
{{>bottle-asseturl}}
{{>bottle-scripts}}
{{>bottle-selleck}}
</body>
</html>
