Difference between revisions of "Template:Peking/NavBar"

 
(21 intermediate revisions by the same user not shown)
Line 44: Line 44:
 
     <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="https://2017.igem.org/Template:Peking/mdl/MDLnew?action=raw&ctype=text/css">
 +
 +
 +
 +
  
 
     <link rel="stylesheet" type="text/css"
 
     <link rel="stylesheet" type="text/css"
Line 57: Line 61:
  
  
<!-- 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. -->
 
<!-- Always shows a header, even in smaller screens. -->
Line 68: Line 73:
 
         <div class="mdl-layout__header-row">
 
         <div class="mdl-layout__header-row">
 
             <!-- Title -->
 
             <!-- Title -->
             <span class="mdl-layout-title">Title</span>
+
             <a href="https://2017.igem.org/Team:Peking"><img src="https://static.igem.org/mediawiki/2017/c/cf/Peking_TeamLogoClassical.png" height="35"></a>
 +
 
 +
            <a class="mdl-navigation__link" href="https://2017.igem.org/Team:Peking" style="color: #000000; font-size: x-large"><strong>Peking iGEM </strong> 2017</a>
 
             <!-- 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. We hide it in small screens. -->
 
             <!-- Navigation. We hide it in small screens. -->
 
             <nav class="mdl-navigation mdl-layout--large-screen-only">
 
             <nav class="mdl-navigation mdl-layout--large-screen-only">
                 <a class="mdl-navigation__link" href="">Link</a>
+
                <style>
                 <a class="mdl-navigation__link" href="">Link</a>
+
                    a:link {text-decoration: none;}
                 <a class="mdl-navigation__link" href="">Link</a>
+
                    a:visited {text-decoration: none;}
                 <a class="mdl-navigation__link" href="">Link</a>
+
                    a:active {text-decoration: none;}
 +
                    a:hover {}
 +
                </style>
 +
                <a class="mdl-navigation__link" href="https://2017.igem.org/Team:Peking">Home</a>
 +
                <a class="mdl-navigation__link" href="" style="color: #000; font-weight: 500 ">Project</a>
 +
                <a class="mdl-navigation__link" href="">Modelling</a>
 +
                <a class="mdl-navigation__link" href="">Software</a>
 +
                <a class="mdl-navigation__link" href="">Hardware</a>
 +
                 <a class="mdl-navigation__link" href="">Lab</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>
 
             </nav>
 
             </nav>
 
         </div>
 
         </div>
Line 86: Line 104:
 
     <aside class="mdl-components__nav docs-text-styling mdl-shadow--4dp">
 
     <aside class="mdl-components__nav docs-text-styling mdl-shadow--4dp">
  
         <a href="https://getmdl.io/components/index.html#badges-section"
+
         <a href="https://getmdl.io/components/index.html#Background"
           class="mdl-components__link mdl-component badges">
+
           class="mdl-components__link mdl-component Background">
 
             <div class="mdl-components__link-image"
 
             <div class="mdl-components__link-image"
 
                 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" style="font-size: medium">Background</span>
 
         </a>
 
         </a>
  
         <a href="https://getmdl.io/components/index.html#buttons-section"
+
         <a href="https://getmdl.io/components/index.html#Introduction"
           class="mdl-components__link mdl-component buttons">
+
           class="mdl-components__link mdl-component Introduction">
 
             <div class="mdl-components__link-image"
 
             <div class="mdl-components__link-image"
 
                 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" style="font-size: medium">Introduction</span>
 
         </a>
 
         </a>
  
         <a href="https://getmdl.io/components/index.html#cards-section"
+
         <a href="https://getmdl.io/components/index.html#Flip-flop"
           class="mdl-components__link mdl-component cards">
+
           class="mdl-components__link mdl-component FF">
 
             <div class="mdl-components__link-image"
 
             <div class="mdl-components__link-image"
 
                 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"style="font-size: medium">Flip-flop</span>
 
         </a>
 
         </a>
  
         <a href="https://getmdl.io/components/index.html#chips-section"
+
         <a href="https://getmdl.io/components/index.html#Controller"
           class="mdl-components__link mdl-component chips">
+
           class="mdl-components__link mdl-component CU">
 
             <div class="mdl-components__link-image"
 
             <div class="mdl-components__link-image"
 
                 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"style="font-size: medium">Controller</span>
 
         </a>
 
         </a>
  
         <a href="https://getmdl.io/components/index.html#dialog-section"
+
         <a href="https://getmdl.io/components/index.html#Clock"
           class="mdl-components__link mdl-component dialog">
+
           class="mdl-components__link mdl-component Clock">
 
             <div class="mdl-components__link-image"
 
             <div class="mdl-components__link-image"
 
                 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" style="font-size: medium">Clock</span>
 
         </a>
 
         </a>
  
         <a href="https://getmdl.io/components/index.html#layout-section"
+
         <a href="https://getmdl.io/components/index.html#Demonstrate"
           class="mdl-components__link mdl-component layout">
+
           class="mdl-components__link mdl-component Demonstrate">
 
             <div class="mdl-components__link-image"
 
             <div class="mdl-components__link-image"
 
                 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" style="font-size: medium">Demonstrate</span>
 
         </a>
 
         </a>
  
         <a href="https://getmdl.io/components/index.html#lists-section"
+
         <a href="https://getmdl.io/components/index.html#Prospect"
           class="mdl-components__link mdl-component lists">
+
           class="mdl-components__link mdl-component Prospect">
 
             <div class="mdl-components__link-image"
 
             <div class="mdl-components__link-image"
 
                 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" style="font-size: medium">Prospect</span>
        </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>
 
         </a>
  
 
     </aside>
 
     </aside>
  
 +
    <section id="Background" class="mdl-components__page mdl-grid">
 +
        <p>1223</p>
 +
    </section>
 +
    <section id="Introduction" class="mdl-components__page mdl-grid">
 +
        <p>2334</p>
 +
    </section>
 
</div>
 
</div>
 +
  
  

Latest revision as of 04:18, 17 October 2017

Peking iGEM 2017