Team:Wageningen UR/Templates/HeaderFooterStyle

From 2011.igem.org

(Difference between revisions)
 
(30 intermediate revisions not shown)
Line 1: Line 1:
<html>
<html>
 +
<head>
 +
<style>
 +
#smoothmenu1 ul {
 +
list-style: none;
 +
}
-
<head>
+
#smoothmenu2 ul {
 +
list-style: none;
 +
}
-
 
+
.ddsmoothmenu{
-
  <style type="text/css">
+
font: bold 12px 'Quattrocento', arial, sans;
 +
background: #244F62; /*background of menu bar (default state)*/
 +
margin:0px 5px 0px 5px;
 +
}
-
  @import url(http://fonts.googleapis.com/css?family=Crimson+Text);
+
.ddsmoothmenu ul{
 +
z-index:100;
 +
margin: 0;
 +
padding: 0;
 +
list-style-type: none;
 +
}
-
  @import url(http://fonts.googleapis.com/css?family=Ubuntu);
+
/*Top level list items*/
 +
.ddsmoothmenu ul li{
 +
position: relative;
 +
display: inline;
 +
float: left;
 +
}
-
   
+
/*Top level menu link items style*/
 +
.ddsmoothmenu ul li a{
 +
display: block;
 +
background: #244F62; /*background of menu items (default state)*/
 +
padding: 8px 10px;
 +
color: white;
 +
border-right: 1px solid #298BB6;
 +
color: #2d2b2b;
 +
text-decoration: none;
 +
padding-left: 20px;
 +
}
-
h2 {
+
* html .ddsmoothmenu ul li a{ /*IE6 hack to get sub menu links to behave correctly*/
 +
display: inline-block;
 +
}
-
  font-family: 'Ubuntu', serif;  
+
.ddsmoothmenu ul li a:link, .ddsmoothmenu ul li a:visited{
 +
color: white;
 +
}
-
  font-size: 19px;
+
.ddsmoothmenu ul li a.selected{ /*CSS class that's dynamically added to the currently active menu items' LI A element*/
-
 
+
background: #096790;  
-
  color: white;
+
color: white;
-
 
+
}
-
  text-shadow: 0 3px 0 #372c24;
+
-
 
+
-
  text-decoration: none;
+
-
 
+
-
  background-image: url('https://static.igem.org/mediawiki/2011/5/5a/Mainbackground-blue2.png');
+
-
 
+
-
  background-repeat: repeat-x;
+
-
 
+
-
  width: 99.5%;
+
-
 
+
-
  padding-left: 5px;
+
-
 
+
-
  margin-left: 225px;
+
-
 
+
-
  /* margin-top: 100px; */
+
-
 
+
-
}
+
-
 
+
-
 
+
-
 
+
-
h3 {
+
-
 
+
-
  font-family: 'Ubuntu', serif;
+
-
 
+
-
  font-size: 15px;
+
-
 
+
-
  color: #005172;
+
-
 
+
-
  padding-left: 5px;
+
-
 
+
-
  margin: 0 0.5em 0 22%;
+
-
 
+
-
  }
+
-
 
+
-
 
+
-
 
+
-
h4 {
+
-
 
+
-
  font-family: 'Ubuntu', serif;
+
-
 
+
-
  font-size: 13px;
+
-
 
+
-
  color: #507d95;
+
-
 
+
-
  padding-left: 5px;
+
-
 
+
-
  margin: 0 0.5em 0 22%;
+
-
 
+
-
  } 
+
-
 
+
-
 
+
-
 
+
-
  p {
+
-
  color: white;
+
-
+
-
  font-size: 14px;
+
-
 
+
-
  text-align: justify;
+
-
 
+
-
  padding: auto;
+
-
 
+
-
  }
+
-
 
+
-
 
+
-
 
+
-
a:link {
+
-
 
+
-
color: white;
+
-
 
+
-
text-decoration: none;
+
-
 
+
-
font-family: 'Ubuntu', serif;
+
-
 
+
-
        font-size: 13px;
+
-
 
+
-
        font-weight: bold;
+
-
 
+
-
}
+
-
 
+
-
 
+
-
 
+
-
        a:visited {
+
-
 
+
-
        color: white;
+
-
 
+
-
text-decoration: none;
+
-
 
+
-
font-family: 'Ubuntu', serif;
+
-
 
+
-
        font-size: 13px;
+
-
 
+
-
        font-weight: bold;
+
-
 
+
-
        }
+
-
 
+
-
 
+
-
 
+
-
        a:hover {
+
-
 
+
-
color: white;
+
-
 
+
-
text-decoration: none;
+
-
 
+
-
font-family: 'Ubuntu', serif;
+
-
 
+
-
        font-size: 13px;
+
-
 
+
-
        font-weight: bold;
+
-
 
+
-
}
+
-
 
+
-
 
+
-
 
+
-
        a:active {
+
-
 
+
-
        color: white;
+
-
 
+
-
text-decoration: none;
+
-
 
+
-
font-family: 'Ubuntu', serif;
+
-
 
+
-
        font-size: 13px;
+
-
 
+
-
        font-weight: bold;
+
-
 
+
-
        }
+
-
 
+
-
 
+
-
 
+
-
        /* Wiki Hacks - START */
+
-
 
+
-
/* Author: Pieter van Boheemen */
+
-
 
+
-
/* Team: TU Delft */
+
-
 
+
-
/* modified slightly for the Wageningen UR Team */
+
 +
.ddsmoothmenu ul li a:hover{
 +
background: #096790;
 +
}
 +
/*1st sub level menu*/
 +
.ddsmoothmenu ul li ul{
 +
position: absolute;
 +
left: 0;
 +
display: none; /*collapse all sub menus to begin with*/
 +
visibility: hidden;
 +
}
-
#globalWrapper
+
/*Sub level menu list items (undo style from Top level List Items)*/
-
 
+
.ddsmoothmenu ul li ul li{
-
{
+
display: list-item;
-
 
+
float: none;
-
background-color: black;
+
}
-
+
-
        background-repeat: repeat-x;
+
-
 
+
-
border: none;
+
-
 
+
-
margin: 0;
+
-
 
+
-
padding: 0;
+
-
 
+
-
width: 100%;
+
-
 
+
-
height: 100%;
+
-
 
+
-
}
+
-
 
+
-
+
-
 
+
-
#content
+
-
 
+
-
{
+
-
        background-color: #005172;
+
-
 
+
-
        background-repeat: repeat-x;
+
-
 
+
-
border: none;
+
-
   
+
-
padding: -40px 0 0 0;
+
-
 
+
-
margin: auto;
+
-
 
+
-
width: 78%;
+
-
 
+
-
overflow: hidden;
+
-
 
+
-
height: 100%;
+
-
 
+
-
}
+
-
 
+
-
+
-
 
+
-
#bodyContent
+
-
 
+
-
{
+
-
        background-color: #005172;
+
-
 
+
-
border: none;
+
-
 
+
-
padding: 0;
+
-
 
+
-
margin: 0;
+
-
 
+
-
width:100%;
+
-
 
+
-
height:100%;
+
-
 
+
-
}
+
-
 
+
-
+
-
 
+
-
#top-section
+
-
 
+
-
{
+
-
 
+
-
height: 15px;
+
-
 
+
-
margin: 0px;
+
-
 
+
-
margin-left: auto;
+
-
 
+
-
margin-right: auto;
+
-
 
+
-
margin-bottom: 0 !important;
+
-
 
+
-
padding: 0;
+
-
 
+
-
border: none;
+
-
 
+
-
font-size: 10px;
+
-
 
+
-
}
+
-
 
+
-
+
-
 
+
-
#p-logo
+
-
 
+
-
{
+
-
 
+
-
height: 1px;
+
-
 
+
-
overflow: hidden;
+
-
 
+
-
display: none;
+
-
 
+
-
}
+
-
 
+
-
     
+
-
 
+
-
      #search-controls
+
-
 
+
-
{
+
-
 
+
-
overflow: hidden;
+
-
 
+
-
display: none;
+
-
 
+
-
background: none;
+
-
 
+
-
position: float right;
+
-
 
+
-
}
+
-
 
+
-
       
+
-
 
+
-
      #footer-box
+
-
 
+
-
{
+
-
 
+
-
        background-color: #005172;
+
-
 
+
-
width: 78%;
+
-
 
+
-
margin: -10px auto 0 auto;
+
-
 
+
-
padding: 20px 1em;
+
-
 
+
-
}
+
-
 
+
-
       
+
-
 
+
-
        .visualClear
+
-
 
+
-
{
+
-
 
+
-
display: none;
+
-
 
+
-
}
+
-
 
+
-
+
-
 
+
-
#footer
+
-
 
+
-
{
+
-
border: none;
+
-
 
+
-
width: 965px;
+
-
 
+
-
margin: 0 auto;
+
-
 
+
-
padding: 0;
+
-
 
+
-
}
+
-
 
+
-
+
-
 
+
-
.firstHeading
+
-
 
+
-
{
+
-
 
+
-
display: none;
+
-
 
+
-
}
+
-
 
+
-
+
-
 
+
-
#f-list a
+
-
 
+
-
{
+
-
 
+
-
color: white;
+
-
 
+
-
font-size: 10px;
+
-
 
+
-
}
+
-
 
+
-
+
-
 
+
-
#f-list a:hover
+
-
 
+
-
{
+
-
 
+
-
color: #4f7c94;
+
-
 
+
-
}
+
-
 
+
-
+
-
 
+
-
.printfooter
+
-
 
+
-
{
+
-
 
+
-
display: none;
+
-
 
+
-
}
+
-
 
+
-
+
-
 
+
-
#footer ul  
+
-
 
+
-
{
+
-
        background-color: transparent;
+
-
 
+
-
margin: 0;
+
-
 
+
-
padding: 0;
+
-
 
+
-
}
+
-
 
+
-
+
-
 
+
-
#footer ul li  
+
-
 
+
-
{  
+
-
        background-color: transparent;
+
-
 
+
-
margin-top: 0;  
+
-
 
+
-
margin-bottom: 0;
+
-
 
+
-
margin-left: 10px;
+
-
 
+
-
margin-right: 10px;
+
-
 
+
-
padding: 0;
+
-
 
+
-
}
+
-
 
+
-
+
-
 
+
-
/* Wiki Hacks - END */
+
-
 
+
-
 
+
-
 
+
-
  #sideBar
+
-
 
+
-
{
+
-
 
+
-
  background-image: url('https://static.igem.org/mediawiki/2011/4/47/NavigationBackground-orange_WUR.png');
+
-
+
-
  background-repeat: repeat-y;
+
-
 
+
-
  color: transparent;
+
-
 
+
-
  float: left;
+
-
 
+
-
  width: 200px;
+
-
 
+
-
  height: 100%;
+
-
 
+
-
  padding: 0 1em 0 0;
+
-
 
+
-
  margin: 0px 20px 10px 0;
+
-
 
+
-
  }
+
-
 
+
-
 
+
-
 
+
-
#navMenupoint {
+
-
 
+
-
  background: transparent;
+
-
 
+
-
  background-image: url('https://static.igem.org/mediawiki/2011/e/e0/1menubar.png');
+
-
 
+
-
  background-repeat: no-repeat;
+
-
 
+
-
  background-position: 3% 50%;
+
-
 
+
-
  height: 34px;
+
-
 
+
-
  padding-top: 12px;
+
-
 
+
-
  padding-left: 37px;
+
-
 
+
-
  margin: 0 0 0 1em;
+
-
 
+
-
  border-style: solid;
+
-
 
+
-
  border-width: 2px;
+
-
 
+
-
  border-color: transparent;
+
-
 
+
-
  }
+
-
 
+
-
 
+
-
 
+
-
#navMenupoint.hovered, #navMenupoint:hover {
+
-
 
+
-
    background-image: url('https://static.igem.org/mediawiki/2011/4/43/3menubar.png');
+
-
 
+
-
}
+
-
 
