Line 38: | Line 38: | ||
<body> | <body> | ||
+ | |||
+ | <!-- Simple header with fixed tabs. --> | ||
+ | <div class="mdl-layout mdl-js-layout mdl-layout--fixed-header | ||
+ | mdl-layout--fixed-tabs"> | ||
+ | <header class="mdl-layout__header"> | ||
+ | <div class="mdl-layout__header-row"> | ||
+ | <!-- Title --> | ||
+ | <span class="mdl-layout-title">Title</span> | ||
+ | </div> | ||
+ | <!-- Tabs --> | ||
+ | <div class="mdl-layout__tab-bar mdl-js-ripple-effect"> | ||
+ | <a href="#fixed-tab-1" class="mdl-layout__tab is-active">Tab 1</a> | ||
+ | <a href="#fixed-tab-2" class="mdl-layout__tab">Tab 2</a> | ||
+ | <a href="#fixed-tab-3" class="mdl-layout__tab">Tab 3</a> | ||
+ | </div> | ||
+ | </header> | ||
+ | <div class="mdl-layout__drawer"> | ||
+ | <span class="mdl-layout-title">Title</span> | ||
+ | </div> | ||
+ | <main class="mdl-layout__content"> | ||
+ | <section class="mdl-layout__tab-panel is-active" id="fixed-tab-1"> | ||
+ | <div class="page-content"><!-- Your content goes here --></div> | ||
+ | </section> | ||
+ | <section class="mdl-layout__tab-panel" id="fixed-tab-2"> | ||
+ | <div class="page-content"><!-- Your content goes here --></div> | ||
+ | </section> | ||
+ | <section class="mdl-layout__tab-panel" id="fixed-tab-3"> | ||
+ | <div class="page-content"><!-- Your content goes here --></div> | ||
+ | </section> | ||
+ | </main> | ||
+ | </div> | ||
<!-- Wide card with share menu button --> | <!-- Wide card with share menu button --> |
Revision as of 15:15, 16 October 2017
Title
Title
Welcome
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Mauris sagittis pellentesque lacus eleifend lacinia...