Difference between revisions of "Template:Newcastle/navbar2"

(Created page with "<html> <!--[if lt IE 9 ]><html class="no-js oldie" lang="en"> <![endif]--> <!--[if IE 9 ]><html class="no-js oldie ie9" lang="en"> <![endif]--> <!--[if (gte IE 9)|!(IE)]><!--...")
 
 
(102 intermediate revisions by 5 users not shown)
Line 28: Line 28:
 
     href="https://2018.igem.org/Template:Newcastle/CSSbase?action=raw&ctype=text/css" />
 
     href="https://2018.igem.org/Template:Newcastle/CSSbase?action=raw&ctype=text/css" />
 
     <link rel="stylesheet" type="text/css"  
 
     <link rel="stylesheet" type="text/css"  
−
     href="https://2018.igem.org/Template:Newcastle/CSSvendor?action=raw&ctype=text/css" />
+
     href="https://2018.igem.org/Template:Newcastle/CSSvendorNoReveal?action=raw&ctype=text/css" />
−
     <link rel="stylesheet" type="text/css"  
+
     <link rel="stylesheet" type="text/css"
 
     href="https://2018.igem.org/Template:Newcastle/CSSmain?action=raw&ctype=text/css" />
 
     href="https://2018.igem.org/Template:Newcastle/CSSmain?action=raw&ctype=text/css" />
 
<!--    <link rel="stylesheet" type="text/css"  
 
<!--    <link rel="stylesheet" type="text/css"  
Line 68: Line 68:
 
}
 
}
  
−
ul {
+
.navbar_ul {
−
list-style-type: none;
+
    list-style-type: none;
−
margin: 0;
+
    margin: 0;
−
padding: 0;
+
    padding: 0;
−
overflow: hidden;
+
    overflow: hidden;
−
background-color: transparent;
+
    background-color: #333;
 
}
 
}
  
−
li {
+
.navbar_li {
−
float: left;
+
    float: left;
−
margin: .6rem 0 .6rem 1.7rem;
+
    font-size: 20px;
−
display: list-item;
+
−
padding-right: 100px;  
+
 
}
 
}
  
−
li.dropdown.HP {
+
 
−
float: left;
+
.navbar_li a, .navbar_dropdown_li a {
−
margin: .6rem 0 .6rem 1.7rem;
+
    display: block;
−
display: list-item;
+
    color: white;
−
padding-right: 0px;  
+
    text-align: center;
−
display: inline-block;
+
    padding: 18px 14px;
 +
    text-decoration: none;
 
}
 
}
  
−
li a, .dropbtn {
+
.navbar_li a:hover:not(.active) {
−
color: white;
+
    background-color: #39b54a;
−
text-align: center;
+
−
text-decoration: none;
+
 
}
 
}
  
−
li a:hover, .dropdown:hover .dropbtn {
+
.navbar_dropdown_content {
−
background-color: Transparent
+
    display: none;
 +
    position: absolute;
 +
    background-color: #333;
 +
    z-index: 1;
 
}
 
}
  
−
li.dropdown {
+
.navbar_dropdown_content a:hover {
−
display: inline-block;
+
    background-color: #39b54a;
 
}
 
}
  
−
.dropdown-content {
+
.navbar_dropdown_content a {
−
display: none;
+
    color: white;
−
position: relative;
+
    text-align: center;
−
background-color: transparent;
+
    padding: 18px 14px;
−
min-width: 160px;
+
    text-decoration: none;
−
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+
−
z-index: 1;
+
 
}
 
}
  
−
.dropdown-content a {
+
.navbar_li:hover .navbar_dropdown_content {
−
font-size: 18px;
+
    display: block;
−
color: green;
+
−
padding-right: 5px;
+
−
padding-left: 5px;
+
−
text-decoration: none;
+
−
display: block;
+
−
text-align: left;
+
 
}
 
}
  
−
.dropdown-content a:hover {
+
#expand_btn {
−
background-color: white;
+
    z-index: 0;
−
color: black;
+
    position: fixed;
 +
    right: 0px;
 
}
 
}
  
−
.dropdown-content a:visited {
+
.toggle {
−
color: green;
+
    background-color: #333;
 +
    color: white;
 +
    text-indent: 0px;
 +
 
 
}
 
}
  
−
.dropdown:hover .dropdown-content {
+
.toggle:hover {
−
display: block;
+
  background-color: #39b54a;
 
}
 
}
 +
 +
 
