Team:St Pauls London

From 2013hs.igem.org

(Difference between revisions)
Line 1: Line 1:
-
<!-- *** What falls between these lines is the Alert Box!  You can remove it from your pages once you have read and understood the alert *** -->
 
-
 
<html>
<html>
-
<div id="box" style="width: 700px; margin-left: 137px; padding: 5px; border: 3px solid #fe2b33; /*background-color: #fe2b33;*/">
 
-
<div id="template" style="text-align: center; font-weight: bold; font-size: large; /*color: #f6f6f6*/; padding: 5px;">
 
-
This is a template page. READ THESE INSTRUCTIONS.
 
-
</div>
 
-
<div id="instructions" style="text-align: center; font-weight: normal; font-size: small; /*color: #f6f6f6*/; padding: 5px;">
 
-
You are provided with this team page template with which to start the iGEM season.  You may choose to personalize it to fit your team but keep the same "look." Or you may choose to take your team wiki to a different level and design your own wiki.  You can find some examples <a href="https://2009.igem.org/Help:Template/Examples">HERE</a>.
 
-
</div>
 
-
<div id="warning" style="/*text-align: center;*/ font-weight: bold; font-size: small; /*color: #f6f6f6*/; padding: 5px;">
 
-
You <strong>MUST</strong> have the following information on your wiki:
 
-
<ul style="font-weight:normal;">
 
-
<li>a team description</li>
 
-
<li>project description</li>
 
-
<li>safety information (did your team take a safety training course? were you supervised in the lab?)</li>
 
-
<li>team attribution (who did what part of your project?)</li>
 
-
</ul>
 
-
You may also wish to add other page such as:
 
-
<ul style="font-weight:normal;">
 
-
<li>lab notebook</li>
 
-
<li>sponsor information</li>
 
-
<li>other information</li>
 
-
</ul>
 
-
REMEMBER, keep all of your pages within your teams namespace. <br><span style="font-weight:normal; font-style:italic;">Example: 2013hs.igem.org/Team:St_Pauls_London/Our_Pets</span>
 
-
</div>
 
-
</div>
 
-
</html>
 
-
<!-- *********************** End of the alert box *********************** -->
+
<head>
 +
    <style>
 +
body {
 +
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
 +
background-color: white;
 +
margin: 0 auto;
 +
padding-top:20px;
 +
font-size: 16px;
 +
}
 +
 +
#internet-explorer {
 +
margin-top: 0px;
 +
text-align: center;
 +
color: #C30;
 +
font-family: monospace;
 +
font-weight: bold;
 +
}
 +
 +
/*----- HEADER -----*/
 +
#header {
 +
width: 900px;
 +
height: 200px;
 +
position: absolute;
 +
left: 50%;
 +
margin-left: -450px;
 +
background-color: ;
 +
padding-bottom: 20px;
 +
}
 +
 +
#headerTitle {
 +
text-align: right;
 +
left: 80%;
 +
margin-right: 120px;
 +
font-weight: bold;
 +
font-size: 36px;
 +
}
 +
 +
#headerBackground {
 +
position: absolute;
 +
z-index: -1;
 +
width: 100%;
 +
height: 100px;
 +
bottom: 0px;
 +
}
 +
#logo {
 +
position: absolute;
 +
left: 20%;
 +
align: left;
 +
width: 120px;
 +
height: 120px;
 +
}
 +
 +
#headerSubTitle {
 +
text-align: right;
 +
left: 80%;
 +
margin-right: 180px;
 +
font-size: 14px;
 +
letter-spacing: 2px;
 +
color: #666;
 +
}
 +
 +
a#igem, a#igem:visited {
 +
color: inherit;
 +
text-decoration: none;
 +
}
 +
 +
a#igem:hover, a#igem:active {
 +
color: #F93;
 +
