Team:UCL Academy

From 2014hs.igem.org

(Difference between revisions)
Line 1: Line 1:
-
{{< YOUR TEMPLATE GOES HERE >}}
 
{{:Team:UCL_Academy/Templates/Navigationbar}}
{{:Team:UCL_Academy/Templates/Navigationbar}}
-
 
+
{{CSS/Main}}
<html>
<html>
-
<head>
+
<style>
-
<style type="text/css">
+
#contentSub, #footer-box, #catlinks, #search-controls, #p-logo, .printfooter, .firstHeading,.visualClear {display: none;} /*-- hides default wiki settings --*/
 +
</style>
-
#contentSub, #footer-box, #catlinks, #search-controls, #p-logo, .printfooter, .visualClear {display: none;} /*-- hides default wiki settings --*/
+
<!-- here ends the section that changes the default wiki template to a white full width background -->
-
.firstHeading {
 
-
width: 975px;
 
-
margin: 0px auto;
 
-
padding-top: 100px;
 
-
margin-bottom: 20px;
 
-
font-family: Georgia, Times, "Times New Roman", serif;
 
-
}
 
-
h1, h2, h3, h4, h5 { font-family: Georgia, Times, "Times New Roman", serif;}
+
<!-- beginning of your page -->
-
#top-section { /*-- styling for default menu bar (edit, page, history, etc.) --*/
+
<!-- menu -->
-
background-color: #383838;
+
<table id="menu" width="100%"  cellspacing="0" height="135px">
-
border: 0 none;
+
<tr>
-
height: 14px;
+
<td  bgColor="#FFFFFF"></td>
-
z-index: 100;
+
<td valign="bottom"  width="975px" align="center" bgColor="#FFFFFF">
-
top: 0;
+
-
position: fixed;
+
-
width: 975px;
+
-
left: 50%;
+
-
margin-left: -487px;
+
-
}
+
-
#top-section-bar { /*-- styling full width bar which hides behind default menu bar (edit, page, history, etc.) --*/
+
<table align="center">
-
background-color: #383838;
+
<tr height="50px">
-
height: 14px;
+
<td width="162px" align="center" onMouseOver="this.bgColor='#FEE5AD'" onMouseOut="this.bgColor='#A1DBB2'" bgColor=#A1DBB2>
-
display: block;
+
<a href="https://2014.igem.org/WikitemplateB_home"style="text-decoration:none;color:#1C140D">HOME </a> </td>
-
z-index: 10;
+
-
position: fixed;
+
-
width: 100%;
+
-
top: 0;
+
-
}
+
-
#menubar a:link, #menubar a:active, #menubar a:visited, #menubar a:hover, #menubar:hover { /*-- styling for default menu bar links (edit, page, history, etc.) --*/
+
<td width="162px" align="center" onMouseOver="this.bgColor='#FEE5AD'" onMouseOut="this.bgColor='#A1DBB2'" bgColor=#A1DBB2>
-
color: #727272;
+
<a href="https://2014.igem.org/WikitemplateB_project" style="text-decoration:none;color:#1C140D">PROJECT</a> </td>
-
text-decoration: none;  
+
-
background-color: transparent;
+
-
}
+
-
body {
+
<td width="162px" align="center" onMouseOver="this.bgColor='#FEE5AD'" onMouseOut="this.bgColor='#A1DBB2'" bgColor=#A1DBB2>
-
background-color: #fff;
+
<a href="" style="text-decoration:none;color:#1C140D">PARTS</a></td>
-
}
+
-
#globalWrapper, #content { /*-- changes default wiki settings --*/
+
<td width="162px" align="center" onMouseOver="this.bgColor='#FEE5AD'" onMouseOut="this.bgColor='#A1DBB2'" bgColor=#A1DBB2>
-
width: 100%;  
+
<a href="" style="text-decoration:none;color:#1C140D">TEAM </a> </td>
-
height: 100%;
+
-
border: 0px;
+
-
background-color: transparent;
+
-
margin: 0px;
+
-
padding: 0px;
+
-
}
+
-
html, body, .wrapper { /*-- changes default wiki settings --*/
+
<td width="162px" align="center" onMouseOver="this.bgColor='#FEE5AD'" onMouseOut="this.bgColor='#A1DBB2'" bgColor=#A1DBB2> 
-
width: 100%;  
+
<a href="" style="text-decoration:none;color:#1C140D">NOTEBOOK </a> </td>
-
height: 100%;
+
-
background-color: transparent;
+
-
}
+
-
#contentcontainer { /*-- creates container for all content on page --*/
+
<td width="162px" align="center" onMouseOver="this.bgColor='#FEE5AD'" onMouseOut="this.bgColor='#A1DBB2'" bgColor=#A1DBB2> 
-
font-family: Arial, Helvetica, sans-serif;
+
<a href="" style="text-decoration:none;color:#1C140D">SAFETY </a></td>
-
font-weight: normal;
+
</tr>
-
font-size: 14px;
+
-
color: #414141;
+
-
width: 960px;
+
-
margin-left: auto;  
+
-
margin-right: auto;
+
-
background-color: #transparent;
+
-
margin-top: 0px;
+
-
}
+
-
.sidemenu, .sidemenu li {
+
<tr> <td colspan="5"></td>
-
list-style-type: none;
+
<td align="center" width="162px"><a href="https://igem.org/Main_Page"> <img src="https://static.igem.org/mediawiki/igem.org/6/60/Igemlogo_300px.png" width="55px"></a></td>
-
list-style-image: none;
+
<td align="center" width="162px"><img src="https://static.igem.org/mediawiki/2014/0/06/EPFL_logo.jpg" width="55px"></td>
-
font-family: verdana;
+
</tr>
-
text-decoration: none;
+
</table>
-
color:#000;
+
-
font-size: 14px;
+
-
}
+
-
.sidemenu li {display: block;}
+
</td>
 +