</style>
 
</style>
 +
 +
<script>
 +
 +
function myFunction() {
 +
    var x = document.getElementById("navbar");
 +
    if (x.style.display === "none") {
 +
        x.style.display = "block";
 +
    } else {
 +
        x.style.display = "none";
 +
    }
 +
}
 +
 +
</script>
  
 
</head>
 
</head>
Line 142: Line 153:
 
<body id="top">
 
<body id="top">
  
−
    <!-- header
 
−
    ================================================== -->
 
−
    <header class="s-header">
 
  
−
        <div class="header-logo">
+
<div style="position: fixed; top: 16px; left:0px; width:100%; height:50px; z-index:100">
−
            <a class="site-logo" href="https://2018.igem.org/Team:Newcastle">
+
<ul id="navbar" class="navbar_ul" style="margin:0px">
−
                 <img src="https://static.igem.org/mediawiki/2018/thumb/2/22/T--Newcastle--RoundLogo.png/555px-T--Newcastle--RoundLogo.png" alt="Homepage">
+
  <li class="navbar_li"><a class="site-logo" style="padding:7px" href="https://2018.igem.org/Team:Newcastle">
−
             </a>
+
                 <img src="https://static.igem.org/mediawiki/2018/thumb/2/22/T--Newcastle--RoundLogo.png/555px-T--Newcastle--RoundLogo.png" width=50px alt="Homepage">
−
        </div>  
+
             </a></li>
  
−
        <nav class="header-nav">
 
  
−
            <a href="#0" class="header-nav__close" title="close"><span>Close</span></a>
+
  <li class="navbar_li"><a href="https://2018.igem.org/Team:Newcastle">Home</a></li>
  
−
            <div class="header-nav__content">
+
  <li class="navbar_li"><a href="#">Project</a>
−
                <h3>Navigation</h3>
+
      <div class="navbar_dropdown_content">
−
               
+
          <a href="https://2018.igem.org/Team:Newcastle/Description">Description</a>
−
                <ul class="header-nav__list" class="">
+
          <a href="https://2018.igem.org/Team:Newcastle/Safety">Safety</a>
−
                    <li class="current"><a href="https://2018.igem.org/Team:Newcastle" title="home">Home</a></li>
+
          <a href="https://2018.igem.org/Team:Newcastle/Parts">Parts Used</a>
−
                    <li class="dropdown"><a href="https://2018.igem.org/Team:Newcastle/Description" class="dropbtn" title="project">Project</a>
+
          <a href="https://2018.igem.org/Team:Newcastle/Part_Collection">New Parts Collection</a>                
−
<div class="dropdown-content">
+
      </div>
−
<a href="https://2018.igem.org/Team:Newcastle/Description">Description</a>
+
  </li>
−
<a href="https://2018.igem.org/Team:Newcastle/Design">Design</a>
+
−
<a href="https://2018.igem.org/Team:Newcastle/Experiments">Experiments</a>
+
−
<a href="https://2018.igem.org/Team:Newcastle/Parts">Parts Overview</a>
+
−
<a href="https://2018.igem.org/Team:Newcastle/InterLab">Interlab</a>
+
−
+
−
<a href="https://2018.igem.org/Team:Newcastle/Results">Results</a>
+
−
<a href="https://2018.igem.org/Team:Newcastle/Demonstrate">Demonstrate</a>
+
−
<a href="https://2018.igem.org/Team:Newcastle/Improve">Improve</a>
+
−
                                                        <a href="https://2018.igem.org/Team:Newcastle/Safety" title="safety">Safety</a>
+
−
<a href="https://2018.igem.org/Team:Newcastle/Software">Software</a>
+
−
</div>
+
−
</li>
+
  
−
                <li class="dropdown"><a href="https://2018.igem.org/Team:Newcastle/Results" class="dropbtn" title="Results">Results</a>
+
  <li class="navbar_li"><a href="#">Human Practices</a>
−
<div class="dropdown-content">
+
      <div class="navbar_dropdown_content">
−
<a href="https://2018.igem.org/Team:Newcastle/Results/Hardware">Hardware</a>
+
          <a href="https://2018.igem.org/Team:Newcastle/Human_Practices">Integrated HP</a>