text-decoration: underline;
 +
}
-
{|align="justify"
+
/*----- HEADER BUTTONS -----*/
-
|You can write a background of your team here. Give us a background of your team, the members, etc. Or tell us more about something of your choosing.
+
.nav_button {
-
|[[Image:St_Pauls_London_logo.png|200px|right|frame]]
+
width: 100px;
-
|-
+
height: 50px;
-
|
+
position: absolute;
-
''Tell us more about your project. Give us background. Use this as the abstract of your project.  Be descriptive but concise (1-2 paragraphs)''
+
bottom: 20%;
-
|[[Image:St_Pauls_London_team.png|right|frame|Your team picture]]
+
margin-left: -50px;
-
|-
+
display: table;
-
|
+
}
-
|align="center"|[[Team:St_Pauls_London | Team St_Pauls_London]]
+
-
|}
+
.nav_buttonText {
 +
color: #222;
 +
text-align: center;
 +
vertical-align: middle;
 +
display: table-cell;
 +
}
 +
 +
a.nav_buttonLink, a.nav_buttonLink:visited {
 +
text-decoration: none;
 +
}
 +
a.nav_buttonLink:hover, a.nav_buttonLink:active {
 +
color: #F93;
 +
text-decoration: underline;
 +
}
-
<!--- Team Information Link --->
+
#first {
 +
left: 20%;
 +
}
 +
 +
#second {
 +
left: 40%;
 +
}
 +
 +
#third {
 +
left: 60%;
 +
}
 +
 +
#fourth {
 +
left: 80%;
 +
}
 +
/*----- END OF BUTTONS -----*/
 +
 +
/*----- END OF HEADER -----*/
-
{| style="color:#1b2c8a;background-color:#0c6;" cellpadding="3" cellspacing="1" border="1" bordercolor="#fff" width="62%" align="center"
+
/*----- MAIN CONTENT -----*/
-
!align="center"|[https://igem.org/Team.cgi?year=2013&division=high_school&team_name=St_Pauls_London Official Team Profile]
+
#wrapper {
-
|}
+
clear: both;
 +
position: absolute;
 +
width: 900px;
 +
height: 90%;
 +
margin-top: 250px; /* stops overlap with header */
 +
left: 50%;
 +
margin-left: -450px;
 +
border: medium 2px black;
 +
background-color: ;
 +
}
 +
 +
.title-link {
 +
text-decoration: none;
 +
color: inherit;
 +
}
 +
 +
#first-panel {
 +
display: ;
 +
background: white;
 +
border:1px solid white;
 +
padding-left: 15px;
 +
-moz-border-radius-topright: 20px;
 +
-webkit-border-top-right-radius: 20px;
 +
-moz-border-radius-bottomright: 20px;
 +
-webkit-border-bottom-right-radius: 20px;
 +
width: 100%;
 +
height: auto;
 +
}
 +
 +
#second-panel {
 +
display: none;
 +
background: white;
 +
border:1px solid white;
 +
padding-left: 15px;
 +
-moz-border-radius-topright: 20px;
 +
-webkit-border-top-right-radius: 20px;
 +
-moz-border-radius-bottomright: 20px;
 +
-webkit-border-bottom-right-radius: 20px;
 +
width: 100%;
 +
height: auto;
 +
}
 +
 +
#third-panel {
 +
display: none;
 +
background: white;
 +
border:1px solid white;
 +
padding-left: 15px;
 +
-moz-border-radius-topright: 20px;
 +
-webkit-border-top-right-radius: 20px;
 +
-moz-border-radius-bottomright: 20px;
 +
-webkit-border-bottom-right-radius: 20px;
 +
width: 100%;
 +
height: auto;
 +
}
 +
 +
#fourth-panel {
 +
display: none;
 +
background: white;
 +
border:1px solid white;
 +
padding-left: 15px;
 +
-moz-border-radius-topright: 20px;
 +
-webkit-border-top-right-radius: 20px;
 +
-moz-border-radius-bottomright: 20px;
 +
-webkit-border-bottom-right-radius: 20px;
 +
width: 100%;
 +
height: auto;
 +
}
 +
 +
/*----- FIRST CONTENT -----*/
 +
 +
/*----- SECOND CONTENT -----*/
 +
 +
