Team:Gaston Day School/Modeling

From 2014.igem.org

(Difference between revisions)
 
(46 intermediate revisions not shown)
Line 1: Line 1:
{{CSS/Main}}
{{CSS/Main}}
<html>
<html>
-
<style>
+
<head>
-
[class*='grid']
+
<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
-
{
+
<link href='http://fonts.googleapis.com/css?family=Ubuntu:500' rel='stylesheet' type='text/css'>
-
text-align: center;
+
-
Width: 100%;
+
<style>
-
}
+
.firstHeading {
 +
display:none;
 +
}
-
[class*='row']
+
body {
-
{
+
padding: 0px;
-
width: 100%;
+
margin: 0px;
-
}
+
-
[class*='column']
+
}
-
{
+
 +
            [class*='col-'] {
float: left;
float: left;
-
width: 16%;
+
padding-right: 20px;
-
margin:10px;
+
}
-
Border: 1px solid #000000;
+
-
Background-color: #ffffff;
+
-
}
+
-
               
+
-
body
+
-
{
+
-
font-size: 80%;
+
-
font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif;
+
-
background-image: url("http://newevolutiondesigns.com/images/freebies/retro-wallpaper-1.jpg");
+
-
width:80%;
+
-
margin-left: 10%;
+
-
margin-right: 10%;
+
-
}
+
-
ul#tabs
+
.grid-pad {
 +
padding: 20px 0px 20px 20px;
 +
}
-
{
+
.sub-grid-pad {
-
list-style-type: none; padding: 0 0 0.3em 0;
+
padding: 20px 0px 20px 0px;
-
}
+
}
-
ul#tabs li
+
.grid-pad > .row > [class*='col-']:last-of-type, .grid-pad > [class*='col-']:last-of-type {
-
{
+
padding-right: 20px;
-
display: inline;
+
}
-
}
+
-
 
+
-
ul#tabs li a
+
-
{
+
-
color: #42454a;
+
-
background-color: #fefefe;
+
-
border: 1px solid #000000;
+
-
border-bottom: none;
+
-
padding: 0.3em;
+
-
border-radius: 5px;
+
-
text-decoration: none;
+
-
}    
+
-
ul#tabs li a:hover
+
.col-1-1 {
-
{
+
width: 100%;
-
background-color: #ffffff;
+
}
-
}
+
-
ul#tabs li a.selected
+
.col-1-2, .col-2-4, .col-3-6, .col-5-10 {
-
{
+
width: 50%;
-
color: #000; background-color: #ffffff; font-weight: bold; padding: 0.7em 0.3em 0.38em 0.3em;
+
}
-
}
+
-
div.tabContent
+
.col-1-3, .col-2-6, .col-3-9 {
-
{
+
width: 33.33%;
-
border: 1px solid #000000;
+
}
-
background-color: #ffffff;
+
-
float: left;
+
-
border-radius: 5px;
+
-
width: 100%;  
+
-
padding: 0.5em;
+
-
}
+
-
div.tabContent.hide
+
.col-2-3, .col-4-6, .col-6-9 {
-
{
+
width: 66.66%;
-
display: none;
+
}
-
}
+
-
    </style>
+
.col-1-4, .col-2-8 {
 +
width: 25%;
 +
}
-
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
+
.col-3-4 {
 +
width: 75%;
 +
}
-
    <script>
+
.col-1-5, .col-2-10 {
 +
width: 20%;
 +
}
-
<!-- Tabs -->
+
.col-2-5, .col-4-10 {
 +
width: 40%;
 +
}
-
        var tabLinks = new Array();
+
.col-3-5, .col-6-10 {
 +
width: 60%;
 +
}
-
var contentDivs = new Array();
+
.col-4-5, .col-8-10 {
 +
width: 80%;
 +
}
-
function init()
+
.col-1-6 {
-
{
+
width: 16.66%;
-
// Grab the tab links and content divs from the page
+
}
-
var tabListItems = document.getElementById('tabs').childNodes;
+
-
for ( var i = 0; i < tabListItems.length; i++ )
+
.col-5-6 {
-
{
+
width: 83.33%;
-
if ( tabListItems[i].nodeName == "LI" )
+
-
{
+
-
var tabLink = getFirstChildWithTagName( tabListItems[i], 'A' );                                   var id = getHash( tabLink.getAttribute('href') );
+
-
tabLinks[id] = tabLink;
+
-
contentDivs[id] = document.getElementById( id );
+
-
}
+
}
}
-
// Assign onclick events to the tab links, and
+
.col-1-7 {
 +
width: 14.28%;
 +
}
-
// highlight the first tab
+
.col-2-7 {
 +
width: 28.57%;
 +
}
-
var i = 0;
+
.col-3-7 {
 +
width: 42.85%;
 +
}
-
for ( var id in tabLinks )
+
.col-4-7 {
-
{
+
width: 57.14%;
-
tabLinks[id].onmouseover = showTab;
+
-
tabLinks[id].onfocus = function() { this.blur() };
+
-
if ( i == 0 ) tabLinks[id].className = 'selected';
+
-
i++;
+
}
}
-
// Hide all content divs except the first
+
.col-5-7 {
 +
width: 71.42%;
 +
}
-
var i = 0;
+
.col-6-7 {
 +
width: 85.71%;
 +
}
-
for ( var id in contentDivs )
+
.col-1-8 {
-
{
+
width: 12.5%;
-
if ( i != 0 ) contentDivs[id].className = 'tabContent hide'; 
+
-
i++;
+
}
}
-
        }
