Difference between revisions of "Team:Lambert GA/Notebook"

(Prototype team page)
 
 
(40 intermediate revisions by 5 users not shown)
Line 1: Line 1:
{{Lambert_GA}}
+
{{:Team:Lambert_GA/Template}}
 
<html>
 
<html>
 +
<head>
  
  
<div class="column full_size">
+
<link href="https://fonts.googleapis.com/css?family=Codystar:300,400" rel="stylesheet">
 +
<link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet">
 +
<link href="https://fonts.googleapis.com/css?family=Lora" rel="stylesheet">
 +
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
 +
<style type="text/css">
 +
#holder {
 +
position: fixed;
 +
top: 0%;
 +
left: 0%;
 +
height: 100%;
 +
width: 100%;
 +
z-index: -3;
 +
}
 +
#oceanvideo {
 +
position: fixed;
 +
top: 0%;
 +
left: 0%;
 +
width: 100%;
 +
height: 100%;
 +
object-fit: fill;
 +
z-index: 1;
 +
}
 +
#overlay {
 +
position: fixed;
 +
top: 0%;
 +
left: 0%;
 +
width: 100%;
 +
height: 100%;
 +
background-color: #000000;
 +
opacity: 0.3;
 +
z-index: 3;
 +
}
 +
#bigtitle {
 +
position: absolute;
 +
top: 43%;
 +
left: 0%;
 +
height: 10%;
 +
width: 100%;
 +
z-index: 2;
 +
font-family: 'Montserrat', sans-serif;
 +
color: #FFFFFF;
 +
font-size: 70px;
 +
text-align: center;
 +
z-index: 4;
 +
}
 +
#actualtext {
 +
position: relative;
 +
top: 400%;
 +
left: 0%;
 +
height: 170%;
 +
width: 100%;
 +
background-color: #FFFFFF;
 +
z-index: 4;
 +
}
 +
#afterhome {
 +
position: relative;
 +
top: 99%;
 +
left: 0%;
 +
height: 170%;
 +
width: 100%;
 +
}
 +
#sidebar {
 +
position: absolute;
 +
top: 0%;
 +
left: 8%;
 +
height: 35%;
 +
width: 13%;
 +
z-index: 6;
 +
}
 +
#link {
 +
font-family: 'Montserrat', sans-serif;
 +
color: #000000;
 +
font-size: 24px;
 +
cursor: pointer;
 +
transition: all 0.4s ease;
 +
-webkit-transition: all 0.4s ease;
 +
-moz-transition: all 0.4s ease;
 +
-ms-transition: all 0.4s ease;
 +
-o-transition: all 0.4s ease;
 +
}
 +
#link:hover {
 +
color: #0077be;
 +
text-decoration: none;
 +
}
  
<h1>Notebook</h1>
+
#maincontent {
<p> Document the dates you worked on your project. This should be a detailed account of the work done each day for your project.</p>
+
position: relative;
 +
top: 0%;
 +
left: 28%;
 +
height: 92%;
 +
width: 64%;
 +
}
 +
#subheading1 {
 +
font-size: 36px;
 +
font-family: 'Montserrat', sans-serif;
 +
}
 +
#content1 {
 +
font-family: 'Lora', serif;
 +
font-size: 15px;
 +
line-height: 1.75em;
  
 +
}
 +
#subheading2 {
 +
font-size: 36px;
 +
font-family: 'Montserrat', sans-serif;
 +
}
 +
#content2 {
 +
font-family: 'Lora', serif;
 +
font-size: 15px;
 +
line-height: 1.75em;
 +
 +
}
 +
#subheading3 {
 +
font-size: 36px;
 +
font-family: 'Montserrat', sans-serif;
 +
}
 +
#content3 {
 +
font-family: 'Lora', serif;
 +
font-size: 15px;
 +
line-height: 1.75em;
 +
 +
}
 +
#subheading4 {
 +
font-size: 36px;
 +
font-family: 'Montserrat', sans-serif;
 +
}
 +
#subheading5 {
 +
font-size: 36px;
 +
font-family: 'Montserrat', sans-serif;
 +
}
 +
#footer {
 +
height: 100px;
 +
width: 100%;
 +
background-color: #FFFFFF;
 +
z-index: 7;
 +
}
 +
