(18 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
<html> | <html> | ||
− | <!--- | + | <!---You can place your team's code here.--> |
− | You can place your team's code here. | + | |
− | + | ||
<!-- CSS Bootstrap--> | <!-- CSS Bootstrap--> | ||
Line 24: | Line 22: | ||
</div> | </div> | ||
− | <!-- | + | <!-- Start MENU--> |
<div id="Menu-wrapper" class="shadow-lg dark-md mt-n3 pt-3 sticky-top"> | <div id="Menu-wrapper" class="shadow-lg dark-md mt-n3 pt-3 sticky-top"> | ||
<!-- Ici commence la navbar à proprement parler. le "navbar-expand-md" permet de contrôler à quel breakpoint la navbar est entièrement affichée ou remplacée par le bouton--> | <!-- Ici commence la navbar à proprement parler. le "navbar-expand-md" permet de contrôler à quel breakpoint la navbar est entièrement affichée ou remplacée par le bouton--> | ||
Line 33: | Line 31: | ||
<img class="d-inline-block align-center" src="https://static.igem.org/mediawiki/2021/e/e0/T--Groningen--Logo2_transparent.png" width="72" height="62" alt="" /> iGEM Groningen 2021</a> | <img class="d-inline-block align-center" src="https://static.igem.org/mediawiki/2021/e/e0/T--Groningen--Logo2_transparent.png" width="72" height="62" alt="" /> iGEM Groningen 2021</a> | ||
− | <!-- | + | <!-- Button present when the navbar is not extended. He calls the content --> |
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> | <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> | ||
− | <!-- | + | <!-- This displays the button icon--> |
<span class="navbar-toggler-icon"></span> | <span class="navbar-toggler-icon"></span> | ||
</button> | </button> | ||
− | <!-- | + | <!-- The actual content of the navbar--> |
<div class="collapse navbar-collapse" id="navbarSupportedContent"> | <div class="collapse navbar-collapse" id="navbarSupportedContent"> | ||
− | <!-- | + | |
+ | <!-- We start to list the tabs under this <ul> by doing <li>--> | ||
<ul class="navbar-nav ml-auto"> | <ul class="navbar-nav ml-auto"> | ||
<li class="nav-item"> | <li class="nav-item"> | ||
− | <a class="nav-link" href="https:// | + | <a class="nav-link" href="https://2021.igem.org/Team:Groningen">Home</a> |
</li> | </li> | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | + | <!-- We add the "dropdown" class if we want a drop-down menu when we click--> | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
<li class="nav-item dropdown"> | <li class="nav-item dropdown"> | ||
− | <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown2" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> | + | |
− | + | <!-- ...And the classes below to display and make this button (little down arrow) work correctly --> | |
− | + | ||
− | + | <!-- What is displayed in the dropdown menu is put in this div with the "dropdown-menu" class and a label to identify which dropdown menu to display--> | |
+ | |||
+ | <!-- The different items in this menu have for class "dropdown-item" in tags <a>--> | ||
+ | |||
+ | <!-- Project submenu--> | ||
+ | <li class="nav-item dropdown"> | ||
+ | <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown2" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Project</a> | ||
<div class="dropdown dropdown-menu" aria-labelledby="navbarDropdown2"> | <div class="dropdown dropdown-menu" aria-labelledby="navbarDropdown2"> | ||
− | <a class="dropdown-item" href="https:// | + | <a class="dropdown-item" href="https://2021.igem.org/Team:Groningen/Description">Description</a> |
− | <a class="dropdown-item" href="https:// | + | <a class="dropdown-item" href="https://2021.igem.org/Team:Groningen/Engineering">Engineering</a> |
− | <a class="dropdown-item" href="https:// | + | <a class="dropdown-item" href="https://2021.igem.org/Team:Groningen/Model">Modeling</a> |
− | <a class="dropdown-item" href="https:// | + | <a class="dropdown-item" href="https://2021.igem.org/Team:Groningen/Experiments">Experiments</a> |
− | <a class="dropdown-item" href="https:// | + | <a class="dropdown-item" href="https://2021.igem.org/Team:Groningen/Notebook">Notebook</a> |
− | <a class="dropdown-item" href="https:// | + | <a class="dropdown-item" href="https://2021.igem.org/Team:Groningen/Results">Results</a> |
− | <a class="dropdown-item" href="https:// | + | <a class="dropdown-item" href="https://2021.igem.org/Team:Groningen/Contribution">Contribution</a> |
− | <a class="dropdown-item" href="https:// | + | <a class="dropdown-item" href="https://2021.igem.org/Team:Groningen/Implementation">Implementation</a> |
</div> | </div> | ||
</li> | </li> | ||
+ | |||
+ | <!-- Team submenu--> | ||
<li class="nav-item dropdown"> | <li class="nav-item dropdown"> | ||
− | <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown3" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> | + | <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown3" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Team</a> |
− | + | <div class="dropdown dropdown-menu" aria-labelledby="navbarDropdown3"> | |
− | + | <a class="dropdown-item" href="https://2021.igem.org/Team:Groningen/Team">Team members</a> | |
− | + | <a class="dropdown-item" href="https://2021.igem.org/Team:Groningen/Attributions">Attributions</a> | |
− | + | <a class="dropdown-item" href="https://2021.igem.org/Team:Groningen/Collaborations">Collaborations</a> | |
− | <a class="dropdown-item" href="https:// | + | <a class="dropdown-item" href="https://2021.igem.org/Team:Groningen/Partnership">Partnership</a> |
− | <a class="dropdown-item" href="https:// | + | <a class="dropdown-item" href="https://2021.igem.org/Team:Groningen/Sponsors">Sponsors</a> |
− | <a class="dropdown-item" href="https:// | + | |
</div> | </div> | ||
</li> | </li> | ||
− | + | ||
− | < | + | |
− | + | <!--Outreach submenu--> | |
− | + | <li class="nav-item dropdown"> | |
− | <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown4" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> | + | <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown4" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Outreach</a> |
− | + | ||
− | + | ||
− | + | ||
<div class="dropdown dropdown-menu" aria-labelledby="navbarDropdown4"> | <div class="dropdown dropdown-menu" aria-labelledby="navbarDropdown4"> | ||
− | <a class="dropdown-item" href="https:// | + | <a class="dropdown-item" href="https://2021.igem.org/Team:Groningen/Human_Practices">Human Practices</a> |
− | + | <a class="dropdown-item" href="https://2021.igem.org/Team:Groningen/Education">Education</a> | |
− | <a class="dropdown-item" href="https:// | + | |
− | + | ||
</div> | </div> | ||
</li> | </li> | ||
+ | |||
<li class="nav-item"> | <li class="nav-item"> | ||
− | <a class="nav-link" href="https:// | + | <a class="nav-link" href="https://2021.igem.org/Team:Groningen/Safety">Safety</a> |
</li> | </li> | ||
− | + | ||
− | <a class="nav-link dropdown-toggle" href="#" id=" | + | <!--Parts submenu--> |
− | + | <li class="nav-item dropdown"> | |
− | + | <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown6" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Parts</a> | |
− | <div class="dropdown dropdown-menu" aria-labelledby=" | + | <div class="dropdown dropdown-menu" aria-labelledby="navbarDropdown6"> |
− | + | <a class="dropdown-item" href="https://2021.igem.org/Team:Groningen/Part_Collection">Part Collection</a> | |
− | + | <a class="dropdown-item" href="https://2021.igem.org/Team:Groningen/Parts">Parts</a> | |
− | + | <a class="dropdown-item" href="https://2021.igem.org/Team:Groningen/Improve">Improve</a> | |
− | + | ||
− | + | ||
</div> | </div> | ||
</li> | </li> | ||
− | <!-- | + | <!-- If we want a physical separation between two items: |
<div class="dropdown-divider"></div> --> | <div class="dropdown-divider"></div> --> | ||
</ul> | </ul> | ||
Line 128: | Line 113: | ||
</nav> | </nav> | ||
</div> | </div> | ||
− | <!-- | + | <!-- END OF MENU--> |
<!-- rocket - top of the page--> | <!-- rocket - top of the page--> |
Latest revision as of 15:31, 16 August 2021