+
.col-2-8 {
 +
width: 25%;
 +
}
-
function showTab()
+
.col-3-8 {
-
{
+
width: 37.5%;
-
var selectedId = getHash( this.getAttribute('href') );
+
-
// Highlight the selected tab, and dim all others.
+
-
// Also show the selected content div, and hide all others.
+
-
for ( var id in contentDivs )
+
-
{
+
-
if ( id == selectedId )
+
-
{
+
-
tabLinks[id].className = 'selected';
+
-
contentDivs[id].className = 'tabContent';
+
-
}
+
-
else
+
-
{
+
-
tabLinks[id].className = '';
+
-
contentDivs[id].className = 'tabContent hide';
+
-
}
+
}
}
-
// Stop the browser following the link
 
-
return false;
 
-
}
 
-
function getFirstChildWithTagName( element, tagName )
+
.col-4-8 {
 +
width: 50%;
 +
}
-
{
+
.col-5-8 {
 +
width: 62.5%;
 +
}
-
for ( var i = 0; i < element.childNodes.length; i++ )
+
.col-6-8 {
 +
width: 75%;
 +
}
-
{
+
.col-7-8 {
 +
width: 87.5%;
 +
}
-
if ( element.childNodes[i].nodeName == tagName )
+
.col-1-9 {
 +
width: 11.11%;
 +
}
-
return element.childNodes[i];
+
.col-2-9 {
 +
width: 22.22%;
 +
}
-
}
+
.col-4-9 {
 +
width: 44.44%;
 +
}
-
}
+
.col-5-9 {
 +
width: 55.55%;
 +
}
-
function getHash( url )
+
.col-7-9 {
 +
width: 77.77%;
 +
}
-
{
+
.col-8-9 {
 +
width: 88.88%;
 +
}
-
var hashPos = url.lastIndexOf ( '#' );
+
.col-1-10 {
 +
width: 10%;
 +
}
-
return url.substring( hashPos + 1 );
+
.col-3-10 {
 +
width: 30%;
 +
}
-
}
+
.col-7-10 {
 +
width: 70%;
 +
}
-
</script>
+
.col-9-10 {
 +
width: 90%;
 +
}
 +
.grid:after {
 +
content: "";
 +
display: table;
 +
clear: both;
 +
}
 +
*, *:after, *:before {
 +
-webkit-box-sizing: border-box;
 +
-moz-box-sizing: border-box;
 +
box-sizing: border-box;
 +
}
 +
[class*='col-']:last-of-type {
 +
padding-right: 0;
 +
}
 +
.show {
 +
background-color:#FFFFFF;
 +
color: #081D38;
 +
box-shadow: 0px 0px 25px #888888;
 +
}
-
<body onload="init()" background-image=" url("http://images.dailytech.com/nimage/Nyan_Cat_Wide.jpg")">
 
-
<!--main content →
+
.hide {
 +
background-color: auto;
 +
}
 +
#pad {
 +
padding: 5px;
 +
}
-
<!--Tabs(NOT SLIDESHOW!) -->
+
body {
 +
background-color:#DFEDFF;
 +
}
-
<div style="padding-left: 10px;">
+
#head {
 +
font-family: 'Open Sans', sans-serif;
 +
}
-
<ul id="tabs">
+
#mainhead {
-
<li><a href="https://2014.igem.org/Team:Gaston_Day_School#home">Home</a></li>
+
font-family:'Ubuntu', sans-serif;
-
<li><a href="https://2014.igem.org/Team:Gaston_Day_School/Team#team">Members</a></li>
+
font-size: 50px;
-
<li><a href="https://2014.igem.org/Team:Gaston_Day_School/Project#project">Project</a></li>
+
}
-
<li><a href="https://2014.igem.org/Team:Gaston_Day_School/Measurementtrack#measure">Measurement Track</a></li>
+
-
<li><a href="https://2014.igem.org/Team:Gaston_Day_School/Parts#parts">Parts</a></li>
+
-
<li><a href="https://2014.igem.org/Team:Gaston_Day_School/Modeling#models">Models</a></li>
+
-
<li><a href="https://2014.igem.org/Team:Gaston_Day_School/Notebook#notebook">Notebook</a></li>
+
-
<li><a href="https://2014.igem.org/Team:Gaston_Day_School/Safety#safety">Safety</a></li>
+
-
<li><a href="https://2014.igem.org/Team:Gaston_Day_School/Attributions#attrib">Attributions</a></li>
+
-
<li><a href="https://2014.igem.org/Main_Page#igem"><img src="https://static.igem.org/mediawiki/igem.org/6/60/Igemlogo_300px.png" width="55px" position="absolute"></a></li>
+
-
</ul>
+
-
</div>
+
-
  <!--Tab Content-->
