<header class="header"> <nav class="navbar"> <div class="navbar-brand"> <a class="navbar-item" href="{{{or site.url siteRootPath}}}">{{site.title}}</a> {{#if env.SITE_SEARCH_PROVIDER}} <div class="navbar-item search hide-for-print"> <div id="search-field" class="field"> <input id="search-input" type="text" placeholder="Search the docs"{{#if page.home}} autofocus{{/if}}> </div> </div> {{/if}} <button class="navbar-burger" aria-controls="topbar-nav" aria-expanded="false" aria-label="Toggle main menu"> <span></span> <span></span> <span></span> </button> </div> <div id="topbar-nav" class="navbar-menu"> <div class="navbar-end"> <a class="navbar-item" href="#">Home</a> <div class="navbar-item has-dropdown is-hoverable"> <a class="navbar-link" href="#">Products</a> <div class="navbar-dropdown"> <a class="navbar-item" href="#">Product A</a> <a class="navbar-item" href="#">Product B</a> <a class="navbar-item" href="#">Product C</a> </div> </div> <div class="navbar-item has-dropdown is-hoverable"> <a class="navbar-link" href="#">Services</a> <div class="navbar-dropdown"> <a class="navbar-item" href="#">Service A</a> <a class="navbar-item" href="#">Service B</a> <a class="navbar-item" href="#">Service C</a> </div> </div> <div class="navbar-item"> <span class="control"> <a class="button is-primary" href="#">Download</a> </span> </div> </div> </div> </nav> </header>