Difference between revisions of "Template:Tuebingen"
| Line 4: | Line 4: | ||
<html> | <html> | ||
| − | + | <!-- Start of CSS--> | |
| − | + | <style type="text/css"> | |
| − | + | /* PAGE LAYOUT */ | |
| − | + | /* Change Background color*/ | |
| − | + | body { | |
| − | + | background-color: #fff; | |
| − | + | } | |
| − | + | /* Creates a container that will wrap all of the content inside your wiki pages. */ | |
| − | + | #mainContainer { | |
| − | + | width: 978px; | |
| − | + | overflow:hidden; | |
| − | + | float:left; | |
| − | + | margin-left:20px; | |
| − | + | margin-bottom: 10px; | |
| − | + | background-color: #fff; | |
| − | + | border-bottom: 14px solid #565656; | |
| − | + | border-right: 2px solid #565656; | |
| − | + | border-left: 2px solid #565656; | |
| − | + | border-top: 2px solid #565656; | |
| − | + | font-family: "Trebuchet MS", Helvetica, sans-serif; | |
| − | + | } | |
| − | + | /* Creates the container for the menu */ | |
| − | + | #menuContainer { | |
| − | + | float:left; | |
| − | + | width: 134px; | |
| − | + | padding: 20px 0px; | |
| − | + | border-top: 14px solid #565656; | |
| − | + | background-color: #E8E8E9; | |
| − | + | } | |
| − | + | /* Creates the container for the content */ | |
| − | + | #contentContainer { | |
| − | + | padding-top:20px; | |
| − | + | padding-right:10px; | |
| − | + | margin-bottom: 20px; | |
| − | + | width: 814px; | |
| − | + | padding-left: 20px; | |
| − | + | float: left; | |
| − | + | background-color: #fff; | |
| − | + | border-top: 14px solid #565656; | |
| − | + | font-family: "Trebuchet MS", Helvetica, sans-serif; | |
| − | + | } | |
| − | + | /*Set up height place holder for the banner*/ | |
| − | + | #bannerContainer { | |
| − | + | height:200px; | |
| − | + | margin:auto; | |
| − | + | text-align:center; | |
| − | + | color: #24B694; | |
| − | + | } | |
| − | + | /*VISUAL STYLE (TABLES, FONTS, LINKS, IMAGES, UL) */ | |
| − | + | /*Change the styling of text for everything inside main container*/ | |
| − | + | #mainContainer p { | |
| − | + | font-size: 13px; | |
| − | + | color: #000000; | |
| − | + | } | |
| − | + | /*This changes the color and font family */ | |
| − | + | #contentContainer h1, h2, h3, h4, h5, h6 { | |
| − | + | color: #565656; | |
| − | + | border-bottom: none; | |
| − | + | font-weight: bold; | |
| − | + | font-family: "Trebuchet MS", Helvetica, sans-serif; | |
| − | + | margin-top:10px; | |
| − | + | } | |
| − | + | /*Style of the links - links are different inside the menu */ | |
| − | + | #contentContainer a { | |
| − | + | font-weight: bold; | |
| − | + | color: #23b593; | |
| − | + | } | |
| − | + | /* Styling links on hover- links are different inside the menu */ | |
| − | + | #contentContainer a:hover { | |
| − | + | color: #59bf92; | |
| − | + | } | |
| − | + | /*Change the styling of tables */ | |
| − | + | #contentContainer table { | |
| − | + | border: 1px solid #565656; | |
| − | + | border-collapse: collapse; | |
| − | + | width: 90% | |
| − | + | margin: auto; | |
| − | + | margin-bottom: 15px; | |
| − | + | margin-top: 15px; | |
| − | + | margin-right: 10px; | |
| − | + | margin-left: 10px; | |
| − | + | } | |
| − | + | /*Change the styling of table cells*/ | |
| − | + | #contentContainer td { | |
| − | + | padding: 10px; | |
| − | + | border: 1px solid #565656; | |
| − | + | border-collapse: collapse; | |
| − | + | vertical-align: text-top; | |
| − | + | } | |
| − | + | /*Change the styling of table headers */ | |
| − | + | #contentContainer th { | |
| − | + | background-color: #E8E8E9; | |
| − | + | padding: 10px; | |
| − | + | border: 1px solid #565656; | |
| − | + | border-collapse: collapse; | |
| − | + | vertical-align: text-top; | |
| − | + | } | |
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | /* | + | /*MENU STYLING */ |
| − | + | /*Styling for the links in the menu */ | |
| − | + | #menuContainer a { | |
| − | + | color: #565656; | |
| − | + | text-decoration:none; | |
| + | font-weight: bold; | ||
} | } | ||
| + | /* Sets the style for lists inside menuContainer */ | ||
| + | #menuContainer ul { | ||
| + | list-style: none; | ||
| + | margin-left:0px; | ||
| + | } | ||
| − | + | /*Styles the list items to become menu buttons */ | |
| − | + | #menuContainer ul li { | |
| − | + | text-align: center; | |
| − | + | display: block; | |
| − | + | width: 100%; | |
| − | + | height:30px; | |
| − | + | padding-top:10px; | |
| − | + | } | |
| − | + | ||
| − | + | ||
| + | /*For the menu buttons, changes the color when hovering*/ | ||
| + | #menuContainer li:hover { | ||
| + | color: #FFF; | ||
| + | background-color: #24B694; | ||
| + | } | ||
| − | + | /*Submenus are not displayed as default*/ | |
| − | + | #menuContainer li ul { | |
| + | display: none; | ||
| + | padding-top:15px; | ||
| + | margin-left: -19px; | ||
| + | } | ||
| + | /*Submenus are displayed when hovering the menu button */ | ||
| + | #menuContainer li:hover ul { | ||
| + | /*display: inline-block; */ | ||
| + | display: block; | ||
| + | position: absolute; | ||
| + | float:right; | ||
| + | margin-left: 134px; | ||
| + | margin-top:-42px; | ||
| + | } | ||
| − | + | /*Style the submenu buttons*/ | |
| − | + | #menuContainer li ul li{ | |
| + | background-color: #59BF92; | ||
| + | padding-left:20px; | ||
| + | padding-right:20px; | ||
| + | height:30px; | ||
| + | padding-top:10px; | ||
| + | margin-top:-2px; | ||
| + | color: #565656; | ||
| + | width: 150px; | ||
| + | } | ||
| + | /*CLASSES */ | ||
| − | + | /*Clear class for all the pages, adds spacing too*/ | |
| − | + | .clear{ | |
| − | + | clear:both; | |
| + | height: 10px; | ||
| + | } | ||
| − | |||
| − | |||
| − | + | /* highlight box for special messages */ | |
| − | + | .highlightBox { | |
| − | + | width:500px; | |
| + | margin:auto; | ||
| + | background-color: #E8E8E9; | ||
| + | margin-bottom: 15px; | ||
| + | margin-top: 15px; | ||
| + | padding: 15px; | ||
| + | padding-top: 5px; | ||
| + | } | ||
| − | |||
| − | + | </style> | |
| − | + | <!-- End of CSS --> | |
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | + | <!-- Start of the template html elements. --> | |
| − | + | <div id ="mainContainer"><!--The closing tag for mainContainer should be placed at the bottom of each content page.--> | |
| − | + | ||
| − | |||
| − | + | <div id="bannerContainer"> | |
| + | <img src="https://static.igem.org/mediawiki/2015/c/cf/Team_Tuebingen_banner.jpg" alt="team_tue_banner" style="width:690px;height:150px;"> | ||
| + | </div> | ||
| − | + | <!-- Start of menu --> | |
| + | <div id="menuContainer"> | ||
| − | + | <!-- This list is your menu, every list item is a menu button and nested listed become submenu buttons --> | |
| + | <ul> | ||
| + | <a href="https://2015.igem.org/Team:Tuebingen"><li>HOME</li></a> | ||
| + | <a href="https://2015.igem.org/Team:Tuebingen/Team"><li>TEAM</li></a> | ||
| − | + | <a href="#"><li>PROJECT | |
| + | <ul> | ||
| + | <a href="https://2015.igem.org/Team:Tuebingen/Description"><li>Description</li></a> | ||
| + | <a href="https://2015.igem.org/Team:Tuebingen/Experiments"><li>Experiments & Protocols</li></a> | ||
| + | <a href="https://2015.igem.org/Team:Tuebingen/Results"><li>Results</li></a> | ||
| + | <a href="https://2015.igem.org/Team:Tuebingen/Design"><li>Design</li></a> | ||
| + | </ul> | ||
| + | </li></a> | ||
| − | + | <a href="#"><li>PARTS | |
| + | <ul> | ||
| + | <a href="https://2015.igem.org/Team:Tuebingen/Parts"><li>Team Parts</li></a> | ||
| + | <a href="https://2015.igem.org/Team:Tuebingen/Basic_Part"><li>Basic Parts</li></a> | ||
| + | <a href="https://2015.igem.org/Team:Tuebingen/Composite_Part"><li>Composite Parts</li></a> | ||
| + | <a href="https://2015.igem.org/Team:Tuebingen/Part_Collection"><li>Part Collection</li></a> | ||
| + | </ul> | ||
| + | </li></a> | ||
| − | + | <a href="https://2015.igem.org/Team:Tuebingen/Notebook"><li>NOTEBOOK</li></a> | |
| + | <a href="https://2015.igem.org/Team:Tuebingen/Attributions"><li>ATTRIBUTIONS</li></a> | ||
| + | <a href="https://2015.igem.org/Team:Tuebingen/Collaborations"><li>COLLABORATIONS</li></a> | ||
| + | <a href="https://2015.igem.org/Team:Tuebingen/Practices"><li>HUMAN PRACTICES</li></a> | ||
| + | <a href="https://2015.igem.org/Team:Tuebingen/Safety"><li>SAFETY</li></a> | ||
| + | <a href="https://2015.igem.org/Team:Tuebingen/Modeling"><li>MODELING</li></a> | ||
| + | <a href="https://2015.igem.org/Team:Tuebingen/Measurement"><li>MEASUREMENT</li></a> | ||
| + | <a href="https://2015.igem.org/Team:Tuebingen/Software"><li>SOFTWARE</li></a> | ||
| + | <a href="https://2015.igem.org/Team:Tuebingen/Entrepreneurship"><li>ENTREPRENEURSHIP</li></a> | ||
| − | + | </ul> | |
| − | + | </div> | |
| − | + | <!-- End of menu --> | |
| − | + | <!-- Start of content --> | |
| − | + | <div id="contentContainer"> <!--The closing tag for contentContainer should be placed at the bottom of each content page.--> | |
</html> | </html> | ||
Revision as of 07:27, 18 August 2015