+
a{text-decoration:none;}
-
<div class="tabContent" id="home">
+
#navbar > div > a > p.show {
-
<h2>Home</h2>
+
box-shadow: 10px 10px 5px #888888;
-
        <p> in tha hizzle</p>
+
}
-
</div>
+
-
<div class="tabContent" id="team">
+
.currentpage {
-
<h2>Team</h2>
+
background-color:#FFFFFF;
-
<p>Teem stuff</p>
+
color: #081D38;
-
</div>
+
box-shadow: 0px 0px 25px #888888;
 +
}
-
<div class="tabContent" id="project">
+
#navbar > div > a :hover{
-
<h2>Project</h2>
+
background-color: #C1CDCd;
-
<p>Project things </p>
+
color: #081D38;
-
</div>
+
}
-
<div class="tabContent" id="measure">
+
#navbar > div > a:active > p.show {
-
<h2>Measurement Track</h2>
+
box-shadow: 0px 0px 25px #888888;
-
<p>Measurement stuff </p>
+
}
-
</div>
+
 +
.image-wrapper
 +
{
 +
position: relative;
 +
}
-
<div class="tabContent" id="parts">
+
.scale-image
-
<h2>Parts</h2>
+
{
-
<p>Parts </p>
+
height: 100%;
-
</div>
+
width: 100%;
-
 
+
}
-
<div class="tabContent" id="models">
+
</style>
-
 
+
</head>
-
<h2>Models</h2>
+
-
<p>Models </p>
+
-
</div>
+
-
 
+
-
<div class="tabContent" id="notebook">
+
-
<h2>Notebook</h2>
+
-
<p>Notebook writings </p>
+
-
</div>
+
-
 
+
-
<div class="tabContent" id="safety">
+
-
<h2>Safety</h2>
+
-
<p>Safety shloop  </p>
+
-
</div>
+
-
 
+
-
<div class="tabContent" id="attrib">
+
-
<h2>Attributions</h2>
+
-
<p>Attributes 'n shiz </p>
+
-
</div>
+
-
 
+
-
<div class="tabContent" id="igem">
+
-
<h2>Homepage</h2>
+
-
<p>Go to, ja!</p>
+
-
</div>
+
 +
<body>
 +
 +
<div class="row">
 +
<h1 id="mainhead" style="color:#072751" class="show" align="center">2014 GDS iGEM Modeling Page</p>
 +
            <h2 style="color:#072751">>Models</h2>
 +
</div>
 +
               
 +
<div class="grid-pad" align="center" id="navbar">
 +
<div class="col-1-9">
 +
<a href="https://2014.igem.org/Team:Gaston_Day_School#home"><p class="show" id="pad">Home<p></a>
 +
</div>
 +
<div class="col-1-9">
 +
<a href="https://2014.igem.org/Team:Gaston_Day_School/Team#team">
 +
<p class="show" id="pad">Members<p></a>
 +
</div>
 +
<div class="col-1-9">
 +
<a href="https://2014.igem.org/Team:Gaston_Day_School/Project#project">
 +
<p class="show" id="pad">Project<p></a>
 +
</div>
 +
<div class="col-1-9">
 +
<a href="https://2014.igem.org/Team:Gaston_Day_School/Parts#parts">
 +
<p class="show" id="pad">Parts<p></a>
 +
</div>
 +
<div class="col-1-9">
 +
<a href="https://2014.igem.org/Team:Gaston_Day_School/Modeling#models">
 +
<p class="currentpage" id="pad">Models<p></a>
 +
</div>
 +
<div class="col-1-9">
 +
<a href="https://2014.igem.org/Team:Gaston_Day_School/Notebook#notebook">
 +
<p class="show" id="pad">Notebook<p></a>
 +
</div>
 +
<div class="col-1-9">
 +
<a href="https://2014.igem.org/Team:Gaston_Day_School/Safety#safety">
 +
<p class="show" id="pad">Safety<p></a>
 +
</div>
 +
<div class="col-1-9">
 +
<a href="https://2014.igem.org/Team:Gaston_Day_School/Attributions#attrib">
 +
