Team:Frankfurt/NavBarTemp

From 2013.igem.org

(Difference between revisions)
Line 1: Line 1:
<html>
<html>
-
<ul id="menu">
+
<head>
-
<li><a href="#">Home</a></li>
+
<title>NavBar</title>
-
<li>
+
<style type="text/css">
-
<a href="#">Categories</a>
+
/* Main */
-
<ul>
+
#menu{
-
<li><a href="#">CSS</a></li>
+
width: 100%;
-
<li><a href="#">Graphic design</a></li>
+
margin: 0;
-
<li><a href="#">Development tools</a></li>
+
padding: 10px 0 0 0;
-
<li><a href="#">Web design</a></li>
+
list-style: none; 
-
</ul>
+
background: #111;
-
</li>
+
background: -moz-linear-gradient(#444, #111);
-
<li><a href="#">Work</a></li>
+
        background: -webkit-gradient(linear,left bottom,left top,color-stop(0, #111),color-stop(1, #444));
-
<li><a href="#">About</a></li>
+
background: -webkit-linear-gradient(#444, #111);
-
<li><a href="#">Contact</a></li>
+
background: -o-linear-gradient(#444, #111);
-
</ul>
+
background: -ms-linear-gradient(#444, #111);
 +
background: linear-gradient(#444, #111);
 +
-moz-border-radius: 50px;
 +
border-radius: 50px;
 +
-moz-box-shadow: 0 2px 1px #9c9c9c;
 +
-webkit-box-shadow: 0 2px 1px #9c9c9c;
 +
box-shadow: 0 2px 1px #9c9c9c;
 +
}
 +
 
 +
#menu li{
 +
float: left;
 +
padding: 0 0 10px 0;
 +
position: relative;
 +
}
 +
 
 +
#menu a{
 +
float: left;
 +
height: 25px;
 +
padding: 0 25px;
 +
color: #999;
 +
text-transform: uppercase;
 +
font: bold 12px/25px Arial, Helvetica;
 +
text-decoration: none;
 +
text-shadow: 0 1px 0 #000;
 +
}
 +
 
 +
#menu li:hover > a{
 +
color: #fafafa;
 +
}
 +
 
 +
*html #menu li a:hover{ /* IE6 */
 +
color: #fafafa;
 +
}
 +
 
 +
#menu li:hover > ul{
 +
display: block;
 +
}
 +
 
 +
/* Sub-menu */
 +
 
 +
#menu ul{
 +
    list-style: none;
 +
    margin: 0;
 +
    padding: 0;   
 +
    display: none;
 +
    position: absolute;
 +
    top: 35px;
 +
    left: 0;
 +
    z-index: 99999;   
 +
    background: #444;
 +
    background: -moz-linear-gradient(#444, #111);
 +
    background: -webkit-gradient(linear,left bottom,left top,color-stop(0, #111),color-stop(1, #444));
 +
    background: -webkit-linear-gradient(#444, #111);   
 +
    background: -o-linear-gradient(#444, #111);
 +
    background: -ms-linear-gradient(#444, #111);
 +
    background: linear-gradient(#444, #111);
 +
    -moz-border-radius: 5px;
 +
    border-radius: 5px;
 +
}
 +
 
 +
#menu ul li{
 +
    float: none;
 +
    margin: 0;
 +
    padding: 0;
 +
    display: block; 
 +
    -moz-box-shadow: 0 1px 0 #111111, 0 2px 0 #777777;
 +
    -webkit-box-shadow: 0 1px 0 #111111, 0 2px 0 #777777;
 +
    box-shadow: 0 1px 0 #111111, 0 2px 0 #777777;
 +
}
 +
 
 +
#menu ul li:last-child{ 
 +
    -moz-box-shadow: none;
 +
    -webkit-box-shadow: none;
 +
    box-shadow: none;   
 +
}
 +
 
 +
#menu ul a{   
 +
    padding: 10px;
 +
    height: auto;
 +
    line-height: 1;
 +
    display: block;
 +
    white-space: nowrap;
 +
    float: none;
 +
    text-transform: none;
 +
}
 +
 
 +
*html #menu ul a{ /* IE6 */ 
 +
height: 10px;
 +
width: 150px;
 +
}
 +
 
 +
*:first-child+html #menu ul a{ /* IE7 */   
 +
height: 10px;
 +
width: 150px;
 +
}
 +
 
 +
#menu ul a:hover{
 +
        background: #0186ba;
 +
background: -moz-linear-gradient(#04acec,  #0186ba);
 +
background: -webkit-gradient(linear, left top, left bottom, from(#04acec), to(#0186ba));
 +
background: -webkit-linear-gradient(#04acec,  #0186ba);
 +
background: -o-linear-gradient(#04acec,  #0186ba);
 +
background: -ms-linear-gradient(#04acec,  #0186ba);
 +
background: linear-gradient(#04acec,  #0186ba);
 +
}
 +
 
 +
#menu ul li:first-child a{
 +
    -moz-border-radius: 5px 5px 0 0;
 +
    -webkit-border-radius: 5px 5px 0 0;
 +
    border-radius: 5px 5px 0 0;
 +
}
 +
 
 +
#menu ul li:first-child a:after{
 +
    content: '';
 +
    position: absolute;
 +
    left: 30px;
 +
    top: -8px;
 +
    width: 0;
 +
    height: 0;
 +
    border-left: 5px solid transparent;
 +
    border-right: 5px solid transparent;
 +
    border-bottom: 8px solid #444;
 +
}
 +
 
 +
#menu ul li:first-child a:hover:after{
 +
    border-bottom-color: #04acec;
 +
}
 +
 
 +
#menu ul li:last-child a{
 +
    -moz-border-radius: 0 0 5px 5px;
 +
    -webkit-border-radius: 0 0 5px 5px;
 +
    border-radius: 0 0 5px 5px;
 +
}
 +
 
 +
/* Clear floated elements */
 +
#menu:after{
 +
visibility: hidden;
 +
display: block;
 +
font-size: 0;
 +
content: " ";
 +
clear: both;
 +
height: 0;
 +
}
 +
 
 +
* html #menu            { zoom: 1; } /* IE6 */
 +
*:first-child+html #menu { zoom: 1; } /* IE7 */
 +
</style>
 +
</head>
 +
<body>
 +
  <li><a href="/Team:Frankfurt">Home</a></li>
 +
  <li class="dropdown">
 +
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Team <b class="caret"></b></a>
 +
<ul class="dropdown-menu">
 +
  <li><a href="https://2013.igem.org/Team:Frankfurt/Project/Introduction">Who we are</a></li>
 +
  <li><a href="https://2013.igem.org/Team:Frankfurt/Project/Background">Official Team Profile</a></li>
 +
 
 +
  <li><a href="https://2013.igem.org/Team:Frankfurt/Project/Overview">Contact us</a></li>
 +
</ul>
 +
  </li>
 +
  <li class="dropdown">
 +
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Project <b class="caret"></b></a>
 +
<ul class="dropdown-menu">
 +
  <li><a href="https://2013.igem.org/Team:Frankfurt/Project/Description">Description</a></li>
 +
  <li><a href="https://2013.igem.org/Team:Frankfurt/Project/Background">Theoretical Framework</a></li>
 +
  <li><a href="https://2013.igem.org/Team:Frankfurt/Project/Methods">Methods </a></li>
 +
                                          <li class="divider"></li>
 +
  <li><a href="https://2013.igem.org/Team:Frankfurt/Project/Results">Results </a></li>
 +
  <li><a href="https://2013.igem.org/Team:Frankfurt/Project/Perspectives">Perspectives </a></li>
 +
        </ul>
 +
  </li>
 +
  <li><a href="/Team:Frankfurt">Biobricks</a></li>
 +
                                  <li class="dropdown">
 +
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Modeling<b class="caret"></b></a>
 +
<ul class="dropdown-menu">
 +
<!--<li><a href="https://2013.igem.org/Team:Frankfurt/Enzymkinetics">Enzymkinetics</a></li>
 +
<li><a href="https://2013.igem.org/Team:Frankfurt/Pathways">Pathways</a></li>
 +
</ul>
 +
  </li>
 +
  <li class="dropdown">
 +
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Notebook <b class="caret"></b></a>
 +
<ul class="dropdown-menu">
 +
  <li><a href="https://2013.igem.org/Team:Frankfurt/Notebook/Protocol">Protocol</a></li>
 +
  <li><a href="https://2013.igem.org/Team:Frankfurt/Notebook/Journal">Journal</a></li>
 +
<li style="margin-left: 10px;"><a href='/Team:NTU-Taida/Notebook/Journal/March'>March</a></li>
 +
<li style="margin-left: 10px;"><a href='/Team:NTU-Taida/Notebook/Journal/April'>April</a></li>
 +
<li style="margin-left: 10px;"><a href='/Team:NTU-Taida/Notebook/Journal/May'>May</a></li>
 +
<li style="margin-left: 10px;"><a href='/Team:NTU-Taida/Notebook/Journal/June'>June</a></li>
 +
<li style="margin-left: 10px;"><a href='/Team:NTU-Taida/Notebook/Journal/July'>July</a></li>
 +
<li style="margin-left: 10px;"><a href='/Team:NTU-Taida/Notebook/Journal/August'>August</a></li>
 +
<li style="margin-left: 10px;"><a href='/Team:NTU-Taida/Notebook/Journal/September'>September</a></li>
 +
</ul>
 +
  </li>
 +
  <li class="dropdown">
 +
                                        <a class="dropdown-toggle" data-toggle="dropdown" href = "#">Human Practises<b class="caret"></b></a>
 +
                                        <ul class="dropdown-menu">
 +
  <li><a href="https://2013.igem.org/Team:Frankfurt/HumanPractises/NoS">Night of Science</a></li>
 +
  <li><a href="https://2013.igem.org/Team:Frankfurt/HumanPractises/OpenCourse">Open Course</a></li>
 +
   
 +
              <!-- Dropdown User-->
 +
<li class="dropdown" id="nav-user">
 +
<a class="dropdown-toggle" id="nav-login" role="button" data-toggle="dropdown" data-target="#" href=''>
 +
  Login
 +
</a>
 +
<ul class="dropdown-menu" id='nav-usermenu' role="menu" aria-labelledby="nav-login">
 +
  <li><a href='' id='nav-edit'>Edit</a></li>
 +
  <li><a href='' id='nav-history'>History</a></li>
 +
  <li><a href='/Special:Upload' id='nav-upload'>Upload</a></li>
 +
  <li class="divider"></li>
 +
  <li><a href='' id='nav-logout'>Logout</a></li>
 +
</ul>
 +
</li>  
 +
</ul>
 +
  </div>
 +
</div>
 +
  </div>
 +
 
 +
</body>
</html>
</html>

Revision as of 13:45, 2 October 2013

NavBar

  • Home
  • Team
  • Project
  • Biobricks
  • Modeling

    • Retrieved from "http://2013.igem.org/Team:Frankfurt/NavBarTemp"