−
<a href="https://2018.igem.org/Team:Newcastle/Results/Endophyte">Endophyte</a>
+
          <a href="https://2018.igem.org/Team:Newcastle/Public_Engagement">Outreach and Public Engagement</a>
−
<a href="https://2018.igem.org/Team:Newcastle/Results/Chemotaxis">Chemotaxis</a>
+
      </div>
−
<a href="https://2018.igem.org/Team:Newcastle/Results/Operon">Operon</a>
+
  </li>
  
−
</div>
+
  <li class="navbar_li"><a href="#">Hardware</a>
−
</li>
+
      <div class="navbar_dropdown_content">
 +
          <a href="https://2018.igem.org/Team:Newcastle/Hardware">Hardware Overview</a>
 +
          <a href="https://2018.igem.org/Team:Newcastle/Circuitry">Circuitry</a>
 +
          <a href="https://2018.igem.org/Team:Newcastle/Results">Results</a>
 +
          <a href="https://2018.igem.org/Team:Newcastle/Developments">Future Developments</a>
 +
      </div>
 +
  </li>
  
−
                <li class="dropdown"><a href="javascript:void(0)" class="dropbtn" title="Notebook">Notebook</a>
+
  <li class="navbar_li"><a href="#">Software</a>
−
<div class="dropdown-content">
+
      <div class="navbar_dropdown_content">
−
<a href="https://2018.igem.org/Team:Newcastle/Notebook">General</a>
+
          <a href="https://2018.igem.org/Team:Newcastle/Software">Software Overview</a>
−
<a href="https://2018.igem.org/Team:Newcastle/Notebook/Endophyte">Endophyte</a>
+
          <a href="https://2018.igem.org/Team:Newcastle/Software/NH1">NH-1</a>
−
<a href="https://2018.igem.org/Team:Newcastle/Notebook/Chemotaxis">Chemotaxis</a>
+
          <a href="https://2018.igem.org/Team:Newcastle/Software/OT">Opentrons</a>
−
<a href="https://2018.igem.org/Team:Newcastle/Notebook/Operon">Operon</a>
+
      </div>
 +
  </li>
  
−
</div>
+
  <li class="navbar_li"><a href="#">Wetware</a>
−
</li>
+
      <div class="navbar_dropdown_content">
 +
         
 +
          <a href="https://2018.igem.org/Team:Newcastle/Results/Endophyte1">Root Colonisation</a>
 +
          <a href="https://2018.igem.org/Team:Newcastle/Results/Endophyte">Endophytic Chassis</a>
 +
          <a href="https://2018.igem.org/Team:Newcastle/Results/Chemotaxis">Chemotaxis</a>
 +
          <a href="https://2018.igem.org/Team:Newcastle/Results/Operon">Naringenin Operon</a>
 +
          <a href="https://2018.igem.org/Team:Newcastle/Protocols">Protocols</a>
 +
          <a href="https://2018.igem.org/Team:Newcastle/Experiments">Lab Book</a>
 +
      </div>
  
−
                <li class="dropdown"><a href="javascript:void(0)" class="dropbtn" title="Modelling">Modelling</a>
+
  </li>
−
<div class="dropdown-content">
+
−
<a href="https://2018.igem.org/Team:Newcastle/Model/Pathway/Main">Pathway</a>
+
−
<a href="https://2018.igem.org/Team:Newcastle/Modelling/Community">Community</a>
+
−
 
+
−
</div>
+
−
</li>
+
−
+
−
                    <li class="dropdown"><a href="https://2018.igem.org/Team:Newcastle/Team" class="dropbtn" title="team">Team</a>
+
−
<div class="dropdown-content">
+
−
<a href="https://2018.igem.org/Team:Newcastle/Team">Team</a>
+
−
<a href="https://2018.igem.org/Team:Newcastle/Collaborations">Collaborations</a>
+
−
<a href="https://2018.igem.org/Team:Newcastle/Attributions">Attributions</a>
+
−
</div>
+
−
</li>
+
−
+
  
−
                    <li class="dropdown"><a href="https://2018.igem.org/Team:Newcastle/Hardware" class="dropbtn" title="Hardware">Hardware</a>
+
  <li class="navbar_li"><a href="#">Modelling</a>
−
<div class="dropdown-content">
+
      <div class="navbar_dropdown_content">
−
<a href="https://2018.igem.org/Team:Newcastle/Hardware">Overview</a>
+
          <a href="https://2018.igem.org/Team:Newcastle/Model">Modelling Overview</a>