/*----- THIRD CONTENT -----*/
 +
 +
/*----- FOURTH CONTENT -----*/
 +
 +
/*----- FOOTER -----*/
-
===Team===
+
#footer {
-
Tell us about your team, your school!
+
position: absolute;
 +
bottom: 0;
 +
}
 +
 +
</style>
 +
    <script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.js"></script>
 +
   
 +
    <!-- FIRST BUTTON -->
 +
<script type="text/javascript">
 +
$(document).ready(function(){
 +
    $("#nav-button-link-first").click(function(){
 +
        $("#first-panel").toggle("fast");
 +
$("#second-panel").hide("fast");
 +
$("#third-panel").hide("fast");
 +
$("#fourth-panel").hide("fast");
 +
        $(this).toggleClass("active");
 +
        return false;
 +
    });
 +
});
 +
</script>
 +
   
 +
    <script type="text/javascript">
 +
$(document).ready(function(){
 +
    $("#first-title-link").click(function(){
 +
        $("#first-panel").toggle("fast");
 +
$("#second-panel").hide("fast");
 +
$("#third-panel").hide("fast");
 +
$("#fourth-panel").hide("fast");
 +
        $(this).toggleClass("active");
 +
        return false;
 +
    });
 +
});
 +
</script>
 +
   
 +
    <!-- SECOND BUTTON -->
 +
   
 +
    <script type="text/javascript">
 +
$(document).ready(function(){
 +
    $("#nav-button-link-second").click(function(){
 +
        $("#second-panel").toggle("fast");
 +
$("#first-panel").hide("fast");
 +
$("#third-panel").hide("fast");
 +
$("#fourth-panel").hide("fast");
 +
        $(this).toggleClass("active");
 +
        return false;
 +
    });
 +
});
 +
</script>
 +
   
 +
    <script type="text/javascript">
 +
$(document).ready(function(){
 +
    $("#second-title-link").click(function(){
 +
        $("#second-panel").toggle("fast");
 +
$("#first-panel").hide("fast");
 +
$("#third-panel").hide("fast");
 +
$("#fourth-panel").hide("fast");
 +
        $(this).toggleClass("active");
 +
        return false;
 +
    });
 +
});
 +
</script>
 +
   
 +
    <!-- THIRD BUTTON -->
 +
   
 +
    <script type="text/javascript">
 +
$(document).ready(function(){
 +
    $("#nav-button-link-third").click(function(){
 +
        $("#third-panel").toggle("fast");
 +
$("#first-panel").hide("fast");
 +
$("#second-panel").hide("fast");
 +
$("#fourth-panel").hide("fast");
 +
        $(this).toggleClass("active");
 +
        return false;
 +
    });
 +
});
 +
</script>
 +
   
 +
    <script type="text/javascript">
 +
$(document).ready(function(){
 +
    $("#third-title-link").click(function(){
 +
        $("#third-panel").toggle("fast");
 +
$("#first-panel").hide("fast");
 +
$("#second-panel").hide("fast");
 +
$("#fourth-panel").hide("fast");
 +
        $(this).toggleClass("active");
 +
        return false;
 +
    });
 +
});
 +
</script>
 +
   
 +
    <!-- FOURTH BUTTON -->
 +
   
 +
    <script type="text/javascript">
 +
$(document).ready(function(){
 +
    $("#nav-button-link-fourth").click(function(){
 +
        $("#fourth-panel").toggle("fast");
 +
$("#first-panel").hide("fast");
 +
$("#second-panel").hide("fast");
 +
$("#third-panel").hide("fast");
 +
        $(this).toggleClass("active");
 +
        return false;
 +
    });
 +
});
 +
</script>
 +
   
 +
    <script type="text/javascript">
 +
$(document).ready(function(){
 +
    $("#fourth-title-link").click(function(){
 +
        $("#fourth-panel").toggle("fast");
 +
$("#first-panel").hide("fast");
 +
$("#second-panel").hide("fast");
 +
$("#third-panel").hide("fast");
 +
        $(this).toggleClass("active");
 +
        return false;
 +
    });
 +
});
 +
