Difference between revisions of "Template:NYU-AD-Header"
(28 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
+ | {{Template_All_Teams}} | ||
<html> | <html> | ||
− | |||
<head> | <head> | ||
<style> | <style> | ||
− | + | #globalWrapper,#content{ | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
width: 99.5%; | width: 99.5%; | ||
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | } | + | |
#main-container{ | #main-container{ | ||
width: 100%; | width: 100%; | ||
Line 31: | Line 13: | ||
overflow:auto; | overflow:auto; | ||
margin:0; | margin:0; | ||
− | background-color: | + | background-color: white; |
− | font-family: | + | font-family: sans-serif; |
} | } | ||
+ | body{ | ||
+ | background:white; | ||
+ | } | ||
+ | #header-container { | ||
+ | background: #397886; | ||
+ | width: 100%; | ||
+ | position: variable; | ||
+ | float:right; | ||
+ | padding-top: 15px; | ||
+ | top:-1px; | ||
+ | left: -1px; | ||
+ | z-index:10; | ||
+ | } | ||
#content-container { | #content-container { | ||
− | padding-top: | + | padding-top:250px; |
− | + | margin:auto; | |
margin-bottom: 30px; | margin-bottom: 30px; | ||
− | width: | + | width: 85%; |
padding-left: 25px; | padding-left: 25px; | ||
− | font-family: | + | font-family: sans-serif; |
− | + | text-align: left; | |
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
} | } | ||
#header-container .arrow { | #header-container .arrow { | ||
Line 57: | Line 44: | ||
} | } | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
.title { | .title { | ||
− | font-family: | + | margin: 0.3em 0 -0.7em 0; |
− | + | color: white; | |
+ | font-weight: normal; | ||
+ | font-family: 'Ultra', sans-serif; | ||
+ | font-size: 20px; | ||
+ | line-height: 42px; | ||
+ | |||
} | } | ||
− | + | .logo{ | |
− | text-align: | + | display:block; |
+ | margin:auto; | ||
+ | } | ||
+ | .list { | ||
+ | width: 100%; | ||
+ | text-align: center; | ||
display: inline; | display: inline; | ||
margin: 0; | margin: 0; | ||
− | padding: | + | padding: 5px 0px 5px 0px; |
list-style: none; | list-style: none; | ||
-webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15) | -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15) | ||
Line 76: | Line 70: | ||
} | } | ||
− | + | .list-item a, .dropdown-list-item a { | |
text-decoration: none; | text-decoration: none; | ||
− | opacity: 0. | + | opacity: 0.9; |
color: #F6F6F6; | color: #F6F6F6; | ||
font-family: Helvetica, Arial, sans-serif; | font-family: Helvetica, Arial, sans-serif; | ||
} | } | ||
− | + | .list-item,.dropdown-list-item { | |
font: bold 12px/18px sans-serif; | font: bold 12px/18px sans-serif; | ||
display: inline-block; | display: inline-block; | ||
margin-right: -4px; | margin-right: -4px; | ||
position: relative; | position: relative; | ||
− | padding: | + | padding: 13px 40px; |
cursor: pointer; | cursor: pointer; | ||
− | width: | + | width: auto; |
-webkit-transition: all 0.2s; | -webkit-transition: all 0.2s; | ||
-moz-transition: all 0.2s; | -moz-transition: all 0.2s; | ||
Line 96: | Line 90: | ||
transition: all 0.2s; | transition: all 0.2s; | ||
} | } | ||
− | + | .dropdown-list-item { | |
− | + | width: auto; | |
− | } | + | margin-right: 0px; |
− | + | } | |
− | + | .list-item a:visited, .dropdown-list-item a:visited{ | |
− | + | color: #F6F6F6; | |
+ | } | ||
+ | .list-item a:hover{ | ||
+ | color: #66cccc; | ||
} | } | ||
− | + | .dropdown-list { | |
padding: 0; | padding: 0; | ||
position: absolute; | position: absolute; | ||
− | top: | + | top: 40px; |
left: 0; | left: 0; | ||
+ | z-index:100; | ||
-webkit-box-shadow: none; | -webkit-box-shadow: none; | ||
-moz-box-shadow: none; | -moz-box-shadow: none; | ||
box-shadow: none; | box-shadow: none; | ||
display: none; | display: none; | ||
− | background: # | + | background: #397886; |
opacity: 0; | opacity: 0; | ||
visibility: hidden; | visibility: hidden; | ||
Line 123: | Line 121: | ||
-transition: opacity 0.2s; | -transition: opacity 0.2s; | ||
} | } | ||
− | + | .dropdown-list-item:hover{ | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
background: #2B2B2B; | background: #2B2B2B; | ||
border-radius:5px; | border-radius:5px; | ||
} | } | ||
− | + | .list-item:hover .dropdown-list { | |
display: block; | display: block; | ||
opacity: 1; | opacity: 1; | ||
Line 139: | Line 133: | ||
</style> | </style> | ||
</head> | </head> | ||
− | |||
<div id="main-container"> | <div id="main-container"> | ||
<div id="header-container"> | <div id="header-container"> | ||
− | + | <img class="logo" src="https://static.igem.org/mediawiki/2015/b/b2/NYUAD-LogoFinal.png"> | |
− | < | + | <ul class="list"> |
− | + | <li class="list-item"> <a href="https://2015.igem.org/Team:NYU-AD">Home</a></li> | |
− | <li class=" | + | <li class="list-item"> |
− | <li class=" | + | <a href="#">Project <span class="arrow">▼</span><i class="icon-arrow"></i></a> |
− | <a href="# | + | <ul class="dropdown-list"> |
− | <ul class="dropdown- | + | <li class="dropdown-list-item"><a href="https://2015.igem.org/Team:NYU-AD/Description">Description</a></li> |
− | <li><a href="https://2015.igem.org/Team:NYU-AD/Description">Description</a></li> | + | <li class="dropdown-list-item"><a href="https://2015.igem.org/Team:NYU-AD/Experiments">Experiments & Protocols</a></li> |
− | <li><a href="https://2015.igem.org/Team:NYU-AD/Experiments">Experiments & Protocols</a></li> | + | <li class="dropdown-list-item"><a href="https://2015.igem.org/Team:NYU-AD/Results">Results</a></li> |
− | <li><a href="https://2015.igem.org/Team:NYU-AD/Results">Results</a></li> | + | <li class="dropdown-list-item"><a href="https://2015.igem.org/Team:NYU-AD/Design">Design</a></li> |
− | <li><a href="https://2015.igem.org/Team:NYU-AD/Design">Design</a></li> | + | |
</ul> | </ul> | ||
</li> | </li> | ||
− | <li class=" | + | <li class="list-item"> |
− | <a href=" | + | <a href="https://2015.igem.org/Team:NYU-AD/Parts">Parts</a> |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
</li> | </li> | ||
− | <li class=" | + | <li class="list-item"> |
− | <a href="# | + | <a href="#">Notebook <span class="arrow">▼</span><i class="icon-arrow"></i></a> |
− | <ul class="dropdown- | + | <ul class="dropdown-list"> |
− | <li><a href=" | + | <li class="dropdown-list-item"><a href="https://2015.igem.org/Team:NYU-AD/Notebook">Wet Lab</a></li> |
− | + | <li class="dropdown-list-item"><a href="https://2015.igem.org/Team:NYU-AD/DryLab">Dry Lab</a></li> | |
− | <li><a href=" | + | <li class="dropdown-list-item"><a href="https://2015.igem.org/Team:NYU-AD/Safety">Safety</a></li> |
</ul> | </ul> | ||
− | </li> | + | </li> |
− | + | <li class="list-item"> | |
− | <li class=" | + | <a href="https://2015.igem.org/Team:NYU-AD/Practices">Human Practices</a> |
− | <li class=" | + | </li> |
− | <a href="# | + | <li class="list-item"> |
− | <ul class="dropdown- | + | <a href="#">About Us <span class="arrow">▼</span><i class="icon-arrow"></i></a> |
− | <li><a href=" | + | <ul class="dropdown-list"> |
− | + | <li class="dropdown-list-item"><a href="https://2015.igem.org/Team:NYU-AD/Team">Team</a></li> | |
− | <li | + | <li class="dropdown-list-item"><a href="https://2015.igem.org/Team:NYU-AD/Advisors">Advisors</a></li> |
− | + | <li class="dropdown-list-item"><a href="https://2015.igem.org/Team:NYU-AD/Attributions">Attributions</a></li> | |
+ | |||
</ul> | </ul> | ||
</li> | </li> | ||
Line 186: | Line 174: | ||
</ul> | </ul> | ||
</div> | </div> | ||
+ | |||
<div id="content-container"> | <div id="content-container"> | ||
+ | |||
</html> | </html> |
Latest revision as of 20:26, 18 September 2015