Difference between revisions of "Template:BioMarvel"

Line 69: Line 69:
 
/**************************************************************************************************************************************************************************************************/
 
/**************************************************************************************************************************************************************************************************/
  
−
                #topMenu {
+
/*this wraps the whole of the menu*/
−
height : 180px;
+
.igem_2018_team_menu {  
−
width: 950px;
+
background-color:#c4baba;  
−
margin-left: 50px;
+
border-left: 1px solid #c4baba;
−
margin-top: 20px;
+
display:block;
−
}
+
float:right;  
−
#topMenu ul {
+
height:100vh;
−
list-style-type: none;
+
max-width: 270px;
−
margin: 0px;
+
overflow-y: auto;
−
padding: 0px;
+
overflow-x: hidden;
−
}
+
padding:0px;
−
#topMenu ul li {
+
position:fixed;  
−
list-style: none;
+
right:0%;
−
color: black !important;
+
text-align:left;
−
background-color: rgba(0,0,0,0.0);
+
width: 15%;  
−
float: left;
+
}
−
line-height: 30px;
+
 
−
vertical-align: middle;
+
 
−
text-align: left;
+
.igem_2018_team_menu.displaying_menu{
−
position: relative;
+
display:block;
−
}
+
}
−
.menuLink, .submenuLink {
+
 
−
text-decoration: none;
+
.igem_2018_team_menu  a {
−
display: block;
+
color: #484848;
−
width: 100px;
+
text-decoration:none;
−
font-size: 12px;
+
}
−
font-weight: bold;
+
 
−
padding-left: 5px;  
+
.igem_2018_team_menu img {
−
}
+
width:100%;
−
.menuLink {
+
}
−
color: black !important;
+
 
−
margin-left: 5px;
+
 
−
}
+
.igem_2018_team_menu .menu_item {
−
.topMenuLi:hovor .menuLink {
+
    background-color: #c4baba;
−
color: #888888 !important;
+
    border-bottom: 1px solid #928b8b;
−
}
+
    clear: both;
−
.submenuLink {
+
color: #484848;
−
color: black !important;
+
    cursor: pointer;
−
margin-top: -1px;
+
float: left;
−
text-align: left;
+
    font-size: 120%;
−
}
+
    font-weight: bold;
−
.longLink {
+
    padding: 15px 0px 15px 5%;
−
width: 100px;
+
  width: 100%;
−
}
+
}
−
.submenu {
+
 
−
position: absolute;
+
.igem_2018_team_menu .menu_item.direct_link {
−
height: 0px;
+
color: #484848;
−
overflow: hidden;
+
padding-left: 15%;
−
transition: height .2s;
+
}
−
}
+
.igem_2018_team_menu .menu_item:hover {
−
.topMenuLi:hover .submenu {
+
background-color: #ecb656;
−
height: 250px;
+
}
−
}
+
 
−
.submenuLink:hover {
+
 
−
color: #888888 !important;
+
.igem_2018_team_menu .menu_item .submenu_control_icon {
−
}
+
color: #484848;
 +
float: left;
 +
width: 10%;
 +
}
 +
 
 +
/* submenu icon "+"  "-"*/
 +
.igem_2018_team_menu .menu_item .submenu_control_icon::before {
 +
content: "+";  
 +
}
 +
 
 +
/* submenu icon "+"  "-"*/
 +
.igem_2018_team_menu .menu_item .submenu_control_icon.open::before {
 +
content: "-";
 +
}
 +
 
 +
/*submenu wrapper*/
 +
.igem_2018_team_menu .submenu{
 +
background-color: #e4dede;
 +
clear:both;
 +
display:none;
 +
float: left;
 +
width:100%;
 +
}
 +
 
 +
/*styling for a submenu item*/
 +
.igem_2018_team_menu .submenu .submenu_item {
 +
border-bottom: 1px solid #c4baba;
 +
  color: #635d5d;
 +
    height: 30px;
 +
  float: left;
 +
    font-size: 110%;
 +
font-weight: bold;
 +
    padding: 12px 0px 0px 15%;
 +
    width: 100%;
 +
}
 +
 
 +