+
-
+
-
 
+
-
#header {
+
-
 
+
-
  background-image: url('https://static.igem.org/mediawiki/2011/4/4e/Igemlogofinal_compr.png');
+
-
 
+
-
  background-color: black;
+
-
 
+
-
  background-position: 25px;
+
-
 
+
-
  background-repeat: no-repeat;
+
-
 
+
-
  margin: -40px 0 10px 0;
+
-
 
+
-
  height: 120px;
+
-
 
+
-
  width: 100%;
+
-
 
+
-
  }
+
 +
/*All subsequent sub menu levels vertical offset after 1st level sub menu */
 +
.ddsmoothmenu ul li ul li ul{
 +
top: 0;
 +
}
 +
/* Sub level menu links style */
 +
.ddsmoothmenu ul li ul li a{
 +
font: normal 13px 'Quattrocento', arial, sans;
 +
width: 160px; /*width of sub menus*/
 +
height: 20px;
 +
margin: 0;
 +
padding-left: 37px;
 +
padding-top: 10px;
 +
}
-
  </style>
+
.ddsmoothmenu ul li ul li a:hover{
 +
background: #096790 url('https://static.igem.org/mediawiki/2011/4/43/3menubar.png') center left no-repeat;
 +
}
 +
</style>
 +
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 +
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 +
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
-
  </head>
