Team:ETH Zurich/project/overview

From 2014.igem.org

(Difference between revisions)
(Implementation in E. Coli)
(Implementation in E. coli)
 
(86 intermediate revisions not shown)
Line 2: Line 2:
{{:Team:ETH Zurich/tpl/head/simplify}}
{{:Team:ETH Zurich/tpl/head/simplify}}
{{:Team:ETH Zurich/tpl/head/animbuttons}}
{{:Team:ETH Zurich/tpl/head/animbuttons}}
 +
 +
<center>
 +
{{:Team:ETH Zurich/tpl/scrollbuttontworows|Our|Project|green}}
 +
{{:Team:ETH Zurich/tpl/scrollbuttontworows|Pattern|Emergence|blue}}
 +
{{:Team:ETH Zurich/tpl/scrollbuttontworows|Genetic|Circuits|red}}
 +
</center>
<html>  
<html>  
-
<div id="summary" class="inner2"> <article class="summary complex" style='margin-bottom:0;'> </html>  
+
<div id="Our" style='background-color:#FFFFFF; padding:2%;'> <article class="Our complex" style='margin-bottom:0;'> </html>  
{{:Team:ETH Zurich/project/overview/summary}}
{{:Team:ETH Zurich/project/overview/summary}}
-
<html> </article> <article class="summary simple" style="display:none; margin-bottom:0;"> </html>  
+
<html> </article> <article class="Our simple" style="display:none; margin-bottom:0;"> </html>  
{{:Team:ETH Zurich/project/overview/summarysimple}}  
{{:Team:ETH Zurich/project/overview/summarysimple}}  
<html> </article> </html>
<html> </article> </html>
-
{{:Team:ETH Zurich/tpl/simpbutton|summary|green}}
+
{{:Team:ETH Zurich/tpl/simpbutton|Our|green}}
 +
<html></div>
<br/>
<br/>
<br/>
<br/>
 +
 +
<div id="Pattern" style='background-color:#FFFFFF; padding:2%;'> </html>
{{:Team:ETH_Zurich/project/overview/grid}}
{{:Team:ETH_Zurich/project/overview/grid}}
-
<br/>
 
<html> </div>  
<html> </div>  
<br/>
<br/>
<br/>
<br/>
-
<div id="implementation" class="inner2"></html>
+
<div id="Genetic" style='background-color:#FFFFFF; padding:2%;'></html>
-
== Implementation in ''E. Coli'' ==
+
== Implementation in ''E. coli'' ==
-
So every cell on the grid below is supposed to compute an XOR of the two signals coming from above. XOR mean that if only one of the red and blue signals is coming, the cell should become ON (and show green fluorescence), whereas if none or both signals are coming, the cell should stay OFF.
+
-
 
