Difference between revisions of "Template:DTU-Denmark"

(Prototype team template page)
 
Line 41: Line 41:
 
}
 
}
 
}
 
}
 +
 +
$(window).on('scroll',function(){
 +
        if($(window).scrollTop()){
 +
          $('nav').addClass('black');
 +
        }else {
 +
          $('nav').removeClass('black');
 +
        }
 +
      })
  
  
Line 252: Line 260:
 
/*general styling*/
 
/*general styling*/
 
/**************************************************************************************************************************************************************************************************/
 
/**************************************************************************************************************************************************************************************************/
 +
 +
 +
 +
 +
nav{
 +
  position: fixed;
 +
  top:0;
 +
  left: 0;
 +
  width: 100%;
 +
  height: 100px;
 +
  padding: 10px 60px;
 +
  box-sizing: border-box;
 +
  transition: .5s;
 +
  z-index: 5;
 +
  opacity: 1;
 +
}
 +
nav.black{
 +
  background: rgba(0,0,0,.8);
 +
  height: 80px;
 +
  padding: 10px 50px;
 +
}
 +
 +
nav a{
 +
  text-decoration:none;
 +
  color: #fff;
 +
}
 +
nav .logo{
 +
  float: left;
 +
}
 +
nav .logo img{
 +
  height: 150px;
 +
  transition: .5s;
 +
}
 +
nav.black .logo img{
 +
  height: 60px;
 +
}
 +
nav ul{
 +
  float: right;
 +
  margin: 0;
 +
  padding: 0;
 +
  display: flex;
 +
}
 +
nav ul li{
 +
  list-style: none;
 +
  margin-top: 25px;
 +
  line-height: none;
 +
  font-size: 18px;
 +
  color: white;
 +
  padding: 5px 15px;
 +
  text-decoration: none;
 +
  text-transform: uppercase;
 +
  transition: 1s;
 +
  text-shadow: 0 0 4px #000;
 +
}
 +
/* nav ul li a{
 +
  line-height: none;
 +
  font-size: 18px;
 +
  color: white;
 +
  padding: 5px 15px;
 +
  text-decoration: none;
 +
  text-transform: uppercase;
 +
  transition: 1s;
 +
  text-shadow: 0 0 10px #000;
 +
} */
 +
 +
/* nav.black ul li a{
 +
  color: #fff;
 +
  line-height: 20px;
 +
} */
 +
nav.black ul li{
 +
  color: #fff;
 +
  line-height: 20px;
 +
}
 +
/* nav ul li a.active,
 +
nav ul li a:hover{
 +
  color: orange;
 +
} */
 +
nav ul li.active,
 +
nav ul li:hover{
 +
  color: #e5e8a2;
 +
}
 +
 +
 +
 +
 +
 +
.dropdown-content {
 +
  display: none;
 +
  position: absolute;
 +
  background-color: #f9f9f9;
 +
  margin-top:20px;
 +
  min-width: 160px;
 +
  max-width: 210px;
 +
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
 +
  z-index: 1;
 +
  text-shadow: 0 0 0px #000;
 +
}
 +
 +
.dropdown-content a {
 +
  color: black;
 +
  padding: 9px 16px;
 +
  text-decoration: none;
 +
  display: block;
 +
  text-align: left;
 +
}
 +
 +
