Difference between revisions of "Team:Duke/NewTemplate"
(23 intermediate revisions by 2 users not shown) | |||
Line 1: | Line 1: | ||
− | |||
− | |||
<!-- Declare that you are going to use html code instead of wiki code --> | <!-- Declare that you are going to use html code instead of wiki code --> | ||
<html> | <html> | ||
Line 6: | Line 4: | ||
<!-- Start of CSS--> | <!-- Start of CSS--> | ||
<style type="text/css"> | <style type="text/css"> | ||
+ | |||
+ | /* WIKI SETTINGS*/ | ||
+ | |||
+ | /* Hide first heading */ | ||
+ | .firstHeading { | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | /*-- Remove borders, float content left and remove padding/margin */ | ||
+ | #globalWrapper, #content{ | ||
+ | width:100%; | ||
+ | background-color: transparent; | ||
+ | border: 0px; | ||
+ | float: left; | ||
+ | margin:0px; | ||
+ | padding: 0px; | ||
+ | } | ||
+ | |||
+ | /*left align Black Menu Bar */ | ||
+ | #top_menu_inside { | ||
+ | margin-left: 20px; | ||
+ | } | ||
+ | |||
/* PAGE LAYOUT */ | /* PAGE LAYOUT */ | ||
Line 16: | Line 37: | ||
/* Creates a container that will wrap all of the content inside your wiki pages. */ | /* Creates a container that will wrap all of the content inside your wiki pages. */ | ||
#mainContainer { | #mainContainer { | ||
− | width: | + | width: 100%; |
+ | height: 100% | ||
overflow:hidden; | overflow:hidden; | ||
float:left; | float:left; | ||
− | margin | + | margin: 0px; |
− | margin- | + | margin-top: -7px; |
− | background-color: | + | background-color: transparent; |
− | + | ||
border-right: 2px solid #565656; | border-right: 2px solid #565656; | ||
border-left: 2px solid #565656; | border-left: 2px solid #565656; | ||
− | |||
font-family: "Trebuchet MS", Helvetica, sans-serif; | font-family: "Trebuchet MS", Helvetica, sans-serif; | ||
} | } | ||
Line 31: | Line 51: | ||
/* Creates the container for the menu */ | /* Creates the container for the menu */ | ||
#menuContainer { | #menuContainer { | ||
− | float: | + | float:top; |
− | width: | + | position: fixed; |
+ | z-index:100; | ||
+ | width: 100%; | ||
+ | height: 35px; | ||
padding: 20px 0px; | padding: 20px 0px; | ||
− | border-top: | + | border-top: 6px solid #565656; |
+ | border-bottom: 6px solid #565656; | ||
background-color: #235F9C; | background-color: #235F9C; | ||
} | } | ||
Line 42: | Line 66: | ||
padding-top:20px; | padding-top:20px; | ||
padding-right:10px; | padding-right:10px; | ||
− | margin-bottom: | + | margin-bottom: 0px; |
− | width: | + | width: 100%; |
padding-left: 20px; | padding-left: 20px; | ||
+ | padding-right: 20px; | ||
float: left; | float: left; | ||
background-color: #fff; | background-color: #fff; | ||
− | border-top: | + | border-top: 6px solid #565656; |
font-family: "Trebuchet MS", Helvetica, sans-serif; | font-family: "Trebuchet MS", Helvetica, sans-serif; | ||
} | } | ||
− | /* | + | /*Spacer for menu*/ |
− | # | + | #menuSpacer{ |
− | height: | + | height:85px; |
+ | width: 100%; | ||
margin:auto; | margin:auto; | ||
− | |||
− | |||
} | } | ||
+ | |||
/*VISUAL STYLE (TABLES, FONTS, LINKS, IMAGES, UL) */ | /*VISUAL STYLE (TABLES, FONTS, LINKS, IMAGES, UL) */ | ||
Line 79: | Line 104: | ||
#contentContainer a { | #contentContainer a { | ||
font-weight: bold; | font-weight: bold; | ||
− | color: # | + | color: #000000; |
} | } | ||
Line 125: | Line 150: | ||
text-decoration:none; | text-decoration:none; | ||
font-weight: bold; | font-weight: bold; | ||
+ | font-size: 1em; | ||
} | } | ||
Line 130: | Line 156: | ||
#menuContainer ul { | #menuContainer ul { | ||
list-style: none; | list-style: none; | ||
− | margin- | + | margin-top:10px; |
} | } | ||
Line 137: | Line 163: | ||
text-align: center; | text-align: center; | ||
display: block; | display: block; | ||
− | width: | + | width: 10%; |
− | height:30px; | + | height:40px; |
− | padding-top: | + | margin-top:-30px; |
+ | padding-top: 25px; | ||
} | } | ||
Line 151: | Line 178: | ||
#menuContainer li ul { | #menuContainer li ul { | ||
display: none; | display: none; | ||
− | padding-top: | + | padding-top:0px; |
− | margin-left: | + | margin-left: 0px; |
} | } | ||
Line 160: | Line 187: | ||
display: block; | display: block; | ||
position: absolute; | position: absolute; | ||
− | float: | + | float:none; |
− | margin-left: | + | margin-left: -5px; |
− | margin-top: | + | margin-top:25px; |
} | } | ||
Line 172: | Line 199: | ||
height:30px; | height:30px; | ||
padding-top:10px; | padding-top:10px; | ||
− | margin-top:- | + | padding-bottom:10px; |
+ | margin-top:-3px; | ||
color: #565656; | color: #565656; | ||
− | width: | + | width: 85px; |
} | } | ||
+ | ul {list-style: none;padding: 5px;margin: 10px;} | ||
+ | ul li {display: block;position: relative;float: left;} | ||
/*CLASSES */ | /*CLASSES */ | ||
Line 206: | Line 236: | ||
color:#001A57; | color:#001A57; | ||
} | } | ||
− | |||
.subhead{ | .subhead{ | ||
− | + | background-color:#6AB3E1; | |
− | font-size: | + | border: 2px solid #001A57; |
+ | border-radius:5px; | ||
+ | font-size:18px; | ||
padding:5px; | padding:5px; | ||
color:#001A57; | color:#001A57; | ||
} | } | ||
+ | |||
+ | #test{ | ||
+ | border-radius:100%; | ||
+ | width:100px; | ||
+ | height:100px; | ||
+ | transition: background 0.5s ease; | ||
+ | background-color: red; | ||
+ | } | ||
+ | #test:hover{ | ||
+ | background-color: blue; | ||
+ | } | ||
+ | |||
+ | #cf { | ||
+ | position:relative; | ||
+ | height:100px; | ||
+ | width:100px; | ||
+ | margin:0 auto; | ||
+ | } | ||
+ | |||
+ | #cf img { | ||
+ | position:absolute; | ||
+ | float: right; | ||
+ | margin-top: -30px; | ||
+ | border-radius:1%; | ||
+ | width:125px; | ||
+ | max-height:75%; | ||
+ | margin-left:-63px; | ||
+ | -webkit-transition: opacity 0.5s ease-in-out; | ||
+ | -moz-transition: opacity 0.5s ease-in-out; | ||
+ | -o-transition: opacity 0.5s ease-in-out; | ||
+ | transition: opacity 0.5s ease-in-out; | ||
+ | } | ||
+ | |||
+ | |||
+ | #cf img.top:hover { | ||
+ | opacity:0; | ||
+ | } | ||
+ | |||
+ | .grow img{ | ||
+ | transition: 1s ease; | ||
+ | } | ||
+ | |||
+ | .grow img:hover{ | ||
+ | -webkit-transform: scale(1.5); | ||
+ | -ms-transform: scale(1.5); | ||
+ | transform: scale(1.5); | ||
+ | transition: 1s ease; | ||
+ | } | ||
+ | |||
+ | img.resize{ | ||
+ | width:100%; | ||
+ | max-height: 20%; | ||
+ | } | ||
+ | |||
<!-- End Header--> | <!-- End Header--> | ||
Line 221: | Line 306: | ||
<!-- Start of the template html elements. --> | <!-- 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 ="mainContainer"><!--The closing tag for mainContainer should be placed at the bottom of each content page.--> | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
<!-- Start of menu --> | <!-- Start of menu --> | ||
Line 236: | Line 312: | ||
<!-- This list is your menu, every list item is a menu button and nested listed become submenu buttons --> | <!-- This list is your menu, every list item is a menu button and nested listed become submenu buttons --> | ||
<ul> | <ul> | ||
− | <a href="https://2015.igem.org/Team: | + | <a href="https://2015.igem.org/Team:Duke"><li>HOME</li></a> |
− | <a href="https://2015.igem.org/Team: | + | <a href="https://2015.igem.org/Team:Duke/Team"><li>TEAM</li></a> |
+ | <!--<li><div id="cf"> | ||
+ | <img class="bottom" src="https://static.igem.org/mediawiki/2015/c/c5/Duke-team-test-hover4.png" /> | ||
+ | <a href="https://2015.igem.org/Team:Duke/Team"><img class="top" src="https://static.igem.org/mediawiki/2015/1/1f/Duke-team-test-hover3.png" /></a> | ||
+ | </div></li>--> | ||
<a href="#"><li>PROJECT | <a href="#"><li>PROJECT | ||
<ul> | <ul> | ||
− | <a href="https://2015.igem.org/Team: | + | <a href="https://2015.igem.org/Team:Duke/Description"><li>Description</li></a> |
− | <a href="https://2015.igem.org/Team: | + | <a href="https://2015.igem.org/Team:Duke/Experiments"><li>Experiments & Protocols</li></a> |
− | <a href="https://2015.igem.org/Team: | + | <a href="https://2015.igem.org/Team:Duke/Results"><li>Results</li></a> |
− | <a href="https://2015.igem.org/Team: | + | <a href="https://2015.igem.org/Team:Duke/Design"><li>Design</li></a> |
+ | <a href="https://2015.igem.org/Team:Duke/Notebook"><li>Notebook</li></a> | ||
+ | |||
</ul> | </ul> | ||
</li></a> | </li></a> | ||
Line 251: | Line 333: | ||
<a href="#"><li>PARTS | <a href="#"><li>PARTS | ||
<ul> | <ul> | ||
− | <a href="https://2015.igem.org/Team: | + | <a href="https://2015.igem.org/Team:Duke/Parts"><li>Team Parts</li></a> |
− | <a href="https://2015.igem.org/Team: | + | <a href="https://2015.igem.org/Team:Duke/Basic_Part"><li>Basic Parts</li></a> |
− | <a href="https://2015.igem.org/Team: | + | <a href="https://2015.igem.org/Team:Duke/Composite_Part"><li>Composite Parts</li></a> |
− | <a href="https://2015.igem.org/Team: | + | <a href="https://2015.igem.org/Team:Duke/Part_Collection"><li>Part Collection</li></a> |
</ul> | </ul> | ||
</li></a> | </li></a> | ||
− | |||
− | |||
− | <a href="https://2015.igem.org/Team: | + | <a href="https://2015.igem.org/Team:Duke/Attributions"><li>ATTRIBUTIONS</li></a> |
− | <a href="https://2015.igem.org/Team: | + | <a href="https://2015.igem.org/Team:Duke/Collaborations"><li>COLLABORATIONS</li></a> |
− | <a href="https://2015.igem.org/Team: | + | <a href="https://2015.igem.org/Team:Duke/Practices"><li>HUMAN PRACTICES</li></a> |
− | <a href="https://2015.igem.org/Team: | + | <a href="https://2015.igem.org/Team:Duke/Safety"><li>SAFETY</li></a> |
− | <a href="https://2015.igem.org/Team: | + | <a href="https://2015.igem.org/Team:Duke/Modeling"><li>MODELING</li></a> |
− | <a href="https://2015.igem.org/Team: | + | <a href="#"><li>MEASUREMENT |
+ | <ul> | ||
+ | <a href="https://2015.igem.org/Team:Duke/Measurement"><li>Measurement</li></a> | ||
+ | <a href="https://2015.igem.org/Team:Duke/Interlabstudy"><li>Interlab Study</li></a> | ||
+ | </ul> | ||
+ | </li></a> | ||
− | <a href="https://2015.igem.org/Team: | + | <!--<a href="https://2015.igem.org/Team:Duke/Software"><li>SOFTWARE</li></a> |
− | <a href="https://2015.igem.org/Team: | + | <a href="https://2015.igem.org/Team:Duke/Entrepreneurship"><li>ENTREPRENEURSHIP</li></a>--> |
</ul> | </ul> | ||
</div> | </div> | ||
<!-- End of menu --> | <!-- End of menu --> | ||
+ | |||
+ | <div id="menuSpacer"> | ||
+ | </div> | ||
+ | |||
+ | <div id="globalWrapper"> | ||
+ | <img class="resize" src="https://static.igem.org/mediawiki/2009/6/64/Header_revised.jpg"> | ||
+ | <!--<br><br> | ||
+ | <h2> Add a banner to your wiki! </h2> | ||
+ | |||
+ | <p>You can make the image 980px by 200px</p> | ||
+ | <p> Remember to call the file: "<i>Team_Duke_banner.jpg</i>" </p>--> | ||
+ | </div> | ||
<!-- Start of content --> | <!-- Start of content --> | ||
<div id="contentContainer"> <!--The closing tag for contentContainer should be placed at the bottom of each content page.--> | <div id="contentContainer"> <!--The closing tag for contentContainer should be placed at the bottom of each content page.--> | ||
+ | |||
+ | <div> | ||
+ | <a href="https://2015.igem.org/Team:Duke"><img src="http://qph.is.quoracdn.net/main-qimg-826a2483ab9104e55abf64f8ddaf2251?convert_to_webp=true"/></a> | ||
+ | </div> | ||
+ | |||
+ | <!--<div id="cf"> | ||
+ | <img class="bottom" src="https://static.igem.org/mediawiki/2015/6/6e/Duke-team-hover-test1.jpg" /> | ||
+ | <a href="http://youtube.com"><img class="top" src="https://static.igem.org/mediawiki/2015/d/de/Duke-team-hover-test2.jpg" /></a> | ||
+ | </div>--> | ||
+ | |||
+ | <div class="grow"> | ||
+ | <a href="http://www.gmail.com"><img src="http://siberianhuskycentral.com/wp-content/uploads/2011/06/Alaskan-Husky-Puppies-2471.jpg"/></a> | ||
+ | </div> | ||
+ | |||
</html> | </html> |
Latest revision as of 17:07, 19 June 2015