Difference between revisions of "Template:Peking/NavBar"

Line 43: Line 43:
  
 
     <link rel="stylesheet" type="text/css"
 
     <link rel="stylesheet" type="text/css"
           href="https://2017.igem.org/Template:Peking/mdl/MDLnew?action=raw&ctype=text/css">
+
           href="mdl/MDLnew.css">
  
  
Line 65: Line 65:
  
 
<body>
 
<body>
 +
 +
  
 
<!-- Always shows a header, even in smaller screens. -->
 
<!-- Always shows a header, even in smaller screens. -->
Line 91: Line 93:
 
                 <a class="mdl-navigation__link" href="">Lab</a>
 
                 <a class="mdl-navigation__link" href="">Lab</a>
 
                 <a class="mdl-navigation__link" href="">Practices</a>
 
                 <a class="mdl-navigation__link" href="">Practices</a>
 +
                <a class="mdl-navigation__link" href="">Parts</a>
 
                 <a class="mdl-navigation__link" href="">Team</a>
 
                 <a class="mdl-navigation__link" href="">Team</a>
 
             </nav>
 
             </nav>
Line 106: Line 109:
 
                 style="background-image: url(&#39;../assets/comp_badges.png&#39;)">
 
                 style="background-image: url(&#39;../assets/comp_badges.png&#39;)">
 
             </div>
 
             </div>
             <span class="mdl-components__link-text">Badges</span>
+
             <span class="mdl-components__link-text">Background</span>
 
         </a>
 
         </a>
  
Line 114: Line 117:
 
                 style="background-image: url(&#39;../assets/comp_buttons.png&#39;)">
 
                 style="background-image: url(&#39;../assets/comp_buttons.png&#39;)">
 
             </div>
 
             </div>
             <span class="mdl-components__link-text">Buttons</span>
+
             <span class="mdl-components__link-text">Introduction</span>
 
         </a>
 
         </a>
  
Line 122: Line 125:
 
                 style="background-image: url(&#39;../assets/comp_cards.png&#39;)">
 
                 style="background-image: url(&#39;../assets/comp_cards.png&#39;)">
 
             </div>
 
             </div>
             <span class="mdl-components__link-text">Cards</span>
+
             <span class="mdl-components__link-text">Flip-flop</span>
 
         </a>
 
         </a>
  
Line 130: Line 133:
 
                 style="background-image: url(&#39;../assets/comp_chips.png&#39;)">
 
                 style="background-image: url(&#39;../assets/comp_chips.png&#39;)">
 
             </div>
 
             </div>
             <span class="mdl-components__link-text">Chips</span>
+
             <span class="mdl-components__link-text">Control Unit</span>
 
         </a>
 
         </a>
  
Line 138: Line 141:
 
                 style="background-image: url(&#39;../assets/comp_dialog.png&#39;)">
 
                 style="background-image: url(&#39;../assets/comp_dialog.png&#39;)">
 
             </div>
 
             </div>
             <span class="mdl-components__link-text">Dialogs</span>
+
             <span class="mdl-components__link-text">Clock</span>
 
         </a>
 
         </a>
  
Line 146: Line 149:
 
                 style="background-image: url(&#39;../assets/comp_layout.png&#39;)">
 
                 style="background-image: url(&#39;../assets/comp_layout.png&#39;)">
 
             </div>
 
             </div>
             <span class="mdl-components__link-text">Layout</span>
+
             <span class="mdl-components__link-text">Demonstrate</span>
 
         </a>
 
         </a>
  
Line 154: Line 157:
 
                 style="background-image: url(&#39;../assets/comp_lists.png&#39;)">
 
                 style="background-image: url(&#39;../assets/comp_lists.png&#39;)">
 
             </div>
 
             </div>
             <span class="mdl-components__link-text">Lists</span>
+
             <span class="mdl-components__link-text">Prospect</span>
 
         </a>
 
         </a>
  
        <a href="https://getmdl.io/components/index.html#loading-section"
 
          class="mdl-components__link mdl-component loading">
 
            <div class="mdl-components__link-image"
 
                style="background-image: url(&#39;../assets/comp_loading.png&#39;)">
 
            </div>
 
            <span class="mdl-components__link-text">Loading</span>
 
        </a>
 
 
        <a href="https://getmdl.io/components/index.html#menus-section"
 
          class="mdl-components__link mdl-component menus">
 
            <div class="mdl-components__link-image"
 
                style="background-image: url(&#39;../assets/comp_menus.png&#39;)">
 
            </div>
 
            <span class="mdl-components__link-text">Menus</span>
 
        </a>
 
 
        <a href="https://getmdl.io/components/index.html#sliders-section"
 
          class="mdl-components__link mdl-component sliders">
 
            <div class="mdl-components__link-image"
 
                style="background-image: url(&#39;../assets/comp_sliders.png&#39;)">
 
            </div>
 
            <span class="mdl-components__link-text">Sliders</span>
 
        </a>
 
 
        <a href="https://getmdl.io/components/index.html#snackbar-section"
 
          class="mdl-components__link mdl-component snackbar">
 
            <div class="mdl-components__link-image"
 
                style="background-image: url(&#39;../assets/comp_snackbar.png&#39;)">
 
            </div>
 
            <span class="mdl-components__link-text">Snackbar</span>
 
        </a>
 
 
        <a href="https://getmdl.io/components/index.html#toggles-section"
 
          class="mdl-components__link mdl-component toggles">
 
            <div class="mdl-components__link-image"
 
                style="background-image: url(&#39;../assets/comp_toggles.png&#39;)">
 
            </div>
 
            <span class="mdl-components__link-text">Toggles</span>
 
        </a>
 
 
        <a href="https://getmdl.io/components/index.html#tables-section"
 
          class="mdl-components__link mdl-component tables">
 
            <div class="mdl-components__link-image"
 
                style="background-image: url(&#39;../assets/comp_tables.png&#39;)">
 
            </div>
 
            <span class="mdl-components__link-text">Tables</span>
 
        </a>
 
 
        <a href="https://getmdl.io/components/index.html#textfields-section"
 
          class="mdl-components__link mdl-component textfields">
 
            <div class="mdl-components__link-image"
 
                style="background-image: url(&#39;../assets/comp_textfields.png&#39;)">
 
            </div>
 
            <span class="mdl-components__link-text">Text Fields</span>
 
        </a>
 
 
        <a href="https://getmdl.io/components/index.html#tooltips-section"
 
          class="mdl-components__link mdl-component tooltips">
 
            <div class="mdl-components__link-image"
 
                style="background-image: url(&#39;../assets/comp_tooltips.png&#39;)">
 
            </div>
 
            <span class="mdl-components__link-text">Tooltips</span>
 
        </a>
 
  
 
     </aside>
 
     </aside>

Revision as of 03:54, 17 October 2017

Peking iGEM 2017