Line 1: | Line 1: | ||
<html> | <html> | ||
− | < | + | <head> |
− | + | ||
− | + | ||
− | + | ||
− | <!-- | + | <!-- |
+ | > CSS is inlined into the webpage for sake of speed | ||
+ | --> | ||
− | < | + | <!-- Banner CSS --> |
− | + | <style> | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | body { | |
− | + | margin: 0; | |
− | } | + | margin-top: 16px; |
+ | } | ||
− | # | + | #header-bar { |
− | + | width: 100%; | |
− | } | + | height: 10em; |
+ | background-color: #00004d; | ||
+ | } | ||
− | # | + | #footer-bar { |
− | + | position: absolute; | |
− | } | + | width: 100%; |
+ | height: 3em; | ||
+ | bottom: 0; | ||
+ | background-color: #00004d; | ||
+ | } | ||
− | # | + | #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; | ||
+ | } | ||
+ | |||
+ | .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; } | ||
+ | |||
+ | </style> | ||
+ | |||
+ | </head> | ||
− | |||
− | |||
<link rel="stylesheet" href="https://2016.igem.org/Team:UCLA/core/customcss?action=raw&ctype=text/css" /> | <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 target="_blank" 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 href="#"><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/2016_Interlab_Study">Interlab Study</a> | ||
+ | </div> | ||
+ | </li> | ||
+ | |||
+ | <li class="dropdown"> | ||
+ | <a href="#"><h2>Parts</h2></a> | ||
+ | <div class="dropdown-content"> | ||
+ | <a href="https://2016.igem.org/Team:UCLA/Parts">Parts</a> | ||
+ | <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 href="#"><h2>Outreach</h2></a> | ||
+ | <div class="dropdown-content"> | ||
+ | <a href="https://2016.igem.org/Team:UCLA/Human_Practices">Human Practices</a> | ||
+ | <a href="https://2016.igem.org/Team:UCLA/Collaborations">Collaborations</a> | ||
+ | </div> | ||
+ | </li> | ||
+ | |||
+ | <li class="dropdown"> | ||
+ | <a href="#"><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 href="#"><h2>Team</h2></a> | ||
+ | <div class="dropdown-content"> | ||
+ | <a href="https://2016.igem.org/Team:UCLA/Meet_the_Team">Meet the Team</a> | ||
+ | <a href="https://2016.igem.org/Team:UCLA/Advisors">Advisors</a> | ||
+ | <a href="https://2016.igem.org/Team:UCLA/Contributions">Contributions</a> | ||
+ | </div> | ||
+ | </li> | ||
+ | |||
+ | </ul> | ||
+ | </div> | ||
+ | </div> | ||
+ | <p>PLACEHOLDER</p> | ||
+ | <div id="footer-bar"> | ||
+ | <div id="social-bar"> | ||
+ | <a target="_top" href="mailto:igemucla@gmail.com"><img class="social-button" src="https://static.igem.org/mediawiki/2016/4/4d/T--UCLA--File_email.png"></a> | ||
+ | <a target="_blank" href="https://www.twitter.com/UCLAiGEM"><img class="social-button" src="https://static.igem.org/mediawiki/2016/0/02/T--UCLA--File_twitter.png"></a> | ||
+ | <a target="_blank" href="https://www.facebook.com/UCLAiGEM"><img class="social-button" src="https://static.igem.org/mediawiki/2016/d/d3/T--UCLA--File_fb.png"></a> | ||
+ | </div> | ||
+ | </div> | ||
<script> | <script> | ||
Line 111: | Line 258: | ||
</script> | </script> | ||
+ | |||
</html> | </html> |
Revision as of 00:13, 12 October 2016
PLACEHOLDER