Difference between revisions of "Team:Oxford/test2"

(Created page with "<html> <link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'> <link href='http://fonts.googleapis.com/css?family=Roboto:700,700italic,400i...")
 
Line 1: Line 1:
 +
<!-- Declare that you are going to use html code instead of wiki code -->
 
<html>
 
<html>
  
Line 61: Line 62:
 
}
 
}
  
−
/* Creates the container for the menu */
+
 
−
#menuContainer  {
+
−
float:top;
+
−
width: 100%;
+
−
padding: 10px 0px;
+
−
                                padding-bottom: 20px;
+
−
border-top: 25px solid #002147;
+
−
                                border-bottom: 25px solid #002147;
+
−
background-color: #002147;
+
−
                              text-align:center;
+
−
}
+
  
 
/* Creates the container for the content */
 
/* Creates the container for the content */
Line 170: Line 161:
 
/*MENU STYLING */
 
/*MENU STYLING */
  
−
/*Styling for the links in the menu */
+
/* Creates the container for the menu */
−
#menuContainer a {
+
#wrap {
−
color: #fff;
+
width: 100%;
−
text-decoration:none;
+
height: 60px;
−
font-weight: 500;
+
margin: 0;
−
                                 font-size: 20px;
+
z-index: 99;
−
font-family: 'Oswald', sans-serif;
+
position: relative;
−
}
+
background-color: #002147;
 +
}
 +
 +
.navbar {
 +
height: 50px;
 +
padding: 0;
 +
margin-left: auto;
 +
                                 margin-right: auto;
 +
position: absolute;
 +
border-right: ;
 +
                             
 +
}
 +
 +
.navbar li {
 +
height: auto;
 +
width: 150px;
 +
float: left;
 +
text-align: center;
 +
list-style: none;
 +
                                        display: inline;
 +
font-family: 'Oswald', sans-serif;  
 +
padding: 0;
 +
margin: 0;
 +
background-color: #002147;
 +
}
  
−
/* Sets the style for lists inside menuContainer  */
+
.navbar a {
−
#menuContainer ul {  
+
padding: 18px 0;  
−
list-style: inline;
+
−
                                color: #002147;
+
−
                              margin-left:auto;
+
text-decoration: none;
−
                                margin-right:auto;
+
color: white;
−
margin-top:0px;
+
display: block;
−
overflow: hidden;
+
}
−
    margin: 0;
+
−
    padding: 0;
+
−
}
+
−
 
+
−
/*Styles the list items to become menu buttons */
+
−
#menuContainer ul li {
+
−
text-align: center;
+
−
display: inline;
+
−
width: 100%;
+
−
height:40px;
+
−
padding-top:0px;
+
−
                                padding-left:15px;
+
−
                                padding-right:15px;
+
−
box-sizing: border-box;
+
−
}
+
−
 
+
−
/*For the menu buttons, changes the color when hovering*/
+
−
#menuContainer li:hover {
+
−
color: #FFF;
+
−
background-color: #002147;
+
−
}
+
−
 
+
−
/*Submenus are not displayed as default*/
+
−
#menuContainer li ul {
+
−
display: none;
+
−
padding-top:17px;
+
−
margin-left: -19px;
+
−
}
+
−
 
+
−
/*Submenus are displayed when hovering the menu button */
+
−
#menuContainer li:hover ul {
+
−
/*display: inline-block; */
+
−
display: block;
+
−
position: absolute;
+
−
                                width: 1000px;
+
−
float: ;
+
−
margin-left: 0px;
+
−
margin-top: 0px;
+
−
}
+
−
 
+
−
/*Style the submenu buttons*/
+
−
#menuContainer li ul li{
+
−
background-color: #002147;
+
−
padding-left:65px;
+
−
padding-right:65px;
+
−
height:550px;
+
−
padding-top:0px;
+
−
margin-top:100px;
+
−
                               
+
−
color: #fff;
+
−
width: 50px;
+
−
text-decoration:none;
+
−
font-weight: 300;
+
−
                                font-size: 16px;
+
−
}
+
  
 +
