(Prototype team page) |
Cymarechal (Talk | contribs) |
||
Line 1: | Line 1: | ||
{{UCLouvain}} | {{UCLouvain}} | ||
<html> | <html> | ||
+ | <head> | ||
+ | <title>iGEM UCLouvain Team</title> | ||
+ | |||
+ | <style> | ||
+ | .igem_2017_content_wrapper html, | ||
+ | .igem_2017_content_wrapper body, | ||
+ | .igem_2017_content_wrapper div, | ||
+ | .igem_2017_content_wrapper span, | ||
+ | .igem_2017_content_wrapper p, | ||
+ | .igem_2017_content_wrapper a, | ||
+ | .igem_2017_content_wrapper img, | ||
+ | .igem_2017_content_wrapper ul, | ||
+ | .igem_2017_content_wrapper li, | ||
+ | .igem_2017_content_wrapper footer, | ||
+ | .igem_2017_content_wrapper header, | ||
+ | .igem_2017_content_wrapper nav, | ||
+ | .igem_2017_content_wrapper section { | ||
+ | box-sizing: border-box !important; | ||
+ | margin: 0 !important; | ||
+ | padding: 0 !important; | ||
+ | border: 0 !important; | ||
+ | font-size: 100% !important; | ||
+ | font: inherit !important; | ||
+ | font-family: 'Roboto', 'Arial' !important; | ||
+ | vertical-align: baseline !important; | ||
+ | } | ||
+ | .igem_2017_content_wrapper h2, | ||
+ | .igem_2017_content_wrapper h3 { | ||
+ | box-sizing: border-box !important; | ||
+ | margin: 0 !important; | ||
+ | padding: 10px 0 10px 0 !important; | ||
+ | border: 0 !important; | ||
+ | font-size: 100% !important; | ||
+ | font: inherit !important; | ||
+ | font-family: 'Roboto', 'Arial' !important; | ||
+ | vertical-align: baseline !important; | ||
+ | } | ||
+ | .igem_2017_content_wrapper footer, | ||
+ | .igem_2017_content_wrapper header, | ||
+ | .igem_2017_content_wrapper nav, | ||
+ | .igem_2017_content_wrapper section { | ||
+ | display: block !important; | ||
+ | } | ||
+ | .igem_2017_content_wrapper body { | ||
+ | line-height: 1 !important; | ||
+ | } | ||
+ | .igem_2017_content_wrapper ul { | ||
+ | list-style: none !important; | ||
+ | } | ||
− | + | /* | |
− | + | Our styles | |
− | + | */ | |
− | + | ||
− | + | ||
− | + | ||
+ | /* Import Roboto */ | ||
+ | @import url('https://fonts.googleapis.com/css?family=Roboto:300,400,700'); | ||
+ | .igem_2017_content_wrapper h1 { | ||
+ | display: none !important; | ||
+ | } | ||
+ | .igem_2017_content_wrapper h2, .igem_2017_content_wrapper h3 { | ||
+ | font-weight: normal !important; | ||
+ | } | ||
+ | .igem_2017_content_wrapper h2 { | ||
+ | font-size: 34px !important; | ||
+ | margin-bottom: 20px !important; | ||
+ | color: #222222 !important; | ||
+ | } | ||
+ | .igem_2017_content_wrapper h2.smallclear { | ||
+ | margin-bottom: 5px !important; | ||
+ | } | ||
− | + | .igem_2017_content_wrapper h3 { | |
− | + | font-size: 28px !important; | |
+ | margin-bottom: 20px !important; | ||
+ | color: #222222 !important; | ||
+ | } | ||
− | + | .igem_2017_content_wrapper ul { | |
− | + | margin: 0 !important; | |
− | + | padding: 0 !important; | |
+ | } | ||
− | + | .igem_2017_content_wrapper p { | |
− | + | font-size: 18px !important; | |
− | + | line-height: 32px !important; | |
− | + | color: #222222 !important; | |
− | + | margin-bottom: 1em !important; | |
− | + | text-align: justify !important; | |
− | + | } | |
− | + | .igem_2017_content_wrapper img { | |
− | + | max-width: 100% !important; | |
− | + | height: auto !important; | |
− | + | } | |
− | + | .igem_2017_content_wrapper a { | |
− | + | text-decoration: none !important; | |
− | + | color: #000000 !important; | |
− | + | font-weight: normal !important; | |
− | + | font-size: 18px !important; | |
− | + | transition: all 0.2s ease-in !important; | |
− | + | } | |
− | + | ||
− | + | ||
− | </div> | + | .igem_2017_content_wrapper a:hover { |
− | <div class=" | + | color: #0f6fc6 !important; |
+ | } | ||
+ | |||
+ | #header { | ||
+ | position: relative !important; | ||
+ | z-index: 999 !important; | ||
+ | padding: 0 20px 0 20px !important; | ||
+ | box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23) !important; | ||
+ | } | ||
+ | |||
+ | #logo, #logo a { | ||
+ | height: 150px !important; | ||
+ | line-height: 150px !important; | ||
+ | } | ||
+ | |||
+ | #logo, #logo a, #nav, #nav ul, #nav ul li { | ||
+ | display: inline-block !important; | ||
+ | position: relative !important; | ||
+ | } | ||
+ | |||
+ | #logo img { | ||
+ | height: 125px !important; | ||
+ | vertical-align: middle !important; | ||
+ | } | ||
+ | |||
+ | .igem_2017_content_wrapper { | ||
+ | width: 100% !important; | ||
+ | padding: 0 !important; | ||
+ | margin: 0 !important; | ||
+ | } | ||
+ | |||
+ | .igem_2017_menu_wrapper { | ||
+ | display: none !important; /* Hide this badass menu */ | ||
+ | } | ||
+ | |||
+ | #nav { | ||
+ | font-size: 18px !important; | ||
+ | } | ||
+ | |||
+ | #nav > ul > li { | ||
+ | margin-left: 100px !important; | ||
+ | height: 30px !important; | ||
+ | line-height: 30px !important; | ||
+ | } | ||
+ | |||
+ | #nav ul li ul { | ||
+ | display: block !important; | ||
+ | opacity: 0 !important; | ||
+ | max-height: 0 !important; | ||
+ | overflow: hidden !important; | ||
+ | position: absolute !important; | ||
+ | top: 30px !important; | ||
+ | left: 0px !important; | ||
+ | width: 180px !important; | ||
+ | background-color: #FFFFFF !important; | ||
+ | border-left: 3px solid #0f6fc6 !important; | ||
+ | box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23) !important; | ||
+ | transition: all 0.2s ease-in !important; | ||
+ | } | ||
+ | |||
+ | #nav ul li:hover ul { | ||
+ | opacity: 1 !important; | ||
+ | max-height: 1000px !important; | ||
+ | } | ||
+ | |||
+ | #nav ul li ul li { | ||
+ | display: block !important; | ||
+ | transition: all 0.2s ease-in !important; | ||
+ | } | ||
+ | |||
+ | #nav ul li ul li:hover { | ||
+ | background-color: #eee !important; | ||
+ | } | ||
+ | |||
+ | #nav ul li ul li a { | ||
+ | padding-left: 15px !important; | ||
+ | line-height: 50px !important; | ||
+ | height: 50px !important; | ||
+ | width: 175px !important; | ||
+ | display: inline-block !important; | ||
+ | } | ||
+ | |||
+ | #presentation img { | ||
+ | width: 100% !important; | ||
+ | } | ||
+ | |||
+ | #page { | ||
+ | padding: 60px 90px 0 90px !important; | ||
+ | } | ||
+ | |||
+ | #page:after { | ||
+ | content: "" !important; | ||
+ | display: table !important; | ||
+ | clear: both !important; | ||
+ | } | ||
+ | |||
+ | #page .text, #page .illustration { | ||
+ | width: 50% !important; | ||
+ | float: left !important; | ||
+ | vertical-align: top !important; | ||
+ | } | ||
+ | |||
+ | #page .text { | ||
+ | padding-right: 30px !important; | ||
+ | } | ||
+ | |||
+ | #page .illustration { | ||
+ | padding-left: 30px !important; | ||
+ | } | ||
+ | |||
+ | #page .illustration img { | ||
+ | border: 15px solid #FFFFFF !important; | ||
+ | box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23) !important; | ||
+ | filter: opacity(90%) grayscale(30%) !important; | ||
+ | } | ||
+ | |||
+ | #footer { | ||
+ | padding: 60px 90px 60px 90px !important; | ||
+ | } | ||
+ | |||
+ | #footer ul { | ||
+ | text-align: center !important; | ||
+ | } | ||
+ | |||
+ | #footer ul li { | ||
+ | display: inline-block !important; | ||
+ | width: auto !important; | ||
+ | max-width: 12.5% !important; | ||
+ | height: 200px !important; | ||
+ | line-height: 200px !important; | ||
+ | padding: 20px !important; | ||
+ | vertical-align: middle !important; | ||
+ | } | ||
+ | |||
+ | #footer ul li img { | ||
+ | max-width: 100% !important; | ||
+ | width: auto !important; | ||
+ | height: auto !important; | ||
+ | max-height: 400px !important; | ||
+ | vertical-align: middle !important; | ||
+ | } | ||
+ | |||
+ | @media (max-width: 1000px) { | ||
+ | #page .text, #page .illustration { | ||
+ | width: 100% !important; | ||
+ | float: left !important; | ||
+ | padding: 0 !important; | ||
+ | } | ||
+ | } | ||
+ | </style> | ||
+ | </head> | ||
+ | <body> | ||
+ | <header id="header"> | ||
+ | <div id="logo"> | ||
+ | <a href="/"><img src="https://static.igem.org/mediawiki/2017/3/3d/UCLouvain_igem_logo.png" alt="IGem UCLouvain Team"></a> | ||
+ | </div> | ||
+ | <nav id="nav"> | ||
+ | <ul> | ||
+ | <li> | ||
+ | <a href="#">Our Project</a> | ||
+ | <ul> | ||
+ | <li><a href="#">Overview</a></li> | ||
+ | <li><a href="#">Approach 1</a></li> | ||
+ | <li><a href="#">Approach 2</a></li> | ||
+ | <li><a href="./Team:UCLouvain/Attributions">Attributions</a></li> | ||
+ | <li><a href="./Team:UCLouvain/InterLab">InterLab</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="#">In The Lab</a> | ||
+ | <ul> | ||
+ | <li><a href="#">Overview</a></li> | ||
+ | <li><a href="#">Protocols</a></li> | ||
+ | <li><a href="#">Parts</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li><a href="#">Human Practices</a></li> | ||
+ | <li> | ||
+ | <a href="#">About us</a> | ||
+ | <ul> | ||
+ | <li><a href="#">Team</a></li> | ||
+ | <li><a href="#">Aknowledgement</a></li> | ||
+ | <li><a href="#">Our University</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </nav> | ||
+ | </header> | ||
+ | <section id="content"> | ||
+ | <div id="page"> | ||
+ | <h2 class="smallclear">TITRE</h2> | ||
+ | <h3>SOUS-TITRE</h3> | ||
+ | <p>TEXTE</p> | ||
+ | </div> | ||
+ | </section> | ||
+ | <footer id="footer"> | ||
+ | <h2>Our sponsors</h2> | ||
+ | <ul><!-- | ||
+ | --><li><a href="https://uclouvain.be/en/index.html" target="_blank"><img src="https://static.igem.org/mediawiki/2017/8/87/Logo-UCL.jpg" alt="UCL"></a></li><!-- | ||
+ | --><li><a href="http://www.federation-wallonie-bruxelles.be/index.php?id=39" target="_blank"><img src="https://static.igem.org/mediawiki/2017/a/a1/Logo-FWB.png" alt="Fédération Wallonie Bruxelles"></a></li><!-- | ||
+ | --><li><a href="https://uclouvain.be/fr/chercher/fondation-louvain" target="_blank"><img src="https://static.igem.org/mediawiki/2017/3/39/Logo-Fondation_Louvain.png" alt="Fondation Louvain"></a></li><!-- | ||
+ | --><li><a href="https://www.neb.com/" target="_blank"><img src="https://static.igem.org/mediawiki/2017/c/cd/Logo-Imperial_College.png" alt="Imperial College"></a></li><!-- | ||
+ | --><li><a href="http://www.agilent.com/home" target="_blank"><img src="https://static.igem.org/mediawiki/2017/8/88/Logo-Agilent_Technologies.png" alt="Agilent Technologies"></a></li><!-- | ||
+ | --><li><a href="https://www.aglouvain.be/site2/" target="_blank"><img src="https://static.igem.org/mediawiki/2017/5/5d/Logo-AGL.png" alt="AGL"></a></li><!-- | ||
+ | --><li><a href="https://uclouvain.be/en/research-institutes/isv" target="_blank"><img src="https://static.igem.org/mediawiki/2017/1/13/Logo-ISV.png" alt="ISV"></a></li><!-- | ||
+ | --><li><a href="https://uclouvain.be/en/faculties/sc" target="_blank"><img src="https://static.igem.org/mediawiki/2017/0/01/Logo-UCL_Sciences.jpg" alt="UCL faculté des Sciences"></a></li><!-- | ||
+ | --></ul> | ||
+ | </footer> | ||
+ | </body> | ||
</html> | </html> |
Latest revision as of 15:25, 22 October 2017
TITRE
SOUS-TITRE
TEXTE