Line 376: | Line 376: | ||
</button> | </button> | ||
</div> | </div> | ||
− | |||
− | |||
− | |||
− | |||
− | .navbar | + | <!--Manhattan Logo--> |
− | + | <a class="navbar-left" href="https://2017.igem.org/Team:ManhattanCol_Bronx"> | |
− | + | <img id="logo" src="https://image.ibb.co/for2YQ/unnamed.png" width="175px" ></a> | |
− | + | ||
− | + | <center> <a class="navbar-center" href="https://2017.igem.org/Team:ManhattanCol_Bronx"> | |
− | + | <img id="logo" src="https://static.igem.org/mediawiki/2017/c/c2/ManhattanCol_Bronx_header-2.png" width="1000px" ></a> | |
+ | |||
+ | |||
+ | <a class="navbar-right" href="https://2017.igem.org/Team:ManhattanCol_Bronx"> | ||
+ | <img id="logo" src="https://image.ibb.co/for2YQ/unnamed.png" width="175px" ></a> | ||
+ | |||
+ | |||
+ | |||
+ | <!--Navigation Bar specifications Below--> | ||
+ | <div id="navbar3" class="navbar-collapse collapse"> | ||
+ | <ul class="nav navbar-nav navbar-right"> | ||
+ | <style> | ||
+ | .dropbtn2 { | ||
+ | background-color: #f8f8f8; | ||
+ | color: #000000; | ||
+ | padding: 16px; | ||
+ | font-size: 16px; | ||
+ | border: none; | ||
+ | cursor: pointer; | ||
} | } | ||
− | . | + | .dropbtn2:hover, .dropbtn2:focus { |
− | + | background-color: #5EDE83; | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
} | } | ||
− | |||
− | |||
− | |||
+ | |||
+ | </style> | ||
+ | </head> | ||
+ | <body> | ||
+ | |||
+ | |||
+ | <div class="dropdown"> | ||
+ | <button class="dropbtn2"><a href="https://2017.igem.org/Team:ManhattanCol_Bronx" class="dropbtn2" style="text-decoration:none;">Home</a></button> | ||
+ | |||
+ | <style> | ||
+ | .dropbtn3 { | ||
+ | background-color: #f8f8f8; | ||
+ | color: #000000; | ||
+ | padding: 16px; | ||
+ | font-size: 16px; | ||
+ | border: none; | ||
+ | cursor: pointer; | ||
} | } | ||
− | . | + | |
− | + | .dropbtn3:hover, .dropbtn2:focus { | |
− | + | background-color: #5EDE83; | |
} | } | ||
− | . | + | |
− | background-color: # | + | |
− | color: # | + | |
− | font-size: | + | </style> |
+ | </head> | ||
+ | <body> | ||
+ | |||
+ | |||
+ | <div class="dropdown"> | ||
+ | <button class="dropbtn3"><a href="https://2017.igem.org/Team:ManhattanCol_Bronx/Team" class="dropbtn3" style="text-decoration:none;">Team</a></button> | ||
+ | |||
+ | <style> | ||
+ | .dropbtn { | ||
+ | background-color: #f8f8f8; | ||
+ | color: #000000; | ||
+ | padding: 16px; | ||
+ | font-size: 16px; | ||
border: none; | border: none; | ||
cursor: pointer; | cursor: pointer; | ||
} | } | ||
− | . | + | .dropbtn:hover, .dropbtn:focus { |
+ | background-color: #5EDE83; | ||
+ | } | ||
+ | |||
+ | .dropdown { | ||
position: relative; | position: relative; | ||
display: inline-block; | display: inline-block; | ||
} | } | ||
− | . | + | .dropdown-content { |
display: none; | display: none; | ||
position: absolute; | position: absolute; | ||
− | background-color: # | + | background-color: #00f9f9f9; |
− | min-width: | + | min-width: 160px; |
+ | overflow: auto; | ||
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); | box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); | ||
z-index: 1; | z-index: 1; | ||
} | } | ||
− | . | + | .dropdown-content a { |
color: black; | color: black; | ||
+ | padding: 12px 16px; | ||
text-decoration: none; | text-decoration: none; | ||
display: block; | display: block; | ||
} | } | ||
− | . | + | .dropdown a:hover {background-color: #ffffff} |
− | . | + | .show {display:block;} |
− | + | </style> | |
+ | </head> | ||
+ | <body> | ||
+ | |||
+ | |||
+ | <div class="dropdown"> | ||
+ | <button onclick="myFunction()" class="dropbtn">Project</button> | ||
+ | <font face="Tahoma"> | ||
+ | <div id="myDropdown" class="dropdown-content"> | ||
+ | <a href="https://2017.igem.org/Team:ManhattanCol_Bronx/Description">Description</a> | ||
+ | <a href="https://2017.igem.org/Team:ManhattanCol_Bronx/Design">Design</a> | ||
+ | <a href="https://2017.igem.org/Team:ManhattanCol_Bronx/Experiments">Experiments</a> | ||
+ | <a href="https://2017.igem.org/Team:ManhattanCol_Bronx/Proof">Proof of Concepts</a> | ||
+ | <a href="https://2017.igem.org/Team:ManhattanCol_Bronx/Results">Results</a> | ||
+ | <a href="https://2017.igem.org/Team:ManhattanCol_Bronx/Notebook">Notebook</a> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <script> | ||
+ | /* When the user clicks on the button, | ||
+ | toggle between hiding and showing the dropdown content */ | ||
+ | function myFunction() { | ||
+ | document.getElementById("myDropdown").classList.toggle("show"); | ||
} | } | ||
− | . | + | // Close the dropdown if the user clicks outside of it |
− | + | window.onclick = function(event) { | |
+ | if (!event.target.matches('.dropbtn')) { | ||
+ | |||
+ | var dropdowns = document.getElementsByClassName("dropdown-content"); | ||
+ | var i; | ||
+ | for (i = 0; i < dropdowns.length; i++) { | ||
+ | var openDropdown = dropdowns[i]; | ||
+ | if (openDropdown.classList.contains('show')) { | ||
+ | openDropdown.classList.remove('show'); | ||
+ | } | ||
+ | } | ||
+ | } | ||
} | } | ||
− | . | + | </script> |
− | background-color: # | + | |
− | color: # | + | |
− | font-size: | + | <style> |
+ | .dropbtn1 { | ||
+ | background-color: #f8f8f8; | ||
+ | color: #000000; | ||
+ | padding: 16px; | ||
+ | font-size: 16px; | ||
border: none; | border: none; | ||
cursor: pointer; | cursor: pointer; | ||
} | } | ||
− | . | + | .dropbtn1:hover, .dropbtn1:focus { |
+ | background-color: #5EDE83; | ||
+ | } | ||
+ | |||
+ | .dropdown1 { | ||
position: relative; | position: relative; | ||
display: inline-block; | display: inline-block; | ||
} | } | ||
− | . | + | .dropdown-content1 { |
display: none; | display: none; | ||
position: absolute; | position: absolute; | ||
− | background-color: # | + | background-color: #00f9f9f9; |
min-width: 160px; | min-width: 160px; | ||
+ | overflow: auto; | ||
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); | box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); | ||
z-index: 1; | z-index: 1; | ||
} | } | ||
− | . | + | .dropdown-content1 a { |
color: black; | color: black; | ||
+ | padding: 12px 16px; | ||
text-decoration: none; | text-decoration: none; | ||
display: block; | display: block; | ||
} | } | ||
− | . | + | .dropdown a:hover {background-color: #5EDE83} |
− | . | + | .show1 {display:block;} |
− | + | </style> | |
+ | </head> | ||
+ | <body> | ||
+ | |||
+ | |||
+ | <div class="dropdown1"> | ||
+ | <button onclick="myFunction1()" class="dropbtn1"; >Parts</button> | ||
+ | <div id="myDropdown1" class="dropdown-content1"> | ||
+ | <a href="https://2017.igem.org/Team:ManhattanCol_Bronx/Parts">Parts</a> | ||
+ | <a href="https://2017.igem.org/Team:ManhattanCol_Bronx/Basic_Part">Basic Part</a> | ||
+ | <a href="https://2017.igem.org/Team:ManhattanCol_Bronx/Composite_Part">Composite Part</a> | ||
+ | <a href="https://2017.igem.org/Team:ManhattanCol_Bronx/Part_Collection">Part Collection</a> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <script> | ||
+ | /* When the user clicks on the button, | ||
+ | toggle between hiding and showing the dropdown content */ | ||
+ | function myFunction1() { | ||
+ | document.getElementById("myDropdown1").classList.toggle("show1"); | ||
} | } | ||
− | . | + | // Close the dropdown if the user clicks outside of it |
− | + | window.onclick = function(event) { | |
+ | if (!event.target.matches('.dropbtn1')) { | ||
+ | |||
+ | var dropdowns = document.getElementsByClassName("dropdown-content1"); | ||
+ | var i; | ||
+ | for (i = 0; i < dropdowns.length; i++) { | ||
+ | var openDropdown = dropdowns[i]; | ||
+ | if (openDropdown.classList.contains('show1')) { | ||
+ | openDropdown.classList.remove('show1'); | ||
+ | } | ||
+ | } | ||
+ | } | ||
} | } | ||
− | . | + | </script> |
− | + | <style> | |
− | + | .dropbtn { | |
+ | background-color: #f8f8f8; | ||
+ | color: #000000; | ||
+ | padding: 16px; | ||
+ | font-size: 16px; | ||
+ | border: none; | ||
+ | cursor: pointer; | ||
} | } | ||
− | . | + | |
− | + | .dropbtn4:hover, .dropbtn4:focus { | |
− | + | background-color: #5EDE83; | |
} | } | ||
− | . | + | |
− | + | ||
− | + | ||
+ | </style> | ||
+ | </head> | ||
+ | <body> | ||
+ | |||
+ | |||
+ | <div class="dropdown"> | ||
+ | <button class="dropbtn"><a href="https://2017.igem.org/Team:ManhattanCol_Bronx/Safety" class="dropbtn" style="text-decoration:none;">Safety</a></button> | ||
+ | <style> | ||
+ | .dropbtn4 { | ||
+ | background-color: #f8f8f8; | ||
+ | color: white; | ||
+ | padding: 16px; | ||
+ | font-size: 16px; | ||
+ | border: none; | ||
+ | cursor: pointer; | ||
} | } | ||
− | . | + | |
− | + | .dropbtn4:hover, .dropbtn4:focus { | |
− | + | background-color: #5EDE83; | |
} | } | ||
+ | |||
+ | |||
</style> | </style> | ||
</head> | </head> | ||
<body> | <body> | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | </ | + | |
+ | <div class="dropdown"> | ||
+ | <button class="dropbtn"><a href="https://2017.igem.org/Team:ManhattanCol_Bronx/HP/Silver" class="dropbtn" style="text-decoration:none;">★Human Practices</a> | ||
+ | |||
+ | <div class="dropdown"> | ||
+ | <button class="dropbtn"><a href="https://2017.igem.org/Team:ManhattanCol_Bronx/Collaborations" class="dropbtn" style="text-decoration:none;">★Collaborations</a></button> | ||
+ | |||
+ | <div class="dropdown"> | ||
+ | <button class="dropbtn"><a href="https://2017.igem.org/Team:ManhattanCol_Bronx/InterLab" class="dropbtn" style="text-decoration:none;">★InterLab Study</a></button> | ||
+ | |||
+ | <div class="dropdown"> | ||
+ | <button class="dropbtn"><a href="https://2017.igem.org/Team:ManhattanCol_Bronx/Attributions" class="dropbtn" style="text-decoration:none;">★Attributions</a></button> | ||
+ | </button> | ||
+ | |||
+ | </ul> | ||
+ | </div> | ||
+ | <!----> | ||
+ | </div><!--Close container-fluid--> | ||
+ | </nav> | ||
+ | </div><!--Close class=example3--> | ||
+ | <!--ends navbar--> | ||
+ | |||
+ | |||
+ | </head> | ||
+ | |||
Revision as of 17:16, 30 October 2017