+
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
 +
<script type="text/javascript" src="http://www.dynamicdrive.com/dynamicindex1/ddsmoothmenu.js">
 +
/***********************************************
 +
* Smooth Navigational Menu- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
 +
* This notice MUST stay intact for legal use
 +
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
 +
***********************************************/
 +
</script>
-
  <body>
+
<script type="text/javascript">
-
  <link rel="shortcut icon" href="https://static.igem.org/mediawiki/2011/b/bf/Favico_compr2_WUR.png" />
+
ddsmoothmenu.init({
 +
mainmenuid: "smoothmenu1", //menu DIV id
 +
orientation: 'h', //Horizontal or vertical menu: Set to "h" or "v"
 +
classname: 'ddsmoothmenu', //class added to menu's outer DIV
 +
//customtheme: ["#1c5a80", "#18374a"],
 +
contentsource: "markup" //"markup" or ["container_id", "path_to_menu_file"]
 +
})
-
  <div id ="header">
+
</script>
 +
</head>
 +
<body>
-
   </div>
+
<div id="smoothmenu1" class="ddsmoothmenu">
 +
<ul>
 +
<li><a href="#">Project Description</a>
 +
<ul>
 +
   <li><a href="https://2011.igem.org/Team:Wageningen_UR/Project/IntroductionProj1">Abstract</a></li>
 +
  <li><a href="https://2011.igem.org/Team:Wageningen_UR/Project/CompleteProject1Description" style="padding-top: 5px !important; height: 28px;">Complete Project Description</a></li>
 +