#flogo {
 +
font-size:28px;
 +
color: #767676;
 +
transition: all 0.4s ease;
 +
-webkit-transition: all 0.4s ease;
 +
-moz-transition: all 0.4s ease;
 +
-ms-transition: all 0.4s ease;
 +
-o-transition: all 0.4s ease;
 +
}
 +
#target1{
 +
position: relative;
 +
top: -80px;
 +
}
 +
#target2{
 +
position: relative;
 +
top: -80px;
 +
}
 +
#target3{
 +
position: relative;
 +
top: -80px;
 +
}
 +
#flogo:hover {
 +
color: #3B5998;
 +
}
 +
#tlogo {
 +
font-size:28px;
 +
color: #767676;
 +
transition: all 0.4s ease;
 +
-webkit-transition: all 0.4s ease;
 +
-moz-transition: all 0.4s ease;
 +
-ms-transition: all 0.4s ease;
 +
-o-transition: all 0.4s ease;
 +
}
 +
#tlogo:hover {
 +
color: #00aced;
 +
}
 +
#ilogo {
 +
font-size:28px;
 +
color: #767676;
 +
transition: all 0.4s ease;
 +
-webkit-transition: all 0.4s ease;
 +
-moz-transition: all 0.4s ease;
 +
-ms-transition: all 0.4s ease;
 +
-o-transition: all 0.4s ease;
 +
}
 +
#ilogo:hover {
 +
color: #bc2a8d;
 +
}
 +
#afterhome {
 +
position: relative;
 +
top: 99%;
 +
left: 0%;
 +
height: 170%;
 +
width: 100%;
 +
}
 +
</style>
 +
</head>
 +
 +
<body>
 +
 +
 +
<div id="holder">
 +
    <video style= "z-index:1;" id="oceanvideo"  autoplay muted loop>
 +
              <source src="https://static.igem.org/mediawiki/2018/5/54/T--Lambert_GA--Notebook.mp4" type="video/mp4">
 +
              Your browser does not support video.
 +
            </video>
 +
    <div id="overlay"></div>
 +
          <div id="bigtitle">
 +
              N O T E B O O K
 +
          </div>
 
</div>
 
</div>
<div class="clear"></div>
 
  
 +
<br><br><br>
 +
<br><br><br>
 +
<br><br><br>
 +
<br><br><br>
 +
<br><br><br>
 +
<br><br><br>
 +
<br><br><br>
 +
<br><br><br>
 +
<br><br><br>
 +
<br><br><br>
 +
<br><br><br>
  
 +
<div id="actualtext">
  
<div class="column two_thirds_size">
 
<h3>What should this page have?</h3>
 
<ul>
 
<li>Chronological notes of what your team is doing.</li>
 
<li> Brief descriptions of daily important events.</li>
 
<li>Pictures of your progress. </li>
 
<li>Mention who participated in what task.</li>
 
</ul>
 
  
 +
<div id="afterhome">
 +
<div id="sidebar">
 +
<br><br>
 +
                      <div id="link">
 +
                            <b><a style="color:black; text-decoration: none; line-height:1.1;" href="#target1">CLONING WORKFLOW</a></b>
 +
                      </div>
 +
<br><br>
 +
                      <div id="link">
 +
                            <b><a style="color:black; text-decoration: none; line-height:1.1;" href="#target2">NOTEBOOK</a></b>
 +
                      </div>
 +
<br><br>
 +
                      <div id="link">
 +
                            <b><a style="color:black; text-decoration: none; line-height:1.1;" href="#target3">BIOBRICK NOTEBOOK</a></b>
 +
                      </div>
 +
      </div>
 
</div>
 
</div>
  
<div class="column third_size">
+
<div id="maincontent">
<div class="highlight decoration_A_full">
+
<h3>Inspiration</h3>
+
<p>You can see what others teams have done to organize their notes:</p>
+
  
<ul>  
+
<br><br><br>
<li><a href="https://2014.igem.org/Team:ATOMS-Turkiye/Notebook">2014 ATOMS-Turkiye</a></li>
+
<center>
<li><a href="https://2014.igem.org/Team:Tec-Monterrey/ITESM14_project.html#tab_notebook">2014 Tec Monterrey</a></li>
+
<div id="target1"></div>
<li><a href="https://2014.igem.org/Team:Kyoto/Notebook/Magnetosome_Formation#title">2014 Kyoto</a></li>
+
<div id="subheading1">
<li><a href="https://2014.igem.org/Team:Cornell/notebook">2014 Cornell</a></li>
+
<b>VIEW OUR CLONING WORKFLOW</b>
</ul>
+
 