<td  bgColor="#FFFFFF"></td>
 +
</tr>
 +
</table>
 +
<!-- end of menu -->
-
.sidemenu a {
 
-
text-decoration:none;
 
-
color: #000;
 
-
display: block;
 
-
width: 180px;
 
-
height: 100%;
 
-
padding: 3px 5px;
 
-
transition: .25s ease-in-out;
 
-
-moz-transition: .25s ease-in-out;
 
-
-webkit-transition: .25s ease-in-out;
 
-
}
 
-
.sidemenu a.greyout { color: #909090; }
+
<!-- First block of content -->
 +
<table  id="firstblock" width="100%"  cellspacing="0" height="500px">
 +
<tr>
 +
<td  bgColor="#FFFFFF"></td>
 +
<td width="975px" align="center" bgColor="#FFFFFF" >
-
.sidemenu a:hover {
+
<!-- You can replace this image with your team's logo! -->
-
color:#666;
+
<img src="https://static.igem.org/mediawiki/2014/0/06/BioPad.png" width="500px">
-
background-color: #d9f5aa;
+
<h3>Welcome!  <br> We are Team EPFL! </h3>
-
}
+
<p>Scroll down to find more about our project! </p>
-
.sub-sidemenu {font-size: 10px; margin-bottom: 20px; color: #666; display: none;}
+
</td>
-
.sub-sidemenu a {color: #666;}
+
<td bgColor="#FFFFFF"></td>
 +
</tr>
 +
</table>
 +
<!-- end of first block -->
-
div.underconst
 
-
{
 
-
padding:10px;
 
-
border-radius:5px;
 
-
background-color:pink;
 
-
text-align:center;
 
-
}
 
-
a.anchor{display: block; position: relative; top: -80px; visibility: hidden;}
 
-
.contentpara {margin-bottom: 30px;}
+
<!--  Block of content 1 -->
 +
<table width="100%"  cellspacing="0" height="500px">
 +
<tr><td  bgColor="#FEE5AD"></td>
 +
<td width="975px" align="center" bgColor="#FEE5AD" >
 +
<table  width="975px"  cellspacing="0" height="500px">
 +
<tr>
-
span.email{font-family: monospace; font-weight: normal;}
+
<td width="95%" bgColor="#FEE5AD"  rowspan="3" align="center">
-
fieldset {border: 1px solid #337f53;}
+
<!-- Content goes here -->
 +
<img src="https://static.igem.org/mediawiki/2014/0/0a/DwikitemplateB_dnastrand.png">
 +
<h3>What is your project about?</h3>
 +
<p>Here you can explain your project in a short sentence or paragraph!</p>
 +
<p>For example: Our team designed a biosensor to detect a certain chemical in water</p>
 +
</td> 
-
.greyout {color: #A0A0A0;}
 
-
.highlightme {background-color: #FFFF00;}
 
-
#alertContainer {border: 2px solid red; margin-bottom: 10px; width: 936px;}
+
<!-- This is the back to top button -->
-
#annContainer {margin-left: 8px;}
+
<td bgColor=#FEE5AD> </td>
-
#newsContainer {border: 1px solid #ccc;}
+
<tr><td bgColor=#FEE5AD></td></tr>
 +
<tr> <td  height="20px" width="5%" align="center" onMouseOver="this.bgColor='#FFFFFF'" onMouseOut="this.bgColor='#A1DBB2'" bgColor=#A1DBB2>
 +
<a href="#firstblock" style="text-decoration:none;color:#1C140D"> Top </a> </td></tr>
 +
</table>
-
.newsTitle {
 
-
display: block;
 
-
color: #414141;
 
-
font-size: 25px; 
 
-
        font-family: Georgia, Times, "Times New Roman", serif;
 
-
padding: 10px 15px 5px 10px;
 
-
border-bottom: 1px solid #ccc;
 
-
margin-bottom: 0px;
 
-
}
 
-
.newsItem {
+
</td>
-
border-bottom: 1px solid #ccc;
+
<td bgColor="#FEE5AD"></td>
-
display: block;
+
</tr>
-
padding: 5px 15px 0px 10px;
+
</table>
-
margin-bottom: 0px;
+
<!-- end of Block-->
-
}
+
-
.newsItem h3 {
 
-
width: auto;
 
-
display: inline;
 
-
font-size: 14px;
 
-
font-family: Arial, Helvetica, sans-serif;
 
-
padding: 0px;
 
-
margin: 0px;
 
-
}
 
-
.newsItem img {
 
-
float: right;
 
-
clear: right;
 
-
width: 80px;
 
-
padding-left: 15px;
 
-
display: inline-block;
 
-
}
 
-
.newsItem .newsDate {
+
<!-- Block of content 2 -->
-
font-style: italic;
+
<table width="100%"  cellspacing="0" height="500px">
-
font-size: 14px;
+
<tr>
-
display: inline-block;
+
<td  bgColor="#FACA66"></td>
-
color: #999;
+
<td width="975px" align="center" bgColor="#FACA66" >
-
float: right;
+
-
padding: 0px 0px 10px 15px;
+
-
}
+
-
.newsItem p, .newsItem ul, .newsItem li {
+
<table  width="975px"  cellspacing="0" height="500px">
-
padding: 0px;
+
<tr>
-
margin-left: 20px;
+
<td width="95%" bgColor="#FACA66"  rowspan="3" align="center">
-
font-size: 12px;
+
-
line-height: 1.2;
+
-
}
+
-
.newsItem p {margin-top: 10px;}
+
<!-- Content goes here -->
 +
<img src="https://static.igem.org/mediawiki/2014/b/b5/Dnastrand3.png">
 +
<h3> How does your project work?</h3>
 +
<p> Here you can explain briefly how your project works. And add a link to your project page.</p>
-
.annItem {
+
</td> 
-
border: 2px solid #49b677;
+
-
display: block;
+
-
padding: 0px 15px 10px 10px;
+
-
margin-bottom: 18px;
+
-
position: relative;
+
-
height: 160px;
+
-
vertical-align: middle;
+
-
}
+
-
.annItem .annCentered {
 
-
display: table-cell;
 
-
vertical-align: middle;
 
-
height: 160px;
 
-
}
 
-
.annCentered h3 {
+
<!-- This is the back to top section -->
-
padding: 0px;
+
<td bgColor=#FACA66> </td>
-
display: block;
+
<tr><td bgColor=#FACA66></td></tr>
-
margin-left: auto;
+
<tr> <td  height="20px" width="5%" align="center" onMouseOver="this.bgColor='#FFFFFF'" onMouseOut="this.bgColor='#A1DBB2'" bgColor=#A1DBB2>
-
margin-right: auto;  
+
<a href="#firstblock" style="text-decoration:none;color:#1C140D"> Top </a> </td></tr>
-
text-align: center;
+
</table>
-
}
+
-
.annItem ul, .annItem li {padding: 0px; margin: 0px;}
+
</td>
-
.annItem li {list-style: none; margin: 5px}
+
<td bgColor="#FACA66"></td>
 +
</tr>
 +
</table>
 +
<!-- end of Block-->
-
</style>
+
<!--  Block of content 3 -->
-
</style>
+
<table width="100%"  cellspacing="0" height="500px">
 +
<tr>
 +
<td  bgColor="#F7A541"></td>
 +
<td width="975px" align="center" bgColor="#F7A541" >
 +
 
 +
<table  width="975px"  cellspacing="0" height="500px">
 +
<tr>
 +
<td width="95%" bgColor="#F7A541"  rowspan="3" align="center">
 +
 
 +
<!-- Content goes here -->
 +
 
 +
<img src="https://static.igem.org/mediawiki/2014/7/7d/Gears.png">
 +
<h3> Who will your project help?</h3>
 +
<p> Tell your audience how your project will help the environment, science, medicine or everything else.</p>
 +
</td> 
 +
 
 +
 
 +
<!-- This is the back to top section -->
 +
<td bgColor=#F7A541> </td>
 +
<tr><td bgColor=#F7A541></td></tr>
 +
<tr> <td  height="20px" width="5%" align="center" onMouseOver="this.bgColor='#FFFFFF'" onMouseOut="this.bgColor='#A1DBB2'" bgColor=#A1DBB2>
 +
<a href="#firstblock" style="text-decoration:none;color:#1C140D"> Top </a> </td></tr>
 +
 
 +
</table>
 +
 
 +
 
 +
</td>
 +
<td bgColor="#F7A541"></td>
 +
</tr>
 +
</table>
 +
<!-- end of Block-->
 +
 
 +
 
 +
<!--  Block of content 4 -->
 +
<table width="100%"  cellspacing="0" height="500px">
 +
<tr>
 +
<td  bgColor="#F45D4C"></td>
 +
<td width="975px" align="center" bgColor="#F45D4C" >
 +
 
 +
<table  width="975px"  cellspacing="0" height="500px">
 +
<tr>
 +
<td width="95%" bgColor="#F45D4C"  rowspan="3" align="center">
 +
<!-- Content goes here -->
 +
 
 +
<img src="https://static.igem.org/mediawiki/2014/c/ce/Dnastrand2.png">
 +
<h3>Why did you choose this project?</h3>
 +
<p> What motivated you to work on this project? Tell us what inspires you.</p>
 +
 
 +
</td> 
 +
 
 +
 
 +
<!-- This is the back to top section -->
 +
<td bgColor=#F45D4C> </td>
 +
<tr><td bgColor=#F45D4C ></td></tr>
 +
<tr> <td  height="20px" width="5%" align="center" onMouseOver="this.bgColor='#FFFFFF'" onMouseOut="this.bgColor='#A1DBB2'" bgColor=#A1DBB2>
 +
<a href="#firstblock" style="text-decoration:none;color:#1C140D"> Top </a> </td></tr>
 +
 
 +
</table>
 +
</td>
 +
<td bgColor="#F45D4C"></td>
 +
</tr>
 +
</table>
 +
<!-- end of Block-->
 +
 
 +
 
 +
 
 +
<!-- Final block of content -->
 +
<table  id="firstblock" width="100%"  cellspacing="0" height="200px">
 +
<tr>
 +
<td  bgColor="#FFFFFF"></td>
 +
<td width="975px" align="center" bgColor="#FFFFFF" >
 +
<p>Here you can place the logos of your sponsors or other links!</p>
 +
</td>
 +
<td bgColor="#FFFFFF"></td>
 +
</tr>
 +
</table>
 +
<!-- end of final block -->
</html>
</html>

Revision as of 10:19, 13 June 2014

Team:UCL Academy/Templates/Navigationbar Template:CSS/Main

Welcome!
We are Team EPFL!

Scroll down to find more about our project!

What is your project about?

Here you can explain your project in a short sentence or paragraph!

For example: Our team designed a biosensor to detect a certain chemical in water

Top

How does your project work?

Here you can explain briefly how your project works. And add a link to your project page.

Top

Who will your project help?

Tell your audience how your project will help the environment, science, medicine or everything else.

Top

Why did you choose this project?

What motivated you to work on this project? Tell us what inspires you.

Top

Here you can place the logos of your sponsors or other links!