+
-
How does it work ?
+
<center>
<center>
-
<html><h3 style='text-align:center;'> Choose your cell type :</h3></html>
+
Here you can see our circuit in action. More details on how it works are <html> <a class="circled scrolly" href="#implementation"> just below</a></html>. For a comprehensive inventory of all parts used, you can check our [https://2014.igem.org/Team:ETH_Zurich/data Data page].
 +
<html>
 +
<style>
 +
@media
 +
only screen and (max-width: 760px),
 +
(min-device-width: 768px) and (max-device-width: 1024px)  {
 +
 
 +
/* Force table to not be like tables anymore */
 +
table, thead, tbody, th, td, tr {
 +
display: block;
 +
}
 +
 +
/* Hide table headers (but not display: none;, for accessibility) */
 +
thead tr {
 +
border:none;
 +
position: absolute;
 +
top: -9999px;
 +
left: -9999px;
 +
}
 +
 +
 +
td {
 +
/* Behave  like a "row" */
 +
border: none;;
 +
position: relative;
 +
}
 +
 +
td:before {
 +
/* Now like a table header */
 +
position: absolute;
 +
/* Top/left values mimic padding */
 +
top: 6px;
 +
left: 6px;
 +
width: 45%;
 +
padding-right: 10px;
 +
white-space: nowrap;
 +
}
 +
 +
}
 +
</style>
 +
</br>
 +
</br>
 +
<table style='width:100%; z-index:1;'>
 +
<tr style='border:2px solid black;'>
 +
<td>
 +
<div id="bloc1" style='margin-left:3em;'><h3 style='font-weight:800;'> Choose the cell type and the inputs:</h3></html>
<br/>
<br/>
{{:Team:ETH_Zurich/tpl/animbuttonblue}}
{{:Team:ETH_Zurich/tpl/animbuttonblue}}
{{:Team:ETH_Zurich/tpl/animbuttonred}}
{{:Team:ETH_Zurich/tpl/animbuttonred}}
-
</center>
 
-
<html><h3 style='text-align:center;'> Choose your inputs :</h3></html>
 
<br/>
<br/>
-
<center>
 
{{:Team:ETH Zurich/tpl/animbuttonnoneblue|<html>width='160px' height='152.78px'</html>}}
{{:Team:ETH Zurich/tpl/animbuttonnoneblue|<html>width='160px' height='152.78px'</html>}}
{{:Team:ETH Zurich/tpl/animbuttonlasblue|<html>width='160px' height='152.78px'</html>}}
{{:Team:ETH Zurich/tpl/animbuttonlasblue|<html>width='160px' height='152.78px'</html>}}
 +
<br/>
{{:Team:ETH Zurich/tpl/animbuttonluxblue|<html>width='160px' height='152.78px'</html>}}
{{:Team:ETH Zurich/tpl/animbuttonluxblue|<html>width='160px' height='152.78px'</html>}}
{{:Team:ETH Zurich/tpl/animbuttonbothblue|<html>width='160px' height='152.78px'</html>}}
{{:Team:ETH Zurich/tpl/animbuttonbothblue|<html>width='160px' height='152.78px'</html>}}
-
</center>
 
-
<center>
 
{{:Team:ETH Zurich/tpl/animbuttonnonered|<html>width='160px' height='152.78px'</html>}}
{{:Team:ETH Zurich/tpl/animbuttonnonered|<html>width='160px' height='152.78px'</html>}}
{{:Team:ETH Zurich/tpl/animbuttonlasred|<html>width='160px' height='152.78px'</html>}}
{{:Team:ETH Zurich/tpl/animbuttonlasred|<html>width='160px' height='152.78px'</html>}}
 +
<br/>
{{:Team:ETH Zurich/tpl/animbuttonluxred|<html>width='160px' height='152.78px'</html>}}
{{:Team:ETH Zurich/tpl/animbuttonluxred|<html>width='160px' height='152.78px'</html>}}
{{:Team:ETH Zurich/tpl/animbuttonbothred|<html>width='160px' height='152.78px'</html>}}
{{:Team:ETH Zurich/tpl/animbuttonbothred|<html>width='160px' height='152.78px'</html>}}
</center>
</center>
<br/>
<br/>
-
<html><h3 style='text-align:center;'>See how the information is processed to get the right output : </h3>
+
<html></div>
 +
</td>
 +
<td>
 +
<div id="bloc2">
 +
<h3 style='text-align:center; font-weight:800;'>See how the information is processed to get the right output : </h3>
<center>
<center>
<img  class='animation' id='luxred' src='https://static.igem.org/mediawiki/2014/7/73/ETH_Zurich_Animation_luxred.gif'>
<img  class='animation' id='luxred' src='https://static.igem.org/mediawiki/2014/7/73/ETH_Zurich_Animation_luxred.gif'>
Line 56: Line 107:
<img class='animation' id='luxblue' src='https://static.igem.org/mediawiki/2014/c/c4/ETH_Zurich_Animation_luxblue.gif'>
<img class='animation' id='luxblue' src='https://static.igem.org/mediawiki/2014/c/c4/ETH_Zurich_Animation_luxblue.gif'>
<img class='animation' id='lasblue' src='https://static.igem.org/mediawiki/2014/6/64/ETH_Zurich_Animation_lasblue.gif'>
<img class='animation' id='lasblue' src='https://static.igem.org/mediawiki/2014/6/64/ETH_Zurich_Animation_lasblue.gif'>
-
</center>
+
</center></div>
 +
</td>
 +
</tr>
 +
</table> 
 +
</div>
-
<article class="implementation simple" style="display:none; margin-bottom:0; margin-top:-10%;"> </html>  
+
<div id="implementation" style='background-color:#FFFFFF; padding:2%;  text-align:left;'>
 +
<article class="implementation simple" style="display:none; margin-bottom:0; padding-top:0;"> </html>  
{{:Team:ETH Zurich/project/overview/implementationsimple}}  
{{:Team:ETH Zurich/project/overview/implementationsimple}}  
-
<html> </article><article class="implementation complex" style='margin-bottom:0; margin-top:-10%'> </html>  
+
<html> </article><article class="implementation complex" style='margin-bottom:0; padding-top:0;'> </html>  
{{:Team:ETH Zurich/project/overview/implementation}}
{{:Team:ETH Zurich/project/overview/implementation}}
<html> </article> </html>
<html> </article> </html>

Latest revision as of 01:33, 18 October 2014

iGEM ETH Zurich 2014