c0ee41733f
Create a config for the type of the header used in the site, if the header type is drawer then a sidebar is loaded else use a simple material nav
39 lines
1.5 KiB
HTML
39 lines
1.5 KiB
HTML
<header class="mdl-layout__header">
|
|
<div class="mdl-layout__header-row">
|
|
<div class="mdl-layout-spacer"></div>
|
|
<div class="mdl-textfield mdl-js-textfield mdl-textfield--expandable
|
|
mdl-textfield--floating-label mdl-textfield--align-right">
|
|
<label class="mdl-button mdl-js-button mdl-button--icon"
|
|
for="fixed-header-drawer-exp">
|
|
<i class="material-icons">search</i>
|
|
</label>
|
|
<div class="mdl-textfield__expandable-holder">
|
|
<input class="mdl-textfield__input" type="text" name="sample"
|
|
id="fixed-header-drawer-exp" />
|
|
</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>
|
|
</div>
|
|
</header>
|
|
<div class="mdl-layout__drawer">
|
|
<span class="mdl-layout-title"><a href="{{ site.url }}">{{ site.title }}</a></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>
|