Template:MainStyle/Menu

From 2014.igem.org

(Difference between revisions)
 
(2 intermediate revisions not shown)
Line 1: Line 1:
<html>
<html>
-
<style type="text/css">
+
<!--MENU-->
-
#contentSub, #footer-box, #catlinks, #search-controls, #p-logo, .printfooter, .firstHeading,.visualClear {display: none;} /*-- hides default wiki settings --*/
+
<table id="menu" width="100%"  cellspacing="0" align="center">
-
#top-section { /*-- styling for default menu bar (edit, page, history, etc.) --*/
+
<tr >
-
+
<td ></td>
-
border: 0 none;
+
-
height: 14px;
+
-
z-index: 100;
+
-
top: 0;
+
-
position: fixed;
+
-
width: 975px;
+
-
left: 50%;
+
-
margin-left: -487px;
+
-
}
+
-
#globalWrapper, #content { /*-- changes default wiki settings --*/
+
<td width="975px"  align="center">
-
width: 100%;
+
-
height: 100%;
+
-
border: 0px;
+
-
background-color: transparent;
+
-
margin: 0px;
+
-
padding: 0px;
+
-
}
+
-
html, body, .wrapper { /*-- changes default wiki settings --*/
+
<table width="975px">
-
width: 100%;
+
<td width="2%" ></td>
-
height: 100%;
+
<td><img src="https://static.igem.org/mediawiki/igem.org/6/60/Igemlogo_300px.png" width="60px"></td>
-
background-color: transparent;
+
-
}
+
-
</style>
+
-
<!--  here ends the section that changes the default wiki template to a white full width background -->
+
-
</html>
+
-
 
+
<td onMouseOver="this.bgColor='#089E71'" onMouseOut="this.bgColor='#ffffff'" bgColor="#ffffff" width="10%" align="center"> <b> ABOUT </b> </td>
-
<html>
+
<td onMouseOver="this.bgColor='#089E71'" onMouseOut="this.bgColor='#ffffff'" bgColor="#ffffff" width="10%" align="center"><b> PROGRAMS </b> </td>
-
<head>
+
<td onMouseOver="this.bgColor='#089E71'" onMouseOut="this.bgColor='#ffffff'" bgColor="#ffffff" width="10%" align="center"><b> COMMUNITY </b> </td>
-
<style type="text/css">
+
<td onMouseOver="this.bgColor='#089E71'" onMouseOut="this.bgColor='#ffffff'" bgColor="#ffffff" width="10%" align="center"><b> SPONSORS </b> </td>
-
#topNav { /*-- creates styled 100% width fixed navigation bar --*/
+
<td onMouseOver="this.bgColor='#089E71'" onMouseOut="this.bgColor='#ffffff'" bgColor="#ffffff" width="10%" align="center"><b> DONATE </b></td>
-
width: 100%;
+
<td onMouseOver="this.bgColor='#089E71'" onMouseOut="this.bgColor='#ffffff'" bgColor="#ffffff" width="10%" align="center"><b> CONTACT </b> </td>
-
position: fixed;
+
-
top: 14px;
+
-
height: 50px;
+
-
background-color: #414141;
+
-
z-index: 1000;
+
-
}
+
-
 
+
-
#navContainer { /*-- creates centered container for nav bar --*/
+
-
width: 75px;
+
-
margin: 0px auto;
+
-
position: relative;
+
-
font-family: Arial, sans-serif;
+
-
}
+
-
 
+
-
.navLinks { /*-- clears style for nav bar ul --*/
+
-
margin: 0px;
+
-
height: 100%;
+
-
}
+
-
 
+
-
.navLinks li { /*-- styles nav bar li, the nav bar elements --*/
+
-
display: inline-block;
+
-
float: left;
+
-
font-size: 12px;
+
-
height: 49px;
+
-
padding: 0px;
+
-
margin: 0px;
+
-
border: 1px solid transparent;
+
-
}
+
-
 
+
-
.navLinks li:hover {
+
-
background-color: #fff;
+
-
border: 1px solid #ccc;
+
-
border-bottom: 1px solid #fff;
+
-
}
+
-
 