.navbar li:hover, a:hover {background-color: #002147;}
 +
 +
.navbar li ul {
 +
display: none;
 +
height: auto;
 +
margin: 0;
 +
padding: 0;
 +
}
 +
 +
.navbar li:hover ul {
 +
display: block;
 +
}
 +
 +
.navbar li ul li {background-color: #002147;}
 +
 +
.navbar li ul li a {
 +
 +
}
 +
 +
.navbar li ul li a:hover {background-color: #002147;}
 
/*CLASSES */
 
/*CLASSES */
  
Line 280: Line 260:
  
 
<!-- Start of menu -->
 
<!-- Start of menu -->
−
<div id="menuContainer">
+
<div id="wrap">
−
 
+
  <ul class="navbar">
−
<!-- This list is your menu, every list item is a menu button and nested listed become submenu buttons -->
+
<li><a href="https://2015.igem.org/Team:Oxford/Description">PROJECT</a>
−
<ul>
+
<ul>
−
+
  <li><a href="https://2015.igem.org/Team:Oxford/Backdrop">BACKDROP</a></li>
−
+
  <li><a href="https://2015.igem.org/Team:Oxford/Experiments">EXPERIMENTS</a></li>
−
 
+
  <li><a href="https://2015.igem.org/Team:Oxford/Results">RESULTS</a></li>
−
<a href="https://2015.igem.org/Team:Oxford/Description"><li>PROJECT
+
  <li><a href="https://2015.igem.org/Team:Oxford/Design">DESIGN</a></li>
−
            <ul>
+
</ul>        
−
<a href="https://2015.igem.org/Team:Oxford/Backdrop"><li>BACKDROP</li></a>
+
</li>
−
<a href="https://2015.igem.org/Team:Oxford/Experiments"><li>EXPERIMENTS</li></a>
+
<li><a href="https://2015.igem.org/Team:Oxford/Notebook">NOTEBOOK</a>      
−
 
+
</li>
−
<a href="https://2015.igem.org/Team:Oxford/Results"><li>RESULTS</li></a>
+
<li><a href="https://2015.igem.org/Team:Oxford/Parts">PARTS</a>
−
<a href="https://2015.igem.org/Team:Oxford/Design"><li>DESIGN</li></a>
+
<ul>
−
 
+
  <li><a href="https://2015.igem.org/Team:Oxford/Basic_Part">BASIC PARTS</a></li>
−
</ul>
+
  <li><a href="https://2015.igem.org/Team:Oxford/Composite_Part">COMPOSITE PARTS</a></li>
−
</li></a>
+
  <li><a href="https://2015.igem.org/Team:Oxford/Part_Collection">COLLECTION</a></li>
−
 
+
</ul>        
−
+
</li>
−
 
+
<li><a href="#">Business Intelligence</a>
−
<a href="https://2015.igem.org/Team:Oxford/Notebook"><li>NOTEBOOK</li></a>
+
<ul>
−
 
+
  <li><a href="#">Business Dashboard</a></li>
−
                            <a href="https://2015.igem.org/Team:Oxford/Parts"><li>PARTS
+
  <li><a href="#">Web Pivot Table</a></li>
−
            <ul>
+
  <li><a href="#">Interactive Report</a></li>
−
+
  <li><a href="#">What-If Analysis</a></li>
−
<a href="https://2015.igem.org/Team:Oxford/Basic_Part"><li>BASIC PARTS</li></a>
+
</ul>        
−
<a href="https://2015.igem.org/Team:Oxford/Composite_Part"><li>COMPOSITE PARTS</li></a>
+
</li>
−
      <a href="https://2015.igem.org/Team:Oxford/Part_Collection"><li>COLLECTION</li></a>
+
<li><a href="#">Data Maintenance</a>
−
</ul>
+
<ul>
−
</li></a>
+
  <li><a href="#">Database CRUD</a></li>
−
     
+
  <li><a href="#">Database Update</a></li>
−
<a href="https://2015.igem.org/Team:Oxford/Attributions"><li>ATTRIBUTIONS
+
  <li><a href="#">Order Entry</a></li>
−
<ul>
+
  <li><a href="#">Drag-and-Drop Application</a></li>
−
<a href="https://2015.igem.org/Team:Oxford/Attributions/Sponsors"><li>SPONSORS</li></a>
+
</ul>        
−
<a href="https://2015.igem.org/Team:Oxford/Collaborations"><li>COLLABORATIONS</li></a>
+
</li>
−
</ul></li></a>
+
<li><a href="#">B2B Portal</a>
−
 
+
<ul>
−
+
  <li><a href="#">B2B Portal</a></li>
−
 
+
  <li><a href="#">Secure Data-Driven Listings</a></li>
−
<a href="https://2015.igem.org/Team:Oxford/Practices"><li>HUMAN PRACTICES
+
  <li><a href="#">Secure Shopping Cart</a></li>
−
                                                                    <ul>
+
</ul>        
−
                                <a href="https://2015.igem.org/Team:Oxford/Safety"><li>SAFETY</li></a></ul>
+
</li>
−
</li></a>
+
  </ul>
−
 
+
</div>
−
      <a href="https://2015.igem.org/Team:Oxford/Measurement"><li>MEASUREMENT
+
−
<ul>
+
−
                                <a href="https://2015.igem.org/Team:Oxford/Measurement/Inter-lab Study"><li>INTER-LAB STUDY</li></a></ul></li></a>
+
−
 
+
−
<a href="https://2015.igem.org/Team:Oxford/Modeling"><li>MODELING</li></a>
+
−
 
+
−
<a href="https://2015.igem.org/Team:Oxford/Team"><li>TEAM</li></a>
+
−
 
+
−
+
−
                                        <a href="https://2015.igem.org/Team:Oxford/Blog"><li>BLOG</li></a>
+
−
 
+
−
</ul>
+
−
</div>
+
 
<!-- End of menu  -->
 
<!-- End of menu  -->
  
  
 
<!-- Start of content -->
 
<!-- Start of content -->
−
<div id="contentContainer"> <!--The closing tag for contentContainer should be placed at the bottom of each content page.-->
+
<div id="contentContainer"></div><!--The closing tag for contentContainer should be placed at the bottom of each content page.-->
  
  
 
</html>
 
</html>

Revision as of 21:29, 9 July 2015