</script>
 +
   
 +
</head>
-
 
+
<body>
-
===Project===
+
<div id="header">
-
What are you working on this semester?  
+
<img src="assets/logo.png" id="logo">
-
 
+
<div id="headerTitle">SPS_London</div>
-
 
+
<div id="headerSubTitle">TMNP Collective</div>
-
===Notebook===
+
    <div id="headerSubTitle">An <a id="igem" href="https://igem.org">iGEM</a> Team</div>
-
Show us how you spent your days.
+
    <div id="headerBackground"></div> <!--put image in here-->
-
 
+
    <!--[if gte IE 2 ]>
-
 
+
<p id="internet-explorer">This Wiki is designed for best use on <a href="https://www.google.com/intl/en_uk/chrome/browser/?hl=en-GB">Google Chrome</a> and <a href="https://www.mozilla.org/en-US/firefox/fx/#desktop">Mozilla Firefox</a>. Some key features are not available to your browser, please use a different browser or click <a href="">here</a>.</p>
-
===Results/Conclusions===
+
    <![endif]-->
-
What did you achieve over the course of your semester?
+
    <a class="nav_buttonLink" id="nav-button-link-first" href="#first"><div class="nav_button" id="first"><p class="nav_buttonText">HOME</p></div></a>
-
 
+
    <a class="nav_buttonLink" id="nav-button-link-second" href="#second"><div class="nav_button" id="second"><p class="nav_buttonText">PROJECT</p></div></a>
-
 
+
    <a class="nav_buttonLink" id="nav-button-link-third" href="#third"><div class="nav_button" id="third"><p class="nav_buttonText">THE TEAM</p></div></a>
-
===Safety===
+
<a class="nav_buttonLink" id="nav-button-link-fourth" href="#fourth"><div class="nav_button" id="fourth"><p class="nav_buttonText">NOTEBOOK</p></div></a>
-
What safety precautions did your team take? Did you take a safety training course? Were you supervised at all times in the lab?
+
   
-
 
+
</div> <!--of header-->
-
 
+
   
-
===Attributions===
+
   
-
Who worked on what?
+
    <div id="wrapper">
-
 
+
    <a class="title-link" id="first-title-link" id="#first"><h3>first</h3></a>
-
 
+
    <div id="first-panel">
-
===Human Practices===
+
        <div class="nav-box">
-
What impact does/will your project have on the public? 
+
            <ul>
-
 
+
            <li>Hi</li>
-
 
+
            </ul>
-
===Fun!===
+
            </div>
-
What was your favorite team snack?? Have a picture of your team mascot?
+
           
-
 
+
            <div class="panel-content">
-
 
+
      <p>this is all inside the first panel</p>
-
 
+
    </div> <!--of panel content-->   
-
<forum_subtle />
+
    </div>
 +
       
 +
    <a class="title-link" id="second-title-link" id="#second"><h3>second</h3></a>
 +
    <div id="second-panel">
 +
      <p>this is all inside the second panel</p>
 +
       
 +
    </div>
 +
       
 +
        <a class="title-link" id="third-title-link" id="#third"><h3>third</h3></a>
 +
        <div id="third-panel">
 +
            <p>this is all inside the third panel</p>
 +
   
 +
        </div>
 +
       
 +
        <a class="title-link" id="fourth-title-link" id="#fourth"><h3>fourth</h3></a>
 +
        <div id="fourth-panel">
 +
            <p>this is all inside the fourth panel</p>
 +
   
 +
        </div>
 +
       
 +
       
 +
    </div> <!-- of wrapper -->
 +
  <div id="footer">footer</div>
 +
   
 +
   
 +
</body>
 +
</html>

Revision as of 13:22, 17 March 2013

first
  • Hi

this is all inside the first panel

second

this is all inside the second panel

third

this is all inside the third panel

fourth

this is all inside the fourth panel

Retrieved from "http://2013hs.igem.org/Team:St_Pauls_London"