(90 intermediate revisions by 2 users not shown) | |||
Line 1: | Line 1: | ||
<html> | <html> | ||
− | < | + | <head> |
− | + | ||
− | + | ||
− | <!-- | + | <!-- |
+ | > CSS is inlined into the webpage for sake of speed | ||
+ | --> | ||
+ | |||
+ | <!-- Banner CSS --> | ||
+ | |||
+ | <style> | ||
− | |||
#content { | #content { | ||
Line 15: | Line 18: | ||
#bars_item img { | #bars_item img { | ||
− | max-width: | + | max-width: none; |
} | } | ||
− | |||
− | |||
− | + | #top_title { | |
+ | display: none; | ||
+ | } | ||
+ | #content { | ||
+ | margin-top: -18px; | ||
+ | } | ||
+ | #sideMenu { | ||
+ | display: none; | ||
+ | } | ||
+ | .ucla-scroll-down { | ||
+ | display: block; | ||
+ | margin: 10px auto; | ||
+ | width: 50px; | ||
+ | } | ||
+ | .top-bar { | ||
+ | width: 100%; | ||
+ | } | ||
+ | #header-menu h2 { | ||
+ | color: white; | ||
+ | } | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | + | body { | |
− | + | margin: 0; | |
− | + | margin-top: 16px; | |
+ | } | ||
− | + | #header-bar { | |
+ | width: 100%; | ||
+ | height: 10em; | ||
+ | background-color: #00004d; | ||
+ | } | ||
+ | #footer-bar { | ||
+ | width: 100%; | ||
+ | height: 3em; | ||
+ | background-color: #00004d; | ||
+ | } | ||
− | + | #sponsor-footer-bar { | |
− | + | width: 100%; | |
− | + | height: 3em; | |
− | + | background-color: darkgray; | |
− | + | } | |
− | + | ||
− | + | #sponsor-footer-bar img { | |
− | + | display: inline-block; | |
− | + | height: 3em; | |
− | + | width: auto; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | #footer-bar a { float: right; } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
+ | #social-bar { margin-right: 3em; } | ||
− | + | .social-button { | |
+ | padding: .25em 1.5em 0em 1.5em; | ||
+ | width: 2.5em; | ||
+ | height: auto; | ||
+ | } | ||
+ | #header-logo-ucla-container { float: left; } | ||
− | + | #header-menu { | |
+ | float: right; | ||
+ | font-family: sans-serif; | ||
+ | margin-right: 9em; | ||
+ | margin-top: 2.5em; | ||
+ | list-style-type: none; | ||
+ | overflow: hidden; | ||
+ | } | ||
+ | #header-logo-ucla { | ||
+ | width: 10em; | ||
+ | height: auto; | ||
+ | margin-left: 1.5em; | ||
+ | margin-top: .75em; | ||
+ | } | ||
− | + | .header-logo-general { | |
− | + | width: 7em; | |
− | + | height: auto; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
+ | .header-logo-general-container { | ||
+ | position: absolute; | ||
+ | right: 1em; | ||
+ | top: 2.9em; | ||
+ | } | ||
− | + | .dropdown { | |
− | + | display: inline-block; | |
− | + | width: 11em; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | .dropdown:hover { | |
− | + | background-color: #001a66; | |
− | + | border-top-right-radius: 10px; | |
+ | border-top-left-radius: 10px; | ||
+ | } | ||
− | + | .dropdown:hover .dropdown-content { | |
+ | background-color: #001a66; | ||
+ | border-bottom-right-radius: 10px; | ||
+ | border-bottom-left-radius: 10px; | ||
+ | } | ||
− | -- | + | .dropdown a { |
+ | display: inline-block; | ||
+ | width: 100%; | ||
+ | color: white; | ||
+ | text-align: center; | ||
+ | text-decoration: none; | ||
+ | font-size: 1.2em; | ||
+ | cursor: pointer; | ||
+ | } | ||
− | + | .dropdown-content { | |
+ | display: none; | ||
+ | position: absolute; | ||
+ | width: 11em; | ||
+ | background-color: #003366; | ||
+ | } | ||
+ | .dropdown:hover .dropdown-content { display: block; } | ||
+ | .dropdown-content a:last-child:hover { | ||
+ | border-bottom-left-radius: 10px; | ||
+ | border-bottom-right-radius: 10px; | ||
+ | } | ||
− | + | .dropdown-content a { | |
− | + | color: white; | |
+ | padding-top: .7em; | ||
+ | padding-bottom: .7em; | ||
+ | text-align: center; | ||
+ | text-decoration: none; | ||
+ | display: block; | ||
+ | border-top-style: solid; | ||
+ | border-top-color: white; | ||
+ | border-top-width: 2px; | ||
+ | } | ||
+ | .dropdown-content a:hover { background-color: #001a33; } | ||
+ | #project-header { | ||
+ | width: 100%; | ||
+ | height: 12em; | ||
+ | background-color: #1b1b32; | ||
+ | border-top: solid 1.5px white; | ||
+ | border-bottom: solid 1px white; | ||
+ | text-align: center; | ||
+ | } | ||
+ | </style> | ||
+ | </head> | ||
+ | <link rel="stylesheet" href="https://2016.igem.org/Team:UCLA/core/customcss?action=raw&ctype=text/css" /> | ||
+ | <div id="header-bar"> | ||
+ | <div id="header-logo-ucla-container"> | ||
+ | <a href="https://2016.igem.org/Team:UCLA"><img id="header-logo-ucla" src="https://static.igem.org/mediawiki/2016/8/8f/UCLA_iGEM_Logo.png"></a> | ||
+ | </div> | ||
+ | <div class="header-logo-general-container"> | ||
+ | <a target="_blank" href="https://2016.igem.org"><img class="header-logo-general" src="https://static.igem.org/mediawiki/2016/b/b2/T--UCLA--logowhite.png"></a> | ||
+ | </div> | ||
+ | <div id="header-menu-container"> | ||
+ | <ul id="header-menu"> | ||
+ | <li class="dropdown"> | ||
+ | <a><h2>Projects</h2></a> | ||
+ | <div class="dropdown-content"> | ||
+ | <a href="https://2016.igem.org/Team:UCLA/Protein_Cages">Protein Cages</a> | ||
+ | <a href="https://2016.igem.org/Team:UCLA/Super_Soldier_Bacteria">Super Soldier Systems</a> | ||
+ | <a href="https://2016.igem.org/Team:UCLA/InterLab">Interlab Study</a> | ||
+ | </div> | ||
+ | </li> | ||
+ | <li class="dropdown"> | ||
+ | <a href="https://2016.igem.org/Team:UCLA/Parts"><h2>Parts</h2></a> | ||
+ | <div class="dropdown-content"> | ||
+ | <a href="https://2016.igem.org/Team:UCLA/Basic_Part">Basic Parts</a> | ||
+ | <a href="https://2016.igem.org/Team:UCLA/Composite_Part">Composite Parts</a> | ||
+ | <a href="https://2016.igem.org/Team:UCLA/Part_Collection">Part Collection</a> | ||
+ | </div> | ||
+ | </li> | ||
+ | <li class="dropdown"> | ||
+ | <a><h2>Outreach</h2></a> | ||
+ | <div class="dropdown-content"> | ||
+ | <a href="https://2016.igem.org/Team:UCLA/HP/Silver">Human Practices</a> | ||
+ | <a href="https://2016.igem.org/Team:UCLA/Collaborations">Collaborations</a> | ||
+ | </div> | ||
+ | </li> | ||
− | < | + | <li class="dropdown"> |
+ | <a><h2>Judging</h2></a> | ||
+ | <div class="dropdown-content"> | ||
+ | <a href="https://2016.igem.org/Team:UCLA/Medal_Requirements">Medal Requirements</a> | ||
+ | <a href="https://2016.igem.org/Team:UCLA/Safety">Safety</a> | ||
+ | </div> | ||
+ | </li> | ||
+ | <li class="dropdown"> | ||
+ | <a><h2>Team</h2></a> | ||
+ | <div class="dropdown-content"> | ||
+ | <a href="https://2016.igem.org/Team:UCLA/Team">Meet the Team</a> | ||
+ | <a href="https://2016.igem.org/Team:UCLA/Attributions">Attributions</a> | ||
+ | </div> | ||
+ | </li> | ||
+ | |||
+ | </ul> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <script> | ||
// This is the jquery part of your template. Try not modify any of this code since it makes your menu work. | // This is the jquery part of your template. Try not modify any of this code since it makes your menu work. | ||
Line 227: | Line 304: | ||
</script> | </script> | ||
− | |||
</html> | </html> |
Latest revision as of 03:54, 20 October 2016