Line 56: | Line 56: | ||
</head> | </head> | ||
+ | |||
+ | <!-- The drawer is always open in large screens. The header is always shown, | ||
+ | even in small screens. --> | ||
<body> | <body> | ||
− | <!-- | + | |
− | + | <!-- Always shows a header, even in smaller screens. --> | |
− | <div class="mdl-layout mdl-js-layout"> | + | <div class="mdl-layout mdl-js-layout mdl-layout--fixed-header"> |
− | <header class="mdl-layout__header | + | <header class="mdl-layout__header"> |
<div class="mdl-layout__header-row"> | <div class="mdl-layout__header-row"> | ||
<!-- Title --> | <!-- Title --> | ||
Line 68: | Line 71: | ||
<!-- Add spacer, to align navigation to the right --> | <!-- Add spacer, to align navigation to the right --> | ||
<div class="mdl-layout-spacer"></div> | <div class="mdl-layout-spacer"></div> | ||
− | <!-- Navigation --> | + | <!-- Navigation. We hide it in small screens. --> |
− | <nav class="mdl-navigation"> | + | <nav class="mdl-navigation mdl-layout--large-screen-only"> |
<a class="mdl-navigation__link" href="">Link</a> | <a class="mdl-navigation__link" href="">Link</a> | ||
<a class="mdl-navigation__link" href="">Link</a> | <a class="mdl-navigation__link" href="">Link</a> | ||
Line 77: | Line 80: | ||
</div> | </div> | ||
</header> | </header> | ||
− | |||
</div> | </div> | ||
Revision as of 17:11, 16 October 2017
Title