51 lines
2 KiB
HTML
51 lines
2 KiB
HTML
<header class="mdl-layout__header mdl-layout__header--waterfall">
|
|
|
|
<div class="mdl-layout__header-row">
|
|
<!-- Title -->
|
|
<span class="mdl-layout-title">{{ site.title }}</span>
|
|
<!-- Add spacer, to align navigation to the right -->
|
|
<div class="mdl-layout-spacer"></div>
|
|
<!-- Navigation. We hide it in small screens. -->
|
|
<nav class="mdl-navigation mdl-layout--large-screen-only">
|
|
{% for page in site.pages %}
|
|
{% if page.title %}
|
|
<a class="mdl-navigation__link" href="{{ page.url | prepend: site.baseurl }}">{{ page.title }}</a>
|
|
{% endif %}
|
|
{% endfor %}
|
|
</nav>
|
|
|
|
<div class="android-search-box mdl-textfield mdl-js-textfield mdl-textfield--expandable mdl-textfield--floating-label mdl-textfield--align-right mdl-textfield--full-width">
|
|
<label class="mdl-button mdl-js-button mdl-button--icon" for="search-field">
|
|
<i class="material-icons">search</i>
|
|
</label>
|
|
<div class="mdl-textfield__expandable-holder">
|
|
<input class="mdl-textfield__input" type="text" id="search-field" />
|
|
</div>
|
|
</div>
|
|
|
|
<button id="demo-menu-lower-left" class="mdl-button mdl-js-button mdl-button--icon">
|
|
<i class="material-icons">more_vert</i>
|
|
</button>
|
|
|
|
<ul class="mdl-menu mdl-menu--bottom-right mdl-js-menu mdl-js-ripple-effect" for="demo-menu-lower-left">
|
|
<li class="mdl-menu__item">Some Action</li>
|
|
<li class="mdl-menu__item">Another Action</li>
|
|
<li disabled class="mdl-menu__item">Disabled Action</li>
|
|
<li class="mdl-menu__item">Yet Another Action</li>
|
|
</ul>
|
|
</div>
|
|
</header>
|
|
|
|
<div class="mdl-layout__drawer">
|
|
<span class="mdl-layout-title">{{ site.title }}</span>
|
|
|
|
<nav class="mdl-navigation">
|
|
{% for page in site.pages %}
|
|
{% if page.title %}
|
|
<a class="mdl-navigation__link" href="{{ page.url | prepend: site.baseurl }}">{{ page.title }}</a>
|
|
{% endif %}
|
|
{% endfor %}
|
|
</nav>
|
|
|
|
</div>
|
|
|