Difference between revisions of "Template:TPHS San Diego/Navbar"

 
(23 intermediate revisions by 2 users not shown)
Line 1: Line 1:
 
<html>
 
<html>
 
<head>
 
<head>
 
 
 
<style>
 
<style>
 +
 +
@font-face {
 +
  font-family: 'Montserrat';
 +
  src: url('https://static.igem.org/mediawiki/2018/3/30/T--TPHS_San_Diego--Montserrat.ttf') format('truetype');
 +
}
  
 
#navbar  
 
#navbar  
 
{
 
{
 
     margin: auto;
 
     margin: auto;
 +
    margin-top:0px;
 
     width: 100%;
 
     width: 100%;
 
     text-align: center;
 
     text-align: center;
 +
    box-shadow: 0 0 20px #333333;
 +
    position: fixed;
 +
    top: 15px;
 +
    z-index: 10;
 
}
 
}
  
Line 48: Line 56:
 
     width: 180px;
 
     width: 180px;
 
     background-color: #333333;
 
     background-color: #333333;
     box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+
     box-shadow: 0px 0px 20px #333333;
 
     z-index: 2;
 
     z-index: 2;
 
     text-align: center;
 
     text-align: center;
Line 69: Line 77:
 
   text-decoration: none;
 
   text-decoration: none;
 
   display: block;
 
   display: block;
   font-family: 'Raleway', sans-serif;
+
   font-family: 'Montserrat', sans-serif;
 
}
 
}
  
Line 125: Line 133:
 
</head>
 
</head>
 
<body>
 
<body>
<img  class = "logo" src = "https://static.igem.org/mediawiki/2018/5/55/T--TPHS_San_Diego--Logo3.png" alt = "logo" >
+
<div id = "navbar">
     
+
<div id="navbar-fill">
        <div class = "navbar">
+
<div class="dropdown nav-animation">
           
+
  <a href = "https://2018.igem.org/Team:TPHS_San_Diego"> <button class = "dropbtn" class id = "title" style = "color: white"> Home </button> </a>
            <div class = "dropdown">
+
 
                <button class = "dropbtn">Project
+
</div>
                    <i class = "fa fa-caret-down"></i>
+
 
                </button>
+
<div class="dropdown">
                <div class = "dropdown-content">
+
  <button class="dropbtn"> Project </button>
                    <a href = "https://2018.igem.org/Team:TPHS_San_Diego/Description">Description</a>
+
  <div class="dropdown-content" style="left:0;">
                    <a href = "https://2018.igem.org/Team:TPHS_San_Diego/Design">Design</a>
+
<a style="font-family: 'Montserrat', sans-serif;" href="https://2018.igem.org/Team:TPHS_San_Diego/Description">Description</a>
                    <a href = "https://2018.igem.org/Team:TPHS_San_Diego/Model">Model</a>
+
<a style="font-family: 'Montserrat', sans-serif;" href="https://2018.igem.org/Team:TPHS_San_Diego/Model">Modeling</a>
                    <a href = "https://2018.igem.org/Team:TPHS_San_Diego/Parts">Parts</a>
+
 
                    <a href = "https://2018.igem.org/Team:TPHS_San_Diego/Results">Results</a>
+
        <a style="font-family: 'Montserrat', sans-serif;" href="https://2018.igem.org/Team:TPHS_San_Diego/Parts">Parts</a>
                </div>
+
 
            </div>
+
        <a style="font-family: 'Montserrat', sans-serif;" href="https://2018.igem.org/Team:TPHS_San_Diego/Results">Results</a>
           
+
 
            <div class = "dropdown">
+
        <a style="font-family: 'Montserrat', sans-serif;" href="https://2018.igem.org/Team:TPHS_San_Diego/Safety">Safety</a>
                <button class = "dropbtn">Notebook
+
                    <i class = "fa fa-caret-down"></i>
+
  </div>
                </button>
+
</div>
               
+
 
                <div class = "dropdown-content">
+
<div class="dropdown">
                    <a href = "https://2018.igem.org/Team:TPHS_San_Diego/Notebook">Notebook</a>
+
  <button class="dropbtn"> Notebook </button>
                    <a href = "https://2018.igem.org/Team:TPHS_San_Diego/Experiments">Experiments</a>
+
  <div class="dropdown-content">
                </div>
+
<a style="font-family: 'Montserrat', sans-serif;" href="https://2018.igem.org/Team:TPHS_San_Diego/Notebook">Lab Notebook</a>
            </div>
+
<a style="font-family: 'Montserrat', sans-serif;" href="https://2018.igem.org/Team:TPHS_San_Diego/Experiments">Experiments</a>
               
+
<a style="font-family: 'Montserrat', sans-serif;" href="https://2018.igem.org/Team:TPHS_San_Diego/Improve">Part Improvements</a>
                <div class = "dropdown">
+
  </div>
                    <button class = "dropbtn">Human Practices
+
</div>
                    <i class = "fa fa-caret-down"></i>
+
 
                    </button>
+
<div class="dropdown">
                   
+
  <button class="dropbtn"> Human Practices </button>
                    <div class = "dropdown-content">
+
  <div class="dropdown-content">
                        <a href = "https://2018.igem.org/Team:TPHS_San_Diego/Human_Practices">Human Practices</a>
+
<a style="font-family: 'Montserrat', sans-serif;" href="https://2018.igem.org/Team:TPHS_San_Diego/Human_Practices">Integrated Human Practices</a>
                        <a href = "https://2018.igem.org/Team:TPHS_San_Diego/Collaborations">Collaborations</a>
+
<a style="font-family: 'Montserrat', sans-serif;" href="https://2018.igem.org/Team:TPHS_San_Diego/Collaborations">Collaborations</a>
                    </div>
+
                </div>
+
  </div>
               
+
</div>
                <div class = "dropdown">
+
 
                    <button class = "dropbtn">Team
+
<div class="dropdown">
                    <i class = "fa fa-caret-down"></i>
+
  <button class="dropbtn"> Team </button>
                    </button>
+
  <div class="dropdown-content">
                   
+
<a style="font-family: 'Montserrat', sans-serif;" href="https://2018.igem.org/Team:TPHS_San_Diego/Team">Team</a>
                    <div class = "dropdown-content">
+
        <a style="font-family: 'Montserrat', sans-serif;" href="https://2018.igem.org/Team:TPHS_San_Diego/Attributions">Attributions</a>
                        <a href = "https://2018.igem.org/Team:TPHS_San_Diego/Team">Team</a>
+
  </div>
                        <a href = "https://2018.igem.org/Team:TPHS_San_Diego/Attributions">Attributions</a>
+
</div>
                    </div>
+
 
            </div>
+
<div class="dropdown">
 +
  <button class="dropbtn"> Judging </button>
 +
  <div class="dropdown-content">
 +
      <a style="font-family: 'Montserrat', sans-serif;" href="https://2018.igem.org/Team:TPHS_San_Diego/Medal_Criteria">Medal Criteria</a>
 +
  </div>
 +
</div>
 +
 
 +
</div>
 +
 
  
                <div class = "dropdown">
+
</div>
                    <button class = "dropbtn">Judging
+
                    <i class = "fa fa-caret-down"></i>
+
                    </button>
+
                   
+
                    <div class = "dropdown-content">
+
                        <a href = "https://2018.igem.org/Team:TPHS_San_Diego/Medal Criteria">Medal Criteria</a>
+
                    </div>
+
                </div>
+
           
+
           
+
        </div>  
+
       
+
 
</body>
 
</body>
 
</html>
 
</html>

Latest revision as of 22:16, 17 October 2018