<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>{{htmlTitle}}</title>
    <meta name="description" content="{{projectDescription}}">
    <link rel="stylesheet" href="{{yuiGridsUrl}}">
    <link rel="stylesheet" href="{{projectAssets}}/vendor/prettify/prettify-min.css">
    <link rel="stylesheet" href="{{projectAssets}}/css/main.css" id="site_styles">
    <link rel="stylesheet" href="{{projectAssets}}/css/custom.css">
    <link rel="stylesheet" href="{{projectAssets}}/vendor/bootstrap/css/bootstrap.css">
    <link rel="stylesheet" href="{{projectAssets}}/vendor/font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="{{projectAssets}}/css/theme.css">
    <link href='https://fonts.googleapis.com/css?family=Open+Sans:300,400,500,600,700' rel='stylesheet' type='text/css'>
    {{!-- <link rel="shortcut icon" type="image/png" href="{{projectAssets}}/favicon.png"> --}}
    {{setupGlobals}}

    {{#if projectPrimaryColor}}
      <style>
        body a {
          color: {{projectPrimaryColor}};
        }
        body a:hover {
          color: {{projectPrimaryColor}};
          opacity: 0.5;
        }
        .navbar.navbar-default .navbar-nav> li> a:focus, .navbar.navbar-default .navbar-nav> li> a:hover {
          color: {{projectPrimaryColor}};
        }
        .navbar.navbar-default .navbar-nav> .active> a, .navbar.navbar-default .navbar-nav> .active> a:focus, .navbar.navbar-default .navbar-nav> .active> a:hover {
          color: {{projectPrimaryColor}};
        }
        #docs-main .page-header {
          color: {{projectPrimaryColor}};
        }
        #docs-main .page-section .nav-tabs {
          border-bottom: 1px solid {{projectPrimaryColor}};
        }
        #docs-main .page-section .nav-tabs> li.active a {
          background: {{projectPrimaryColor}};
          border: 1px solid {{projectPrimaryColor}};
        }
        #sidebar li.panel .panel-body ol> li.active, #sidebar li.panel .panel-body ol> li:hover {
          background: #efefef;
        }
      </style>
    {{/if}}
</head>
<body>
    <nav class="navbar navbar-default">
      <div class="container-fluid">
        <div class="navbar-header">
          <a href="{{projectRoot}}" class="navbar-brand">
            {{#if projectLogo}}
              <img src="{{projectLogo}}" alt="enterprise logo">
            {{else}}
              <img src="{{projectAssets}}/img/ember-logo.png" alt="enterprise logo">
            {{/if}}
            <span>{{deEmberifiedName}}</span>
          </a>
        </div>

        <div class="collapse navbar-collapse" id="nav">
          <ul class="nav navbar-nav navbar-right">
            <li><a href="{{projectUrl}}" class="fa fa-github github"></a></li>
          </ul>
        </div>
      </div>
    </nav>
    <div id="main-wrapper" class="row">
        <div id="content-wrapper">
            {{>sidebar}}
            <div class="content-container">
                <div class="apidocs">
                    <div id="docs-main">
                        <div class="content">
{{>layout_content}}
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script src="{{projectAssets}}/vendor/prettify/prettify-min.js"></script>
    <script>prettyPrint();</script>
    <script src="{{projectAssets}}/vendor/jquery/jquery.min.js"></script>
    <script src="{{projectAssets}}/vendor/jquery-ui/jquery-ui.min.js"></script>
    <script src="{{projectAssets}}/vendor/bootstrap/js/bootstrap.js"></script>
    <script src="{{projectAssets}}/vendor/github-slugger/slugger.js"></script>
    <script src="{{projectAssets}}/js/yuidoc-bootstrap.js"></script>
</body>
</html>