</ul>
 +
</li>
 +
<li><a href="https://2011.igem.org/Team:Wageningen_UR/Project/Devices" style="padding-right: 20px !important;">Devices</a></li>
 +
<li><a href="https://2011.igem.org/Team:Wageningen_UR/Project/ModelingProj1" style="padding-right: 20px !important;">Modeling</a></li>
 +
<li><a href="https://2011.igem.org/Team:Wageningen_UR/Project/NotebookProj1">Notebook</a>
 +
  <ul>
 +
  <li><a href="https://2011.igem.org/Team:Wageningen_UR/Notebook/Proj1/February" target="_self">February</a></li>
 +
  <li><a href="https://2011.igem.org/Team:Wageningen_UR/Notebook/Proj1/March" target="_self">March</a></li>
 +
  <li><a href="https://2011.igem.org/Team:Wageningen_UR/Notebook/Proj1/April" target="_self">April</a></li>
 +
  <li><a href="https://2011.igem.org/Team:Wageningen_UR/Notebook/Proj1/May" target="_self">May</a></li>
 +
  <li><a href="https://2011.igem.org/Team:Wageningen_UR/Notebook/Proj1/June" target="_self">June</a></li>
 +
  <li><a href="https://2011.igem.org/Team:Wageningen_UR/Notebook/Proj1/July" target="_self">July</a></li>
 +
  <li><a href="https://2011.igem.org/Team:Wageningen_UR/Notebook/Proj1/August" target="_self">August</a></li>
 +
  <li><a href="https://2011.igem.org/Team:Wageningen_UR/Notebook/Proj1/September" target="_self">September</a></li>
 +
  </ul>
 +
</li>
 +
<li><a href="https://2011.igem.org/Team:Wageningen_UR/Project/PartsProj1" style="padding-right: 20px !important;">Parts submitted to the registry</a></li>
 +
</ul>
 +
<br style="clear: left" />
 +
</div>
-
  </body>
 
-
  </html>
+
</body>
 +
</html>

Latest revision as of 22:22, 28 July 2011