.igem_2018_team_menu .submenu .submenu_item:hover {
 +
background-color: #f3bd5d;
 +
}
 +
 
 +
 
 +
.igem_2018_team_menu .submenu .submenu_item.current_page,
 +
.igem_2018_team_menu .menu_item.current_page,
 +
.igem_2018_team_menu .menu_item.direct_link.current_page {
 +
background-color:#7acbd8;
 +
}
 +
 
  
  
Line 464: Line 510:
 
<!-- This tells the browser that your page is responsive -->
 
<!-- This tells the browser that your page is responsive -->
 
<meta name="viewport" content="width=device-width, initial-scale=1">  
 
<meta name="viewport" content="width=device-width, initial-scale=1">  
−
+
 
 
</head>
 
</head>
  
Line 473: Line 519:
 
<!------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
 
<!------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
  
−
<nav id="topMenu">
+
 
−
<ul>
+
 
−
<li class="topMenuLi">
+
 
−
<a class="menuLink" href="#">Project</a>
+
<div class="igem_2018_team_mobile_bar">
−
<ul class="submenu">
+
−
<li><a class="submenuLink longLink" href="#">Overview</a></li>
+
<div class="igem_logo_mobile">
−
<li><a class="submenuLink longLink" href="#">Background</a></li>
+
<img src="https://static.igem.org/mediawiki/2018/4/4f/2018_igem_mobile_menu_logo.svg">
−
<li><a class="submenuLink longLink" href="#">Design</a></li>
+
</div>
−
<li><a class="submenuLink longLink" href="#">Experiments</a></li>
+
 
−
<li><a class="submenuLink longLink" href="#">Results</a></li>
+
 
−
<li><a class="submenuLink longLink" href="#">Demonstrate</a></li>
+
<div class="igem_menu_control_mobile">
−
<li><a class="submenuLink longLink" href="#">Improve</a></li>
+
<img id="menu_control_image" src="https://static.igem.org/mediawiki/igem.org/3/3b/Menu_icon.svg">
−
</ul>
+
</div>
−
</li>
+
 
−
<li class="topMenuLi">
+
</div>
−
<a class="menuLink" href="#">People</a>
+
 
−
<ul class="submenu">
+
 
−
<li><a class="submenuLink longLink" href="#">Members</a></li>
+
 
−
<li><a class="submenuLink longLink" href="#">Advisors</a></li>
+
 
−
<li><a class="submenuLink longLink" href="#">Attributions</a></li>
+
<div class="igem_2018_team_menu displaying_menu">
−
<li><a class="submenuLink longLink" href="#">Collaborations</a></li>
+
 
−
</ul>
+
 
−
</li>
+
<a href="https://2018.igem.org/Team:BioMarvel">
−
<li class="topMenuLi">
+
<img src="http://placehold.it/350x150/e4dede/c4baba">
−
<a class="menuLink" href="#">Parts</a>
+
</a>
−
<ul class="submenu">
+
 
−
<li><a class="submenuLink longLink" href="#">Parts overview</a></li>
+
 
−
<li><a class="submenuLink longLink" href="#">Basic Parts</a></li>
+
 
−
<li><a class="submenuLink longLink" href="#">Composite Parts</a></li>
+
<a href="https://2018.igem.org/Team:BioMarvel">
−
<li><a class="submenuLink longLink" href="#">Parts collection</a></li>
+
<div class="menu_item direct_link">
−
</ul>
+
HOME
−
</li>
+
</div>  
−
<li class="topMenuLi">
+
</a>
−
<a class="menuLink" href="#">Human Practices</a>
+
 