<p class="show" id="pad">Attributions<p></a>
 +
</div>
 +
<div class="col-1-9">
 +
<a href="https://2014.igem.org/Main_Page">
 +
<p class="show" id="pad"><img src="https://static.igem.org/mediawiki/igem.org/6/60/Igemlogo_300px.png" width="19px" position="absolute"><p></a>
 +
</div>
 +
</div>
 +
 +
       
 +
       
 +
<div class="col-1-10">
 +
<p class="hide" id="pad"></p>
 +
</div>
 +
       
 +
       
 +
       
 +
<div class="col-8-10">
 +
           
 +
            <div class="grid-pad">
 +
                <div class="col-1-1">
 +
<h2 id="head" class="show">Isobutanol Pathway</h2>
 +
<div class="show" id="pad">
 +
              <img src="https://static.igem.org/mediawiki/2014/thumb/a/af/Isobut_figure.jpg/800px-Isobut_figure.jpg" alt="Isobutanol Figure" style="width:100%">The figure above shows the native Isobutanol production pathway in E. coli. The figure is from Figure 1 in Atsumi, S., Hanai, T., and Liao, J.C., (2008). Non-fermentative pathways for synthesis of branched-chain higher alcohols as biofuels. Nature 451(3):86.
 +
            </div>
 +
                <div>
 +
            </div>
 +
                   
 +
           
 +
              </div>
 +
            </div>
 +
                   
 +
            <div class="grid-pad">
 +
<div class="col-1-1">
 +
                    <div id="pad">
 +
<h2 id="head" class="show">Isobutanol Production Pathway</h2>
 +
<div class="show" id="pad">
 +
                        <img src="https://static.igem.org/mediawiki/2014/6/6b/Isobut_prodection_pathway_2.jpg" alt="Isobutanol Pathway" style="width:100%">Figure 2 shows the isobutanol production pathway in greater detail. This figure is from figure 1 in Atsumi, S., Wu, T., Eckl, E., Hawkins, S., Buelter, T., & Liao, J. (2009). Engineering the Isobutanol Biosynthetic Pathway in Escherichia Coli by Comparison of Three Aldehyde Reductase/Alcohol Dehydrogenase Genes. Appl Microbiol Biotechnol (2010) 85.651-657.
 +
                       
 +
                        </div>
 +
                 
 +
</div>
 +
            </div>
 +
                   
 +
         
 +
                        </div>
 +
</div>
 +
</div>
 +
</div>
 +
                   
 +
        </div> </div>
 +
            </div>
 +
                   
 +
            <div class="grid-pad">
 +
<div class="col-1-1">
 +
                    <div id="pad">
 +
                    <h2 id="head">Mechanism for GlmY and GlmZ Actvity</h2>
 +
                        <p class = "show" id = "pad">
 +
                         
 +
<img src="https://static.igem.org/mediawiki/2014/4/43/Glm_jpg_fig.jpg" alt="6.11.14iso.png" style="width:100%"> This model comes from figure 8 from Urban, J.H., and Vogel, J., (2008). Two Seemingly Homologous Noncoding RNAs Act Hierarchically to Activate glmS mRNA Translation. PLoS Biology 6(3):631.
 +
                    </div>
 +
                        </p>
 +
                        </div>
 +
</div>
 +
</div>
 +
</div>
 +
                   
 +
        </div>
 +
               
 +
               
 +
               
 +
        <div class="col-1-10">
 +
<p class="hide" id="pad"></p>
 +
</div>
 +
               
 +
               
 +
               
 +
    </body>
</html>
</html>

Latest revision as of 21:38, 17 October 2014

2014 GDS iGEM Modeling Page

>Models

Isobutanol FigureThe figure above shows the native Isobutanol production pathway in E. coli. The figure is from Figure 1 in Atsumi, S., Hanai, T., and Liao, J.C., (2008). Non-fermentative pathways for synthesis of branched-chain higher alcohols as biofuels. Nature 451(3):86.
Isobutanol PathwayFigure 2 shows the isobutanol production pathway in greater detail. This figure is from figure 1 in Atsumi, S., Wu, T., Eckl, E., Hawkins, S., Buelter, T., & Liao, J. (2009). Engineering the Isobutanol Biosynthetic Pathway in Escherichia Coli by Comparison of Three Aldehyde Reductase/Alcohol Dehydrogenase Genes. Appl Microbiol Biotechnol (2010) 85.651-657.

6.11.14iso.png This model comes from figure 8 from Urban, J.H., and Vogel, J., (2008). Two Seemingly Homologous Noncoding RNAs Act Hierarchically to Activate glmS mRNA Translation. PLoS Biology 6(3):631.

Retrieved from "http://2014.igem.org/Team:Gaston_Day_School/Modeling"