</div>
 
</div>
 +
 +
<br><br>
 +
<div id="pdf-display-container">
 +
  <div id="pdf-viewer-container">
 +
    <iframe height="1100px" iframe width = "900px" id="pdf-viewer" src="https://static.igem.org/mediawiki/2018/4/43/T--Lambert_GA--Workflow_PDF.pdf" frameborder="0"> <center>Cloning Workflow</center></iframe>
 +
  </div>
 
</div>
 
</div>
 +
</center>
 +
<br>
 +
<center>
 +
<div>
 +
<center><p style="font-size: 18px"> Click here to download your own <a href="https://static.igem.org/mediawiki/2017/a/a5/Copy_of_Ligation_Calculator.xlsx">Ligation Calculator</a>.</p></center>
 +
</div>
 +
<div>
 +
<i>Cloning Workflow</i>
 +
<br ><br></div>
 +
<br><br>
 +
<center>
 +
<div id="target2"></div>
 +
<div id="subheading2">
 +
<b>VIEW OUR TEAM'S NOTEBOOKS</b>
 +
</div>
 +
</center>
 +
<div><br><br></div>
 +
<center>
 +
 +
<div id="pdf-display-container">
 +
  <div id="pdf-viewer-container">
 +
    <iframe height="1100px" iframe width = "900px" id="pdf-viewer" src="https://static.igem.org/mediawiki/2018/e/e5/T--Lambert_GA--Notebook.pdf" frameborder="0"> Team Notebook</iframe>
 +
  </div>
 +
</div>
 +
<div>
 +
<br>
 +
<i >Team Notebook</i>
 +
 +
<br ><br></div>
 +
</center>
 +
 +
<center>
 +
<div id="target3"></div>
 +
<div id="subheading2">
 +
<b>VIEW OUR BIOBRICK NOTEBOOKS</b>
 +
</div>
 +
</center>
 +
<div><br><br></div>
 +
<center>
 +
 +
<div id="pdf-display-container">
 +
  <div id="pdf-viewer-container">
 +
    <iframe height="1100px" iframe width = "900px" id="pdf-viewer" src="https://static.igem.org/mediawiki/2018/7/76/T--Lambert_GA--biobrickworkflow.pdf
 +
" frameborder="0">Biobrick Notebook</iframe>
 +
  </div>
 +
</div>
 +
<div >
 +
<br>
 +
<i >Biobrick Notebook</i>
 +
<br ><br></div>
 +
</center>
 +
 +
</div>
 +
 +
<div id="footer">
 +
<br><br>
 +
<a href="https://www.facebook.com/groups/198318606966726/"><i class="fa fa-facebook" id="flogo"></i></a>
 +
 +
<a href="https://twitter.com/lamberths_igem?lang=en"><i class="fa fa-twitter" id="tlogo"></i></a>
 +
 +
<a href="https://www.instagram.com/lambertigem/"><i class="fa fa-instagram" id="ilogo"></i></a>
 +
 +
</div>
 +
 +
 +
<div class="clear"></div>
 +
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
 +
<script>
 +
$(window).scroll(function(e){
 +
  parallax();
 +
});
 +
 +
//PARALLAX FUNCTION
 +
function parallax(){
 +
  var scrolled = $(window).scrollTop();
 +
  $('#oceanvideo').css('top',-(scrolled*0.35)+'px');
 +
}
 +
 +
//NOT THE MOST EFFICIENT PARALLAX, BUT SIMPLE
 +
</script>
 +
  
 +
</head>
 
</html>
 
</html>

Latest revision as of 02:25, 18 October 2018

N O T E B O O K




































VIEW OUR CLONING WORKFLOW



Click here to download your own Ligation Calculator.

Cloning Workflow



VIEW OUR TEAM'S NOTEBOOKS



Team Notebook

VIEW OUR BIOBRICK NOTEBOOKS



Biobrick Notebook