−
<ul class="submenu">
+
<!-- Team -->
−
<li><a class="submenuLink longLink" href="#">Human Practices</a></li>
+
<div class="menu_item">
−
<li><a class="submenuLink longLink" href="#">Public Education</a></li>
+
<div class="submenu_control_icon"> </div>
−
<li><a class="submenuLink longLink" href="#">& Engagement</a></li>
+
TEAM
−
</ul>
+
</div>  
−
</li>
+
<div class="submenu">
−
<li class="topMenuLi">
+
−
<a class="menuLink" href="#">Safety</a>
+
<a href="https://2018.igem.org/Team:BioMarvel/Team">
−
<ul class="submenu">
+
<div class="submenu_item">
−
<li><a class="submenuLink longLink" href="#">Lab Safety</a></li>
+
Team Members
−
<li><a class="submenuLink longLink" href="#">Safe Project Design</a></li>
+
</div>
−
<li><a class="submenuLink longLink" href="#">Safe product Use</a></li>
+
</a>
−
</ul>
+
 
−
</li>
+
<a href="https://2018.igem.org/Team:BioMarvel/Collaborations">
−
<li class="topMenuLi">
+
<div class="submenu_item">
−
<a class="menuLink" href="#">NoteBook</a>
+
Collaborations
−
<ul class="submenu">
+
</div>
−
<li><a class="submenuLink longLink" href="#">Demonstration</a></li>
+
</a>
−
</ul>
+
</div>
−
</li>
+
 
−
<li><a class="menuLink" href="#">Awards</a></li>
+
 
−
<li><a class="menuLink" href="https://igem.org/2018_Judging_Form?team=BioMarvel">Judging Form</a></li>
+
<!-- Project -->
−
</ul>
+
<div class="menu_item">
−
</nav>
+
<div class="submenu_control_icon"> </div>
 +
PROJECT
 +
</div>  
 +
<div class="submenu">
 +
 +
<a href="https://2018.igem.org/Team:BioMarvel/Description">
 +
<div class="submenu_item">
 +
Description
 +
</div>
 +
</a>
 +
 
 +
<a href="https://2018.igem.org/Team:BioMarvel/Design">
 +
<div class="submenu_item">
 +
Design
 +
</div>
 +
</a>
 +
 
 +
<a href="https://2018.igem.org/Team:BioMarvel/Experiments">
 +
<div class="submenu_item">
 +
Experiments
 +
</div>
 +
</a>
 +
 
 +
 
 +
<a href="https://2018.igem.org/Team:BioMarvel/Notebook">
 +
<div class="submenu_item">
 +
Notebook
 +
</div>
 +
</a>
 +
 
 +
<a href="https://2018.igem.org/Team:BioMarvel/InterLab">
 +
<div class="submenu_item">
 +
InterLab
 +
</div>
 +
</a>
 +
 
 +
 
 +
<a href="https://2018.igem.org/Team:BioMarvel/Model">
 +
<div class="submenu_item">
 +
Model
 +
</div>
 +
</a>
 +
 
 +
<a href="https://2018.igem.org/Team:BioMarvel/Results">
 +
<div class="submenu_item">
 +
Results
 +
</div>
 +
</a>
 +
 
 +
 
 +
<a href="https://2018.igem.org/Team:BioMarvel/Demonstrate">
 +
<div class="submenu_item">
 +
Demonstrate
 +
</div>
 +
</a>
 +
 
 +
<a href="https://2018.igem.org/Team:BioMarvel/Improve">
 +
<div class="submenu_item">
 +
Improve
 +
</div>
 +
</a>
 +
 
 +
<a href="https://2018.igem.org/Team:BioMarvel/Attributions">
 +
<div class="submenu_item">
 +
Attributions
 +
</div>
 +
</a>
 +
 
 +
</div>
 +
 
 +
 
 +
<div class="menu_item">
 +
<div class="submenu_control_icon"> </div>
 +
PARTS
 +
</div>
 +
<div class="submenu">
 +
 +
<a href="https://2018.igem.org/Team:BioMarvel/Parts">
 +
<div class="submenu_item">
 +