−
<a href="https://2018.igem.org/Team:Newcastle/Circuitry">Circuitry</a>
+
          <a href="https://2018.igem.org/Team:Newcastle/Modelling/Community">Microbial Community Modelling</a>
−
<a href="https://2018.igem.org/Team:Newcastle/Code">Code</a>
+
          <a href="https://2018.igem.org/Team:Newcastle/Naringenin_Pathway">Naringenin Pathway</a>
−
<a href="https://2018.igem.org/Team:Newcastle/Results">Results</a>
+
      </div>
−
<a href="https://2018.igem.org/Team:Newcastle/Developments">Developments</a>
+
  </li>
−
</div>
+
  
−
</li>     
+
  <li class="navbar_li"><a href="#">Measurement</a>
−
             
+
      <div class="navbar_dropdown_content">
−
                    <li class="dropdown HP"><a href="https://2018.igem.org/Team:Newcastle/Human_Practices" class="dropbtn" title="human practices">Human Practices</a>
+
          <a href="https://2018.igem.org/Team:Newcastle/InterLab">InterLab Study</a>
−
<div class="dropdown-content">
+
          <a href="https://2018.igem.org/Team:Newcastle/Measurement">Measurement, Automation & Reproducibility</a>
−
<a href="https://2018.igem.org/Team:Newcastle/Human_Practices">Human Practices</a>
+
          <a href="https://2018.igem.org/Team:Newcastle/Measurement/Methods">Materials and Methods</a>
−
<a href="https://2018.igem.org/Team:Newcastle/Public_Engagement">Outreach</a>
+
      </div>
−
</div>
+
  </li>
−
</li>                   
+
−
                    <li class="dropdown"><a href="javascript:void(0)" class="dropbtn" title="awards">Judging</a>
+
−
<div class="dropdown-content">
+
−
<a href="https://2018.igem.org/Team:Newcastle/Medals">Medals</a>
+
−
<a href="https://2018.igem.org/Team:Newcastle/Hardware">Hardware</a>
+
−
<a href="https://2018.igem.org/Team:Newcastle/Measurement">Measurement</a>
+
−
</div>
+
−
</li>
+
−
</ul>   
+
−
                <p>Newcastle iGEM 2018</p>
+
−
   
+
−
             
+
  
−
            </div> <!-- end header-nav__content -->
+
  <li class="navbar_li"><a href="#">Team</a>
 +
      <div class="navbar_dropdown_content">
 +
          <a href="https://2018.igem.org/Team:Newcastle/Team">Members</a>
 +
          <a href="https://2018.igem.org/Team:Newcastle/Collaborations">Collaborations</a>
 +
          <a href="https://2018.igem.org/Team:Newcastle/Attributions">Attributions</a>
 +
      </div>
 +
  </li>
  
−
        </nav> <!-- end header-nav -->
+
  <li class="navbar_li"><a href="https://2018.igem.org/Team:Newcastle/Notebook">Notebook</a></li>
  
−
        <a class="header-menu-toggle" href="#0">
+
  <li class="navbar_li"><a href="#">Judging</a>
−
            <span class="header-menu-text">Menu</span>
+
      <div class="navbar_dropdown_content">
−
            <span class="header-menu-icon"></span>
+
          <a href="https://2018.igem.org/Team:Newcastle/Medals">Medals</a>
−
        </a>
+
          <a href="https://2018.igem.org/Team:Newcastle/Improve">Improve</a>
 +
          <a href="https://2018.igem.org/Team:Newcastle/Demonstrate">Demonstrate</a>
 +
      </div>
 +
  </li>
 +
 
 +
</ul>
  
−
    </header> <!-- end s-header -->
+
<div id="expand_btn"><button class="toggle" onclick="myFunction()">Hide/Show</button></div>
  
 +
</div>
  
−
    <!-- preloader
 
−
    ==================================================
 
−
    <div id="preloader">
 
−
        <div id="loader">
 
−
            <div class="line-scale-pulse-out">
 
−
                <div></div>
 
−
                <div></div>
 
−
                <div></div>
 
−
                <div></div>
 
−
                <div></div>
 
−
            </div>
 
−
        </div>
 
−
    </div> -->
 
 
      
 
      
 
</body>
 
</body>
  
 
</html>
 
</html>

Latest revision as of 22:32, 17 October 2018