+
-
.navLinks > .navSingleLink:hover  {
+
-
border-bottom: 1px solid #ccc;
+
-
}
+
-
 
+
-
.navLinks li > a {  /*-- styles the links within the nav bar li --*/
+
-
text-decoration: none;
+
-
line-height: 50px;
+
-
color: #000;
+
-
padding-left: 30px;
+
-
padding-right: 30px;
+
-
display: block;
+
-
height: 100%;
+
-
}
+
-
 
+
-
.navlinks li > a:hover {
+
-
color: #fff;
+
-
 
+
-
}
+
-
.navDropMenu {  /*-- the drop down box --*/
+
-
width: 100%;
+
-
position: absolute;
+
-
top: 50px;
+
-
left: 0px;
+
-
display: none;
+
-
background-color: #fff;
+
-
border-bottom: 1px solid #ccc;
+
-
z-index: -100;
+
-
padding: 20px 0px;
+
-
border: 1px solid #ccc;
+
-
}
+
-
 
+
-
.navDropMenu li {  /*-- the drop down box --*/
+
-
display: block;
+
-
float: none;
+
-
list-style: none;
+
-
height: auto;
+
-
padding: 3px 6px;
+
-
margin: 0px;
+
-
border: 0px;
+
-
}
+
-
.navDropMenu li:hover {
+
-
border: 0px;
+
-
}
+
-
 
+
-
.navDropMenu li a {  /*-- styles the links within the nav bar li --*/
+
-
text-decoration: none;
+
-
color: #333;
+
-
display: block;
+
-
height: auto;
+
-
line-height: normal;
+
-
padding: 4px 0px 4px 6px;
+
-
}
+
-
 
+
-
.navDropMenu li a:hover {  /*-- styles the links within the nav bar li --*/
+
-
background-color: #f0f0f0;
+
-
color: #484848;
+
-
}
+
-
 
+
-
.navLinks > li:hover > .navDropMenu {
+
-
display: block;
+
-
}
+
-
 
+
-
.menuHeader { border-bottom: 1px solid #ccc; display: block; font-weight: bold; font-family: Georgia, Times, "Times New Roman", serif; }
+
-
</style>
+
-
 
+
-
<style type="text/css" media="print">
+
-
#topNav { display: none;}
+
-
</style>
+
-
</head>
+
-
<div id="top-section-bar"></div>
+
-
<header id="topNav">
+
-
<nav id="navContainer">
+
-
<ul class="navLinks">
+
-
<li class="navSingleLink">
+
-
<a href="https://2014.igem.org" style="padding-left: 10px; padding-right: 10px;"><img src="https://static.igem.org/mediawiki/2014/2/22/Logo2014v2.png" /></a>
+
-
</li>
+
-
<li>
+
-
<a href="#">ABOUT</a>
+
-
<div class="navDropMenu">
+
-
</html>{{Nav/About}}<html>
+
-
</div>
+
-
</li>
+
-
<li>
+
-
<a href="#" class="dropToggle">COMPETITION</a>
+
-
<div class="navDropMenu">
+
-
</html>{{Nav/Competition}}<html>
+
-
</div>
+
-
</li>
+
-
<li>
+
-
<a href="#">TEAMS</a>
+
-
<div class="navDropMenu">
+
-
</html>{{Nav/Teams}}<html>
+
-
</div>
+
-
</li>
+
-
<li>
+
-
<a href="#">RESOURCES</a>
+
-
<div class="navDropMenu">
+
-
</html>{{Nav/Resources}}<html>
+
-
</div>
+
-
</li>
+
-
<li class="navSingleLink">
+
-
<a href="https://igem.org/Contact">CONTACT</a>
+
-
</li>
+
-
</ul>
+
-
</nav>
+
-
</header>
+
-
<html>
+
 +
</table>
 +
</td>
 +
<td></td>
 +
</tr>
 +
</table>
</html>
</html>

Latest revision as of 18:18, 9 July 2014

Retrieved from "http://2014.igem.org/Template:MainStyle/Menu"