Parts Overview
 +
</div>
 +
</a>
 +
 
 +
<a href="https://2018.igem.org/Team:BioMarvel/Basic_Part">
 +
<div class="submenu_item">
 +
Basic Parts
 +
</div>
 +
</a>
 +
 
 +
<a href="https://2018.igem.org/Team:BioMarvel/Composite_Part">
 +
<div class="submenu_item">
 +
Composite Parts
 +
</div>
 +
</a>
 +
 
 +
<a href="https://2018.igem.org/Team:BioMarvel/Part_Collection">
 +
<div class="submenu_item">
 +
Part Collection
 +
</div>
 +
</a>
 +
</div>  
 +
 
 +
 +
 +
 +
 +
 
 +
<a href="https://2018.igem.org/Team:BioMarvel/Safety">
 +
<div class="menu_item direct_link">
 +
SAFETY
 +
</div>
 +
</a>
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
<div class="menu_item">
 +
<div class="submenu_control_icon"> </div>  
 +
HUMAN PRACTICES
 +
</div>
 +
 
 +
<div class="submenu">
 +
 
 +
<a href="https://2018.igem.org/Team:BioMarvel/Human_Practices">
 +
<div class="submenu_item">
 +
Human Practices
 +
</div>
 +
</a>
 +
 
 +
 
 +
<a href="https://2018.igem.org/Team:BioMarvel/Public_Engagement">
 +
<div class="submenu_item">
 +
Education & Engagement
 +
</div>
 +
</a>
 +
 
 +
</div>
 +
 
 +
 
 +
 
 +
 
 +
 
 +
<div class="menu_item">
 +
<div class="submenu_control_icon"> </div>  
 +
AWARDS
 +
</div>  
 +
 
 +
<div class="submenu">
 +
 
 +
<a href="https://2018.igem.org/Team:BioMarvel/Applied_Design">
 +
<div class="submenu_item">
 +
Applied Design
 +
</div>
 +
</a>
 +
 
 +
<a href="https://2018.igem.org/Team:BioMarvel/Entrepreneurship">
 +
<div class="submenu_item">
 +
Entrepreneurship
 +
</div>
 +
</a>
 +
 
 +
<a href="https://2018.igem.org/Team:BioMarvel/Hardware">
 +
<div class="submenu_item">
 +
Hardware
 +
</div>
 +
</a>
 +
 
 +
<a href="https://2018.igem.org/Team:BioMarvel/Measurement">
 +
<div class="submenu_item">
 +
Measurement
 +
</div>
 +
</a>
 +
 
 +
<a href="https://2018.igem.org/Team:BioMarvel/Model">
 +
<div class="submenu_item">
 +
Model
 +
</div>
 +
</a>
 +
 
 +
<a href="https://2018.igem.org/Team:BioMarvel/Plant">
 +
<div class="submenu_item">
 +
Plant
 +
</div>
 +
</a>
 +
 
 +
 
 +
<a href="https://2018.igem.org/Team:BioMarvel/Software">
 +
<div class="submenu_item">
 +
Software
 +
</div>
 +
</a>
 +
 
 +
</div>  
 +
 
 +
 
 +
 
 +
<a href="https://igem.org/2018_Judging_Form?team=BioMarvel">
 +
<div class="menu_item direct_link">
 +
JUDGING FORM ⇗
 +
</div>  
 +
</a>
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
</div>
  
 
<!------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
 
<!------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->

Revision as of 14:35, 4 September 2018

HOME
TEAM
Team Members
Collaborations
PROJECT
Description
Design
Experiments
Notebook
InterLab
Model
Results
Demonstrate
Improve
Attributions
PARTS
Parts Overview
Basic Parts
Composite Parts
Part Collection
SAFETY
HUMAN PRACTICES
Human Practices
Education & Engagement
AWARDS
Applied Design
Entrepreneurship
Hardware
Measurement
Model
Plant
Software
JUDGING FORM ⇗