.dropdown-content a:hover {background-color: #f1f1f1;}
 +
 +
.dropdown:hover .dropdown-content {
 +
  display: block;
 +
}
 +
 +
 +
 +
 +
 +
 +
 +
 +
 +
 +
 +
 +
 +
 +
 +
 +
 +
 +
  
 
/*size for title h tags*/
 
/*size for title h tags*/
Line 566: Line 704:
  
  
−
 
+
<!--
 
<div class="igem_2019_team_menu">
 
<div class="igem_2019_team_menu">
  
Line 583: Line 721:
  
 
<!-- Team -->
 
<!-- Team -->
−
<div class="menu_item">
+
<!--<div class="menu_item">
 
<div class="submenu_control_icon"> </div>
 
<div class="submenu_control_icon"> </div>
 
TEAM
 
TEAM
Line 604: Line 742:
  
 
<!-- Project -->
 
<!-- Project -->
−
<div class="menu_item">
+
<!-- <div class="menu_item">
 
<div class="submenu_control_icon"> </div>
 
<div class="submenu_control_icon"> </div>
 
PROJECT
 
PROJECT
Line 805: Line 943:
  
 
</div>
 
</div>
 +
-->
 +
 +
    <nav>
 +
      <div class="logo">
 +
        <a href="https://2019.igem.org/Team:DTU-Denmark"><img src="https://static.igem.org/mediawiki/2019/thumb/f/fe/T--DTU-Denmark--happylogotemp.png/428px-T--DTU-Denmark--happylogotemp.png" alt="logo"></a>
 +
      </div>
 +
      <div class="menu-icon">
 +
        <i class="fa fa-bars fa-2x"></i>
 +
      </div>
 +
      <ul id='menu'>
 +
       
 +
     
 +
 +
          <li class="dropdown">
 +
              <a href="https://2019.igem.org/Team:DTU-Denmark/Description" class="dropbtn">Project</a>
 +
              <div class="dropdown-content">
 +
                <a href="https://2019.igem.org/Team:DTU-Denmark/Description">Description</a>
 +
                <a href="https://2019.igem.org/Team:DTU-Denmark/Design">Design</a>
 +
                <a href="https://2019.igem.org/Team:DTU-Denmark/Results">Results</a>
 +
                <a href="https://2019.igem.org/Team:DTU-Denmark/Demonstrate">Demonstrate</a>
 +
                <a href="https://2019.igem.org/Team:DTU-Denmark/Safety">Safety</a>
 +
                <a href="https://2019.igem.org/Team:DTU-Denmark/Collaborations">Collaboration</a>
 +
                <a href="https://2019.igem.org/Team:DTU-Denmark/Entrepreneurship">Entrepeneurship</a>
 +
                <a href="https://2019.igem.org/Team:DTU-Denmark/Plant">Plant</a>
 +
                <a href="https://2019.igem.org/Team:DTU-Denmark/Measurement">Measurement</a>
 +
                <a href="https://2019.igem.org/Team:DTU-Denmark/Improve">Improve</a>
 +
                <a href="https://2019.igem.org/Team:DTU-Denmark/Contribution">Contribution</a>
 +
              </div>
 +
            </li>
 +
 +
        <li class="dropdown">
 +
              <a href="https://2019.igem.org/Team:DTU-Denmark/Model" class="dropbtn">Modelling</a>
 +
              <div class="dropdown-content">
 +
                <a href="https://2019.igem.org/Team:DTU-Denmark/Model">Model</a>
 +
                <a href="https://2019.igem.org/Team:DTU-Denmark/Software">Software</a>
 +
 
 +
              </div>
 +
            </li>
 +
       
 +
       
 +
        <li class="dropdown">
 +
              <a href="https://2019.igem.org/Team:DTU-Denmark/Parts" class="dropbtn">Parts</a>
 +
              <div class="dropdown-content">
 +
                <a href="https://2019.igem.org/Team:DTU-Denmark/Parts">Parts Overview</a>
 +
                <a href="https://2019.igem.org/Team:DTU-Denmark/Basic_Part">Basic Parts</a>
 +
                <a href="https://2019.igem.org/Team:DTU-Denmark/Composite_Part">Composite Parts</a>
 +
                <a href="https://2019.igem.org/Team:DTU-Denmark/Part_Collection">Part Collection</a>
 +
              </div>
 +
            </li>
 +
       
 +
       
 +
       
 +
        <li class="dropdown">
 +
              <a href="https://2019.igem.org/Team:DTU-Denmark/Notebook" class="dropbtn">Journal</a>
 +
              <div class="dropdown-content">
 +
                <a href="https://2019.igem.org/Team:DTU-Denmark/Notebook">Notebook</a>
 +
                <a href="https://2019.igem.org/Team:DTU-Denmark/Experiments">Experiments</a>
 +
         
 +
              </div>
 +
            </li>
 +
       
 +
        <li class="dropdown">
 +
              <a href="https://2019.igem.org/Team:DTU-Denmark/Team" class="dropbtn">People</a>
 +
              <div class="dropdown-content">
 +
                <a href="https://2019.igem.org/Team:DTU-Denmark/Team">Team Members</a>
 +
                <a href="https://2019.igem.org/Team:DTU-Denmark/Attributions">Attributions</a>
 +
         
 +
              </div>
 +
            </li>
 +
       
 +
       
 +
        <li class="dropdown">
 +
              <a href="https://2019.igem.org/Team:DTU-Denmark/Human_Practices" class="dropbtn">Human Practices</a>
 +
              <div class="dropdown-content">
 +
                <a href="https://2019.igem.org/Team:DTU-Denmark/Human_Practices">Human Practices</a>
 +
                <a href="https://2019.igem.org/Team:DTU-Denmark/Public_Engagement">Education and Engagement</a>
 +
                <a href="https://2019.igem.org/Team:DTU-Denmark/BioBrick_Tutorial">Biobrick Tutorial</a>
 +
              </div>
 +
            </li>
 +
 +
      </ul>
 +
    </nav>
 +
 +
 +
 +
 +
 +
 +
  
 
<!------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
 
<!------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->

Revision as of 16:46, 15 July 2019