Difference between revisions of "Team:Fudan"

Line 1: Line 1:
 
{{Fudan}}
 
{{Fudan}}
 
<html lang="en">
 
<html lang="en">
 +
<!--
 +
This html document is created by Tian Huang for Team Fudan iGEM 2018.
 +
We make it compatible on laptop and mobile devices by using Materialize 1.0.0-rc.2.
 +
-->
 
<head>
 
<head>
 
     <meta charset="UTF-8">
 
     <meta charset="UTF-8">
  
−
     <!-- CSS -->
+
      
−
     <link rel="stylesheet" type="text/css" href="https://2018.igem.org/wiki/index.php?title=Template:Fudan/CSS&action=raw&ctype=text/css" />
+
<!-- CSS -->
 +
     <link rel="stylesheet" type="text/css" href="https://2018.igem.org/wiki/index.php?title=Template:Fudan/css.css&action=raw&ctype=text/css" />
  
 
     <!-- Font-awesome icons 4.7.0 -->
 
     <!-- Font-awesome icons 4.7.0 -->
Line 19: Line 24:
  
 
         /** 清除内外边距 **/
 
         /** 清除内外边距 **/
−
         body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, /* structural elements 结构元素 */
+
         body, h1, h3, h3, h4, h5, h6, hr, p, blockquote, /* structural elements 结构元素 */
 
         dl, dt, dd, ul, ol, li, /* list elements 列表元素 */
 
         dl, dt, dd, ul, ol, li, /* list elements 列表元素 */
 
         pre, /* text formatting elements 文本格式元素 */
 
         pre, /* text formatting elements 文本格式元素 */
Line 29: Line 34:
  
 
         /** 设置默认字体 **/
 
         /** 设置默认字体 **/
−
       
+
 
−
         h1, h2, h3, h4, h5, h6 { font-size: 100%; }
+
         h1, h3, h3, h4, h5, h6 { font-size: 100%; }
 
         address, cite, dfn, em, var { font-style: normal; } /* 将斜体扶正 */
 
         address, cite, dfn, em, var { font-style: normal; } /* 将斜体扶正 */
 
         code, kbd, pre, samp { font-family: courier new, courier, monospace; } /* 统一等宽字体 */
 
         code, kbd, pre, samp { font-family: courier new, courier, monospace; } /* 统一等宽字体 */
Line 41: Line 46:
 
         a { text-decoration: none; }
 
         a { text-decoration: none; }
 
         a:hover { text-decoration: underline; }
 
         a:hover { text-decoration: underline; }
 +
  
 
         /** 重置表单元素 **/
 
         /** 重置表单元素 **/
Line 51: Line 57:
 
         table { border-collapse: collapse; border-spacing: 0; }
 
         table { border-collapse: collapse; border-spacing: 0; }
  
−
         /* 清除浮动 */
+
         /* wangyiheng init 2018-10-16 */
−
         .ks-clear:after, .clear:after {
+
         #animation_container{
−
             content: '\20';
+
             position:absolute;
−
             display: block;
+
             margin:0 auto;/* Tian Huang edited here */
−
             height: 0;
+
             left:0;right:0;
−
             clear: both;
+
             top:0;bottom:0;
 
         }
 
         }
−
         .ks-clear, .clear {
+
         #FudanBody #pageContent .section p{
−
             *zoom: 1;
+
            font-size: 25px;
 +
            line-height: 40px;
 +
            color: #60A9C2;
 +
            margin-top: 70px;
 +
            text-indent: 0;
 +
        }
 +
        #FudanBody .section img{
 +
            margin-top: 70px;
 +
        }
 +
        #FudanBody .highlight{
 +
            width: 20%;
 +
            height: auto;
 +
            float: left;
 +
            padding: 0.5%;
 +
            text-align: center;
 +
        }
 +
        #FudanBody .section .highlight img{
 +
            width: 100%;
 +
            margin-top: 0;
 +
        }
 +
        #highlight2 div,#highlight1 div{
 +
            margin-bottom: 150px;
 +
        }
 +
        @media only screen and (max-width: 991px){
 +
            #FudanBody #highlight1 .highlight{
 +
                width: 33%;margin: 0
 +
             }
 +
            #FudanBody #highlight2 .highlight{
 +
                width: 50%;
 +
            }
 +
            #highlight1{width:100%;}
 +
            #highlight2{width:66%;margin: 20px auto 0 auto;}
 
         }
 
         }
  
−
  /* wangyiheng init 2018-10-16 */
 
−
  #animation_container {
 
−
position:absolute;
 
−
margin:auto;
 
−
left:0;right:0;
 
−
top:0;bottom:0;
 
−
  }
 
 
     </style>
 
     </style>
−
<!-- init 2018-10-16 -->
+
    <!-- init 2018-10-16 -->
−
<script src="https://2018.igem.org/wiki/index.php?title=Template:Fudan/createjs20151126.js&action=raw&ctype=text/javascript"></script>
+
    <script src="https://2018.igem.org/wiki/index.php?title=Template:Fudan/createjs20151126.js&action=raw&ctype=text/javascript"></script>
−
<script src="https://2018.igem.org/wiki/index.php?title=Template:Fudan/mainpageDraw.js&action=raw&ctype=text/javascript"></script>
+
    <script src="https://2018.igem.org/wiki/index.php?title=Template:Fudan/mainpageDraw.js&action=raw&ctype=text/javascript"></script>
−
<!-- init 2018-10-16 -->
+
    <!-- init 2018-10-16 -->
 
</head>
 
</head>
 +
 
<body onload="init();">
 
<body onload="init();">
−
    <!-- Fudan div at igem.org -->
+
<!-- Fudan div at igem.org -->
−
    <div id="FudanWrapper" class="blue lighten-4">
+
<div id="FudanWrapper" class="white">
−
        <div id="FudanBody" class="blue lighten-4">
+
    <div id="FudanBody" class="white">
−
            <header>
+
        <header>
 +
            <!-- empty bar -->
 +
            <div id="emptyBar" style="position:relative;width: 100%;"></div>
  
−
                <!-- Navigation bar -->
+
            <!-- Navigation bar -->
−
                <nav class="blue darken-2">
+
            <nav id="topNav" class="white z-depth-0_5">
−
                    <div class="nav-wrapper">
+
                <div class="nav-wrapper">
−
                        <div id="teamLogo" class="brand-logo" style="height: inherit">
+
                    <div id="teamLogo" class="brand-logo">
−
                            <a href="https://2018.igem.org/Team:Fudan" style="height: inherit"><img class="" src="https://static.igem.org/mediawiki/2018/c/c6/T--Fudan--teamLogo.png" style="height: 100%;"></a>
+
                        <a href="https://2018.igem.org/Team:Fudan" target="_self"><img src="https://static.igem.org/mediawiki/2018/c/c4/T--Fudan--teamLogo.svg"></a>
−
                        </div>
+
−
                        <ul id="nav-mobile" class="right">
+
−
                            <li class="hide-on-med-and-down"><a class="dropdown-trigger" data-target="dropdown1" href="">Link <i class="fa fa-angle-down"></i></a></li>
+
−
                            <li class="hide-on-med-and-down"><a class="dropdown-trigger" data-target="dropdown2" href="">Link <i class="fa fa-angle-down"></i></a></li>
+
−
                            <li class="hide-on-med-and-down"><a class="dropdown-trigger" data-target="dropdown3" href="">Link <i class="fa fa-angle-down"></i></a></li>
+
−
                            <li>
+
−
                                <a id="navList" data-target="slide-out" class="waves-effect waves-light sidenav-trigger right">
+
−
                                    <i class="fa fa-navicon" style="font-size: 24px"></i>
+
−
                                </a>
+
−
                            </li>
+
−
                        </ul>
+
 
                     </div>
 
                     </div>
−
                 </nav>
+
                    <ul id="nav-mobile" class="right blueBorder">
 +
                        <li class="hide-on-med-and-down"><a class="dropdown-trigger" data-target="dropdown1">Project</a></li>
 +
                        <li class="hide-on-med-and-down"><a class="dropdown-trigger" data-target="dropdown2">Dry lab</a></li>
 +
                        <li class="hide-on-med-and-down"><a class="dropdown-trigger" data-target="dropdown3">Wet lab</a></li>
 +
                        <li class="hide-on-med-and-down"><a class="dropdown-trigger" data-target="dropdown4">Toolbox</a></li>
 +
                        <li class="hide-on-med-and-down"><a class="dropdown-trigger" data-target="dropdown5">Outreach</a></li>
 +
                        <li class="hide-on-med-and-down"><a class="dropdown-trigger" data-target="dropdown6">Team</a></li>
 +
                        <li>
 +
                            <a id="navList" data-target="slide-out" class="waves-effect waves-light sidenav-trigger right">
 +
                                <i class="fa fa-navicon" style="font-size: 24px"></i>
 +
                            </a>
 +
                        </li>
 +
                    </ul>
 +
                 </div>
 +
            </nav>
  
−
                <!-- Dropdown and List elements in navigation bar -->
+
            <!-- Dropdown and List elements in navigation bar -->
−
                <ul id="dropdown1" class="dropdown-content">
+
            <ul id="dropdown1" class="dropdown-content">
−
                    <li><a href="">one</a></li>
+
                <li><a href="https://2018.igem.org/Team:Fudan/Demonstrate">Demonstration</a></li>
−
                    <li><a href="">two</a></li>
+
                <li><a href="https://2018.igem.org/Team:Fudan/Results">Transmembrane logic</a></li>
−
                    <li class="divider"></li>
+
            </ul>
−
                    <li><a href="">three</a></li>
+
            <ul id="dropdown2" class="dropdown-content">
−
                 </ul>
+
                <li><a href="https://2018.igem.org/Team:Fudan/Addon#ribo">Addon: <sub>ENABLE</sub><sup>ribo</sup></a></li>
−
                <ul id="dropdown2" class="dropdown-content">
+
                 <li><a href="https://2018.igem.org/Team:Fudan/Addon#TALE">Addon: <sub>ENABLE</sub><sup>TALE</sup></a></li>
−
                    <li><a href="">one</a></li>
+
                <li><a href="https://2018.igem.org/Team:Fudan/Addon#T2">Addon: <sub>ENABLE</sub><sup>T2</sup></a></li>
−
                    <li><a href="">two</a></li>
+
                <li><a href="https://2018.igem.org/Team:Fudan/Model#Transcriptional_Amplifer">Model: transcriptional amplifer</a></li>
−
                    <li class="divider"></li>
+
                <li><a href="https://2018.igem.org/Team:Fudan/Model#War_Predictor">Model: war&nbsp;predictor</a></li>
−
                    <li><a href="">three</a></li>
+
                <li><a href="https://2018.igem.org/Team:Fudan/Software">Software</a></li>
−
                </ul>
+
            </ul>
−
                <ul id="dropdown3" class="dropdown-content">
+
            <ul id="dropdown3" class="dropdown-content">
−
                    <li><a href="">one</a></li>
+
                <li><a href="https://2018.igem.org/Team:Fudan/InterLab">iGEM interLab</a></li>
−
                    <li><a href="">two</a></li>
+
                <li><a href="https://2018.igem.org/Team:Fudan/Notebook">Our notebook</a></li>
−
                    <li class="divider"></li>
+
                <li><a href="https://2018.igem.org/Team:Fudan/Primers">Primers used</a></li>
−
                    <li><a href="">three</a></li>
+
                <li><a href="https://2018.igem.org/Team:Fudan/Protocols">Protocols</a></li>
−
                 </ul>
+
                 <li><a href="https://2018.igem.org/Team:Fudan/Safety">Safety</a></li>
−
                <ul id="slide-out" class="sidenav">
+
            </ul>
−
                    <li><div class="user-view">
+
            <ul id="dropdown4" class="dropdown-content">
−
                        <div class="background">
+
                <li><a href="https://2018.igem.org/Team:Fudan/Basic_Parts">Basic parts</a></li>
−
                            <img src="" style="width: 100%">
+
                <li><a href="https://2018.igem.org/Team:Fudan/Composite_Parts">Composite parts</a></li>
−
                        </div>
+
                <li><a href="https://2018.igem.org/Team:Fudan/Optimization">Optimization</a></li>
−
                        <a href=""><img class="circle" src=""></a>
+
                <li><a href="https://2018.igem.org/Team:Fudan/Parts_Collection">Parts collection</a></li>
−
                        <a href=""><span class="white-text name"></span></a>
+
                <li><a href="https://2018.igem.org/Team:Fudan/Improve">Parts improvement</a></li>
−
                        <a href=""><span class="white-text email"></span></a>
+
                <li><a href="https://2018.igem.org/Team:Fudan/Measurement">Quantification</a></li>
−
                    </div></li>
+
            </ul>
−
                    <li><a href=""></a></li>
+
            <ul id="dropdown5" class="dropdown-content">
−
                    <li><a href="">Second Link</a></li>
+
                <li><a href="https://2018.igem.org/Team:Fudan/Bio-Art">Bio-Art display</a></li>
−
                    <li><div class="divider"></div></li>
+
                <li><a href="https://2018.igem.org/Team:Fudan/Collaborations">Collaborations</a></li>
−
                    <li><a class="subheader">Subheader</a></li>
+
                <li><a href="https://2018.igem.org/Team:Fudan/Design_Intention">Design intention</a></li>
−
                    <li><a class="waves-effect" href="">Third Link With Waves</a></li>
+
                <li><a href="https://2018.igem.org/Team:Fudan/Human_Practices">Human practices</a></li>
−
                 </ul>
+
                <li><a href="https://2018.igem.org/Team:Fudan/Public_Engagement">Public engagement</a></li>
−
            </header>
+
            </ul>
−
             <main>
+
            <ul id="dropdown6" class="dropdown-content">
 +
                <li><a href="https://2018.igem.org/Team:Fudan/Acknowledgement">Acknowledgement</a></li>
 +
                <li><a href="https://2018.igem.org/Team:Fudan/Attributions">Attributions</a></li>
 +
                <li><a href="https://2018.igem.org/Team:Fudan/Heritage">Heritage</a></li>
 +
                <li><a href="https://2018.igem.org/Team:Fudan/Team">Members</a></li>
 +
                 <li><a href="https://2018.igem.org/Team:Fudan/Sponsors">Sponsors</a></li>
 +
             </ul>
  
−
                <!-- Homepage slider -->
+
            <!-- Slide-out navigator contents -->
−
                 <div id="homepageSlider" class="slider" style="width: 100%">
+
            <ul id="slide-out" class="sidenav">
−
                     <ul class="slides">
+
                 <li style="padding: 0"><div class="sidenavBanner">
 +
                    <div class="background">
 +
                    </div>
 +
                    <p style="width: 100%;text-align: center;font-size: 24px"><span class="white-text">ENABLE</span></p>
 +
                </div></li>
 +
                <li>
 +
                     <ul class="collapsible expandable">
 +
                        <li>Navigator on wiki</li>
 +
                        <li>
 +
                            <div class="collapsible-header">Project</div>
 +
                            <div class="collapsible-body">
 +
                                <ul>
 +
                                    <li><a href="https://2018.igem.org/Team:Fudan/Demonstrate">Demonstration</a></li>
 +
                                    <li><a href="https://2018.igem.org/Team:Fudan/Results">Transmembrane logic</a></li>
 +
                                </ul>
 +
                            </div>
 +
                        </li>
 
                         <li>
 
                         <li>
−
                             <!-- 5/58/T--Fudan--MainPageGIF_Half.gif @@ 0/06/T--Fudan--MainPageGIF.gif @@ 0/07/T--Fudan--mainpage2.gif-->
+
                             <div class="collapsible-header">Dry Lab</div>
 +
                            <div class="collapsible-body">
 +
                                <ul>
  
−
<div id="animation_container" style="background-color:rgba(255, 255, 255, 1.00); width:1920px; height:1080px">
+
                                    <li><a href="https://2018.igem.org/Team:Fudan/Addon#ribo">Addon: <sub>ENABLE</sub><sup>ribo</sup></a></li>
−
  <canvas id="canvas" width="1920" height="1080" style="position: absolute; display: block; background-color:rgba(255, 255, 255, 1.00);"></canvas>
+
                                    <li><a href="https://2018.igem.org/Team:Fudan/Addon#TALE">Addon: <sub>ENABLE</sub><sup>TALE</sup></a></li>
−
  <div id="dom_overlay_container" style="pointer-events:none; overflow:hidden; width:1920px; height:1080px; position: absolute; left: 0px; top: 0px; display: block;"></div>
+
                                    <li><a href="https://2018.igem.org/Team:Fudan/Addon#T2">Addon: <sub>ENABLE</sub><sup>T2</sup></a></li>
−
</div>
+
                                    <li><a href="https://2018.igem.org/Team:Fudan/Model#Transcriptional_Amplifer">Model: transcriptional amplifer</a></li>
−
 
+
                                    <li><a href="https://2018.igem.org/Team:Fudan/Model#War_Predictor">Model: war&nbsp;predictor</a></li>
−
                            <div class="caption center-align">
+
                                    <li><a href="https://2018.igem.org/Team:Fudan/Software">Software</a></li>
−
                                <h3>ENABLE</h3>
+
                                 </ul>
−
                                 <h5>Engineered, Across-membrane, Binary Logic in Eukaryotes</h5>
+
 
                             </div>
 
                             </div>
 
                         </li>
 
                         </li>
−
<!--
 
 
                         <li>
 
                         <li>
−
                             <img src="https://static.igem.org/mediawiki/2017/1/19/Welcome_banner_website.jpg">
+
                             <div class="collapsible-header">Wet Lab</div>
−
                            <div class="caption left-align">
+
                            <div class="collapsible-body">
−
                                <h3>ENABLE</h3>
+
                                <ul>
−
                                <h5>Engineered, Across-membrane, Binary Logic in Eukaryotes</h5>
+
                                    <li><a href="https://2018.igem.org/Team:Fudan/InterLab">iGEM interLab</a></li>
 +
                                    <li><a href="https://2018.igem.org/Team:Fudan/Notebook">Our notebook</a></li>
 +
                                    <li><a href="https://2018.igem.org/Team:Fudan/Primers">Primers used</a></li>
 +
                                    <li><a href="https://2018.igem.org/Team:Fudan/Protocols">Protocols</a></li>
 +
                                    <li><a href="https://2018.igem.org/Team:Fudan/Safety">Safety</a></li>
 +
                                </ul>
 
                             </div>
 
                             </div>
 
                         </li>
 
                         </li>
 
                         <li>
 
                         <li>
−
                             <img src="https://static.igem.org/mediawiki/2018/0/01/Main_page_welcome.png">
+
                             <div class="collapsible-header">Toolbox</div>
−
                            <div class="caption right-align">
+
                            <div class="collapsible-body">
−
                                <h3>ENABLE</h3>
+
                                <ul>
−
                                <h5>Engineered, Across-membrane, Binary Logic in Eukaryotes</h5>
+
                                    <li><a href="https://2018.igem.org/Team:Fudan/Basic_Parts">Basic parts</a></li>
 +
                                    <li><a href="https://2018.igem.org/Team:Fudan/Composite_Parts">Composite parts</a></li>
 +
                                    <li><a href="https://2018.igem.org/Team:Fudan/Optimization">Optimization</a></li>
 +
                                    <li><a href="https://2018.igem.org/Team:Fudan/Parts_Collection">Parts collection</a></li>
 +
                                    <li><a href="https://2018.igem.org/Team:Fudan/Improve">Parts improvement</a></li>
 +
                                    <li><a href="https://2018.igem.org/Team:Fudan/Measurement">Quantification</a></li>
 +
                                </ul>
 
                             </div>
 
                             </div>
 
                         </li>
 
                         </li>
 
                         <li>
 
                         <li>
−
                             <img src="https://static.igem.org/mediawiki/2017/1/19/Welcome_banner_website.jpg">
+
                             <div class="collapsible-header">Outreach</div>
−
                             <div class="caption center-align">
+
                            <div class="collapsible-body">
−
                                 <h3>ENABLE</h3>
+
                                <ul>
−
                                <h5>Engineered, Across-membrane, Binary Logic in Eukaryotes</h5>
+
                                    <li><a href="https://2018.igem.org/Team:Fudan/Bio-Art">Bio-Art display</a></li>
 +
                                    <li><a href="https://2018.igem.org/Team:Fudan/Collaborations">Collaborations</a></li>
 +
                                    <li><a href="https://2018.igem.org/Team:Fudan/Design_Intention">Design intention</a></li>
 +
                                    <li><a href="https://2018.igem.org/Team:Fudan/Human_Practices">Human practices</a></li>
 +
                                    <li><a href="https://2018.igem.org/Team:Fudan/Public_Engagement">Public engagement</a></li>
 +
                                </ul>
 +
                            </div>
 +
                        </li>
 +
                        <li>
 +
                             <div class="collapsible-header">Team</div>
 +
                            <div class="collapsible-body">
 +
                                 <ul>
 +
                                    <li><a href="https://2018.igem.org/Team:Fudan/Acknowledgement">Acknowledgement</a></li>
 +
                                    <li><a href="https://2018.igem.org/Team:Fudan/Attributions">Attributions</a></li>
 +
                                    <li><a href="https://2018.igem.org/Team:Fudan/Heritage">Heritage</a></li>
 +
                                    <li><a href="https://2018.igem.org/Team:Fudan/Team">Members</a></li>
 +
                                    <li><a href="https://2018.igem.org/Team:Fudan/Sponsors">Sponsors</a></li>
 +
                                </ul>
 
                             </div>
 
                             </div>
 
                         </li>
 
                         </li>
−
-->
 
 
                     </ul>
 
                     </ul>
−
                </div>
 
  
−
                 <!-- Divider separating slider and main content -->
+
                 </li>
−
                 <div id="homepageDivider" class="blue darken-2 z-depth-1"></div>
+
                 <li><div class="placeHolder"></div></li>
 +
            </ul>
 +
        </header>
  
−
                <div id="homepageContent">
+
        <div id="pageContent" style="">
−
                     <!-- Cards with information and links -->
+
            <main style="margin: 0">
 +
                <div style="position: relative;top:0;width: 100%;">
 +
                     <!-- 5/58/T--Fudan--MainPageGIF_Half.gif @@ 0/06/T--Fudan--MainPageGIF.gif @@ 0/07/T--Fudan--mainpage2.gif-->
  
−
                     <div class="row">
+
                     <div id="animation_container" style="position:relative;background-color:rgba(255, 255, 255, 1.00); width:1920px; height:1080px">
−
                         <!-- Horizontal Cards -->
+
                         <canvas id="canvas" width="1920" height="1080" style="position: relative;/* Tian Huang edited here */ display: block; background-color:rgba(255, 255, 255, 1.00);"></canvas>
−
<!--
+
                         <div id="dom_overlay_container" style="pointer-events:none; overflow:hidden; width:1920px; height:1080px; position: relative;/* Tian Huang edited here */ left: 0px; top: 0px; display: block;"></div>
−
                         <div class="col s12">
+
                    </div>
−
                            <div class="card horizontal hoverable">
+
                </div>
−
                                <div class="card-image">
+
                <div class="container">
−
                                    <img src="https://static.igem.org/mediawiki/2018/1/19/T--Fudan--schoolLogo.jpg" style="width: 200px;">
+
                    <div class="section container">
−
                                </div>
+
                        <h2 style="font-weight: 900;">ENABLE</h2>
−
                                <div class="card-stacked">
+
                        <p>To survive, cells must identify and integrate various signals from the environment. Cells utilize their transmembrane receptors to recognize extracellular signals to execute a myriad of tasks ranging from cell-mediated immunity to tissue formation and regeneration.
−
                                    <div class="card-content">
+
                        </p>
−
                                        <p class="flow-text">Project description: Our mammalian cells will be engineered to detect antigens on target cell membrane via an optimized version of the mouse Notch 1 receptor. This spacial signal will be integrated into binary boolean logic gates to determine different cell  behavior. This fundamental advancement has potential in therapeutics, artificial tissue engineering and so much more. We have started building genetic circuits.  </p>
+
                        <img style="width: 100%" src="https://static.igem.org/mediawiki/2018/6/6e/T--Fudan--111111.png">
−
                                    </div>
+
                        <p>
−
                                    <div class="card-action">
+
                            Therefore, in the field of synthetic biology, it would be especially impactful if cells could be programmed to recognize external environmental signals, generate contact-dependent signaling, and perform reliable logical computations.
−
                                        <a href="#">link</a>
+
                        </p>
−
                                    </div>
+
                        <img style="width: 100%" src="https://static.igem.org/mediawiki/2018/7/7a/T--Fudan--2222222.png">
−
                                </div>
+
                        <p>
−
                            </div>
+
                            Our project ENABLE (ENgineered, Across membrane, Binary Logic in Eukaryotes) offers the first toolbox for mammalian cells to generate contact-dependent signaling from the external environment and Boolean output decisions. We believe this is a foundational advance for synthetic biology, and enables a wide range of opportunities.
−
                        </div>
+
                        </p>
−
-->
+
                        <img style="width: 100%" src="https://static.igem.org/mediawiki/2018/7/71/T--Fudan--333333.png">
  
 +
                    </div>
 +
                    <div class="section" style="margin-bottom: 150px">
  
 +
                        <h2 style="font-weight: 900; margin-bottom: 10px;">Highlights</h2>
  
−
                        <!-- Simple Cards -->
 
  
−
                         <div class="col s12">
+
                         <div id="highlight1">
−
                             <div class="card hoverable white">
+
                             <div class="highlight">
−
                                 <div class="card-content">
+
                                 <a href="https://2018.igem.org/Team:Fudan/Demonstrate"><img src="https://static.igem.org/mediawiki/2018/6/65/T--Fudan--highlights_demonstration.png"></a>
−
                                    <span class="card-title">Our description</span>
+
                                Demonstration
−
                                    <p>Our mammalian cells will be engineered to detect antigens on target cell membrane via an optimized version of the mouse Notch 1 receptor. This spacial signal will be integrated into binary boolean logic gates to determine different cell behavior. This fundamental advancement has potential in therapeutics, artificial tissue engineering and so much more. We have started building genetic circuits.</p>
+
                            </div>
−
                                 </div>
+
                            <div class="highlight">
−
                                <div class="card-action">
+
                                <a href="https://2018.igem.org/Team:Fudan/Public_Engagement"><img src="https://static.igem.org/mediawiki/2018/0/02/T--Fudan--highlights_education.png"></a>
−
                                    <a href="">Link</a>
+
                                 Public engagement
−
                                </div>
+
                            </div>
 +
                            <div class="highlight">
 +
                                <a href="https://2018.igem.org/Team:Fudan/Model"><img src="https://static.igem.org/mediawiki/2018/b/b9/T--Fudan--highlights_model.png"></a>
 +
                                Model
 
                             </div>
 
                             </div>
 
                         </div>
 
                         </div>
−
 
+
                         <div id="highlight2">
−
                         <div class="col s12">
+
                             <div class="highlight">
−
                             <div class="card hoverable blue darken-2">
+
                                 <a href="https://2018.igem.org/Team:Fudan/Human_Practices"><img src="https://static.igem.org/mediawiki/2018/3/3b/T--Fudan--highlights_integrated.png"></a>
−
                                 <div class="card-content white-text">
+
                                 Human practices
−
                                    <span class="card-title">Welcome!</span>
+
−
                                    <p>We are still working on our wiki. You are free to contact us anytime!<br><i class="fa fa-envelope-o"></i> E-mail: igem@fudan.edu.cn</p>
+
−
                                </div>
+
−
                                <div class="card-action">
+
−
                                    <a href="#FudanFooter">Go to Footer</a>
+
−
                                 </div>
+
 
                             </div>
 
                             </div>
 +
                            <div class="highlight">
 +
                                <a href="https://2018.igem.org/Team:Fudan/Parts_Collection"><img src="https://static.igem.org/mediawiki/2018/e/e3/T--Fudan--highlights_parts.png"></a>
 +
                                Parts collection
 +
 
                         </div>
 
                         </div>
−
                       
+
                    </div>
  
  
  
−
                       
 
−
                <!-- Floating Btns -->
 
−
                <div id="toolBoxBtn" class="fixed-action-btn show-on-medium-and-down toolbar" style="display: none">
 
−
                    <a class="btn-floating btn-large blue darken-3 pulse">
 
−
                        <i class="fa fa-tasks" style="font-size: 28px;line-height: 56px"></i>
 
−
                    </a>
 
−
                    <ul>
 
−
                        <li><a class="waves-effect waves-light"><i class="fa fa-file-text-o"></i></a></li>
 
−
                        <li><a data-target="slide-out" class="waves-effect waves-light sidenav-trigger"><i class="fa fa-navicon"></i></a></li>
 
−
                        <li><a class="waves-effect waves-light" href="#FudanBody"><i class="fa fa-arrow-circle-up"></i></a></li>
 
−
                    </ul>
 
 
                 </div>
 
                 </div>
 +
            </main>
  
−
                <!--
+
 
−
                 <a id="toolBoxBtn_large" class="btn-floating btn-large blue darken-2" href="#FudanBody">
+
            <!--Abstract on content page-->
−
                     <i class="fa fa-tasks" style="font-size: 28px;line-height: 56px"></i>
+
            <div id="abstractContent" class="z-depth-2">
 +
                 <a href="#!"><img src="https://static.igem.org/mediawiki/2018/9/96/T--Fudan--X.svg"></a>
 +
                <div class="container">
 +
                    <h2 style="margin: 0;padding: 10px 0;">Abstract</h2>
 +
                    <p style="margin: 0">Contact-dependent signaling is critical for multicellular biological
 +
                            events, yet customizing contact-dependent signal transduction between
 +
                            cells remains challenging. Here we have developed the ENABLE toolbox, a
 +
                            complete set of transmembrane binary logic gates. Each gate consists of
 +
                            3 layers: Receptor, Amplifier, and Combiner. We first optimized synthetic
 +
                            Notch receptors to enable cells to respond to different signals across the
 +
                            membrane reliably. These signals, individually amplified intracellularly by
 +
                            transcription, are further combined for computing. Our engineered zinc finger-based
 +
                            transcription factors perform binary computation and output designed products.
 +
                            In summary, we have combined spatially different signals in mammalian cells,
 +
                            and revealed new potentials for biological oscillators, tissue engineering,
 +
                            cancer treatments, bio-computing, etc. ENABLE is a toolbox for constructing
 +
                            contact-dependent signaling networks in mammals. The 3-layer design principle
 +
                            underlying ENABLE empowers any future development of transmembrane logic circuits,
 +
                            thus contributes a foundational advance to Synthetic Biology.
 +
                    </p>
 +
                </div>
 +
            </div>
 +
 
 +
            <!-- Floating Btns -->
 +
            <div class="floatingBtn">
 +
                <a href="#!" id="abstractBtn" class="btn">
 +
                     <i class="fa fa-sticky-note" style="font-size: 30px;line-height: 50px"></i>
 
                 </a>
 
                 </a>
−
                <div class="tap-target" data-target="toolBoxBtn_large">
+
                 <a href="#top_menu_14" class="btn">
−
                    <div class="tap-target-content">
+
                     <i class="fa fa-angle-up" style="font-size: 48px;line-height: 45px"></i>
−
                        <h5>Title</h5>
+
−
                        <p>A bunch of text</p>
+
−
                    </div>
+
−
                </div>-->
+
−
                <!--
+
−
                 <a id="toolBoxBtn_large" class="btn blue darken-2">
+
−
                     <i class="fa fa-tasks" style="font-size: 28px;line-height: 56px"></i>
+
 
                 </a>
 
                 </a>
−
                <div class="tap-target" data-target="toolBoxBtn_large">
+
            </div>
−
                    <div class="tap-target-content">
+
−
 
+
−
                    </div>
+
−
                </div>-->
+
−
 
+
−
            </main>
+
  
 
             <!-- Footer with sponsors and contact methods -->
 
             <!-- Footer with sponsors and contact methods -->
−
             <footer id="FudanFooter" class="page-footer blue darken-2">
+
             <footer id="FudanFooter" class="page-footer grey">
 
                 <div class="container">
 
                 <div class="container">
 
                     <div class="row">
 
                     <div class="row">
−
                         <div class="col m5 s12 row">
+
                         <div id="sponsor" class="col m3 s12 row">
−
                             <div class="col s12">
+
                             <a href="https://2018.igem.org/Team:Fudan" target="_blank"><img class="col s3 m6 l3" style="position:relative; padding: 0 0.3rem; margin:-0.15rem 0; left: -0.45rem;" src="https://static.igem.org/mediawiki/2018/7/73/T--Fudan--teamLogoWhite.png">
−
                                <h3 class="white-text">Sponsors</h3>
+
                            </a><a href="http://www.fudan.edu.cn/en/" target="_blank"><img class="col s3 m6 l3" alt="Fudan University" src="https://static.igem.org/mediawiki/2018/f/f7/T--Fudan--schoolLogo.png">
−
                            </div>
+
                        </a><a href="http://life.fudan.edu.cn/" target="_blank"><img class="col s3 m6 l3" style="margin-bottom: 4%;/* 该图比其他小一点，排版需要 */" alt="School of Life Sciences, Fudan University" src="https://static.igem.org/mediawiki/2018/1/1d/T--Fudan--schoolOfLifeSciencesIcon.png">
−
                            <div class="sponsors col s6 m4">
+
                        </a><a href="http://www.yfc.cn/en/" target="_blank"><img class="col s3 m6 l3" style="padding: 0.15rem 0.9rem;" alt="Yunfeng Capital" src="https://static.igem.org/mediawiki/2018/e/e2/T--Fudan--yunfengLogo.png">
−
                                <div class="sponsorsImg">
+
                        </a>
−
                                    <img class="circle responsive-img" src="https://static.igem.org/mediawiki/2018/1/19/T--Fudan--schoolLogo.jpg">
+
                            <h3 class="col s12" style="text-align: left; color: rgba(255, 255, 255, 0.8); font-size: 18px">ENABLE: making cells even smarter</h3>
 +
                        </div>
 +
                        <div id="usefulLinks" class="col m9 s12 row">
 +
                            <div class="col s12 l6 row">
 +
                                <div class="col s12 m4">
 +
                                    <span>Project</span>
 +
                                    <ul>
 +
                                        <li><a href="https://2018.igem.org/Team:Fudan/Demonstrate">Demonstration</a></li>
 +
                                        <li><a href="https://2018.igem.org/Team:Fudan/Results">Transmembrane logic</a></li>
 +
                                        <li><a href="https://2017.igem.org/Team:Fudan">2017.iGEM</a></li>
 +
                                    </ul>
 
                                 </div>
 
                                 </div>
−
                                 <p class="grey-text text-lighten-4 center-align">Fudan University</p>
+
                                 <div class="col s12 m4">
−
                            </div>
+
                                    <span>Dry lab</span>
−
                            <div class="sponsors col s6 m4">
+
                                    <ul>
−
                                 <div class="sponsorsImg">
+
 
−
                                     <img class="responsive-img" src="https://static.igem.org/mediawiki/2018/e/e2/T--Fudan--yunfengLogo.png">
+
                                        <li><a href="https://2018.igem.org/Team:Fudan/Addon#ribo">Addon: <sub>ENABLE</sub><sup>ribo</sup></a></li>
 +
                                        <li><a href="https://2018.igem.org/Team:Fudan/Addon#TALE">Addon: <sub>ENABLE</sub><sup>TALE</sup></a></li>
 +
                                        <li><a href="https://2018.igem.org/Team:Fudan/Addon#T2">Addon: <sub>ENABLE</sub><sup>T2</sup></a></li>
 +
                                        <li><a href="https://2018.igem.org/Team:Fudan/Model#Transcriptional_Amplifer">Model: transcriptional amplifer</a></li>
 +
                                        <li><a href="https://2018.igem.org/Team:Fudan/Model#War_Predictor">Model: war&nbsp;predictor</a></li>
 +
                                        <li><a href="https://2018.igem.org/Team:Fudan/Software">Software</a></li>
 +
                                    </ul>
 +
                                </div>
 +
                                 <div class="col s12 m4">
 +
                                     <span>Wet lab</span>
 +
                                    <ul>
 +
                                        <li><a href="https://2018.igem.org/Team:Fudan/InterLab">iGEM interLab</a></li>
 +
                                        <li><a href="https://2018.igem.org/Team:Fudan/Notebook">Our notebook</a></li>
 +
                                        <li><a href="https://2018.igem.org/Team:Fudan/Primers">Primers used</a></li>
 +
                                        <li><a href="https://2018.igem.org/Team:Fudan/Protocols">Protocols</a></li>
 +
                                        <li><a href="https://2018.igem.org/Team:Fudan/Safety">Safety</a></li>
 +
                                    </ul>
 
                                 </div>
 
                                 </div>
−
                                <p class="grey-text text-lighten-4 center-align">Yunfeng Capital</p>
 
 
                             </div>
 
                             </div>
−
                             <div class="sponsors col s6 m4">
+
                             <div class="col s12 l6 row">
−
                                 <div class="sponsorsImg">
+
                                 <div class="col s12 m4">
−
                                     <img class="responsive-img" src="https://static.igem.org/mediawiki/2018/d/de/T--Fudan--snapGeneLogo.png">
+
                                     <span>Toolbox</span>
 +
                                    <ul>
 +
                                        <li><a href="https://2018.igem.org/Team:Fudan/Basic_Parts">Basic parts</a></li>
 +
                                        <li><a href="https://2018.igem.org/Team:Fudan/Composite_Parts">Composite parts</a></li>
 +
                                        <li><a href="https://2018.igem.org/Team:Fudan/Optimization">Optimization</a></li>
 +
                                        <li><a href="https://2018.igem.org/Team:Fudan/Parts_Collection">Parts collection</a></li>
 +
                                        <li><a href="https://2018.igem.org/Team:Fudan/Improve">Parts improvement</a></li>
 +
                                        <li><a href="https://2018.igem.org/Team:Fudan/Measurement">Quantification</a></li>
 +
                                    </ul>
 +
                                </div>
 +
                                <div class="col s12 m4">
 +
                                    <span>Outreach</span>
 +
                                    <ul>
 +
                                        <li><a href="https://2018.igem.org/Team:Fudan/Bio-Art">Bio-Art display</a></li>
 +
                                        <li><a href="https://2018.igem.org/Team:Fudan/Collaborations">Collaborations</a></li>
 +
                                        <li><a href="https://2018.igem.org/Team:Fudan/Design_Intention">Design intention</a></li>
 +
                                        <li><a href="https://2018.igem.org/Team:Fudan/Human_Practices">Human practices</a></li>
 +
                                        <li><a href="https://2018.igem.org/Team:Fudan/Public_Engagement">Public engagement</a></li>
 +
                                    </ul>
 +
                                </div>
 +
                                <div class="col s12 m4">
 +
                                    <span>Team</span>
 +
                                    <ul>
 +
                                        <li><a href="https://2018.igem.org/Team:Fudan/Acknowledgement">Acknowledgement</a></li>
 +
                                        <li><a href="https://2018.igem.org/Team:Fudan/Attributions">Attributions</a></li>
 +
                                        <li><a href="https://2018.igem.org/Team:Fudan/Heritage">Heritage</a></li>
 +
                                        <li><a href="https://2018.igem.org/Team:Fudan/Team">Members</a></li>
 +
                                        <li><a href="https://2018.igem.org/Team:Fudan/Sponsors">Sponsors</a></li>
 +
                                    </ul>
 
                                 </div>
 
                                 </div>
−
                                <p class="grey-text text-lighten-4 center-align">SnapGene</p>
 
 
                             </div>
 
                             </div>
−
                        </div>
 
−
                        <div class="col m6 offset-m1 s12 row">
 
−
                            <h5 class="white-text">Contact Us</h5>
 
−
                            <div class="col s6">
 
−
                                <ul class="contactUS">
 
−
                                    <li><i class="fa fa-envelope-o"></i> E-mail:<br>igem@fudan.edu.cn</li>
 
−
                                    <li><i class="fa fa-location-arrow"></i> Address:<br>E301, School of Life Sciences, Fudan University
 
−
                                        2005 Songhu Road, Yangpu, Shanghai, China</li>
 
−
                                </ul>
 
−
                            </div>
 
−
                            <div class="col s5 offset-s1">
 
−
                                <ul class="contactUS">
 
−
                                    <li>
 
−
                                        <i class="fa fa-wechat"></i> WeChat:<br><img class="responsive-img" src="https://static.igem.org/mediawiki/2018/a/af/T--Fudan--WeChatQR.jpg">
 
−
                                    </li>
 
−
                                </ul>
 
−
                            </div>
 
−
 
 
                         </div>
 
                         </div>
 
                     </div>
 
                     </div>
Line 320: Line 448:
 
                 <div class="footer-copyright">
 
                 <div class="footer-copyright">
 
                     <div class="container">
 
                     <div class="container">
−
                         Have a nice day!
+
                         <div class="contactUS row">
−
                        <a class="grey-text text-lighten-4 right" href="">More Links</a>
+
                            <div class="col s12 m6 l4"><i class="fa fa-location-arrow"></i> Life Sci Bldg E301, 2005 Songhu Rd, Shanghai
 +
                            </div><div class="col s12 m6 l3"><i class="fa fa-envelope-o"></i> igem@fudan.edu.cn
 +
                        </div><div class="col s12 m6 l2"><i class="fa fa-wechat"></i> Fudan_iGEM
 +
                        </div><div class="col s12 m6 l3"><i class="fa fa-fax"></i> +86-21-31246727
 +
                        </div>
 +
                        </div>
 
                     </div>
 
                     </div>
 
                 </div>
 
                 </div>
Line 328: Line 461:
 
         </div>
 
         </div>
 
     </div>
 
     </div>
 +
</div>
  
  
−
    <!-- Javascript files -->
+
<!-- Javascript files -->
−
    <!-- Materialize -->
+
−
    <script src="https://2018.igem.org/wiki/index.php?title=Template:Fudan/materialize.js&action=raw&ctype=text/javascript"></script>
+
  
−
    <!-- Javascript -->
+
<!-- Materialize 1.0.0-rc.2 -->
−
    <script type="text/javascript" src="https://2018.igem.org/Template:Fudan/JS?action=raw&ctype=text/javascript"></script>
+
<script src="https://2018.igem.org/wiki/index.php?title=Template:Fudan/materialize.js&action=raw&ctype=text/javascript"></script>
 +
 
 +
<!-- Javascript -->
 +
<script>
 +
    //Sidenav Init
 +
    $(function(){
 +
        $('.sidenav').sidenav({
 +
            edge:'right',
 +
            inDuration: 250,
 +
            outDuration: 350
 +
        });
 +
    });
 +
 
 +
    //Slider Init (Index Only)
 +
    $(function(){
 +
        $('.slider').slider({
 +
            height: 400
 +
        });
 +
    });
 +
 
 +
    //Dropdown Init
 +
    $(".dropdown-trigger").dropdown({
 +
        coverTrigger: false,
 +
        hover: true,
 +
        inDuration: 250,
 +
        outDuration: 350
 +
    });
 +
 
 +
    //Floating Btn Init
 +
    $(function(){
 +
        $('.fixed-action-btn').floatingActionButton();
 +
    });
 +
 
 +
    //Tabs Init
 +
    $(function(){
 +
        $('.tabs').tabs();
 +
    });
 +
 
 +
    $(function(){
 +
        $('.tap-target').tapTarget();
 +
    });
 +
 
 +
    //Collapsible Init
 +
    $(function(){
 +
        $('.collapsible').collapsible({});
 +
    });
 +
 
 +
    //ScrollSpy Init
 +
    $(function(){
 +
        $('.scrollspy').scrollSpy();
 +
    });
 +
 
 +
 
 +
 
 +
    //Init slide-out nav
 +
    $(function () {
 +
        $('#slide-out .collapsible-body').css('display','none');
 +
        $('#slide-out .collapsible li').removeClass('active');
 +
    });
 +
 
 +
    //Parallax Init
 +
    $(function(){
 +
        $('.parallax').parallax();
 +
    });
 +
 
 +
 
 +
    //Abstract on Content Page
 +
    var $abstractBtn=$("#abstractBtn");
 +
    var $abstractContentCloseBtn=$("#abstractContent > a:eq(0)");
 +
    var $abstractContent=$("#abstractContent");
 +
    $abstractBtn.click(function () {
 +
        $abstractContent.toggle();
 +
        $abstractContentCloseBtn.click(function () {
 +
            $abstractContent.css('display','none');
 +
        });
 +
    });
 +
 
 +
 
 +
    //Hide floating btn!
 +
    var $floatingBtn=$(".floatingBtn");
 +
    scrollTop=$(document).scrollTop();
 +
    function hideFloatingBtn(a) {
 +
        if(a<200){
 +
            $floatingBtn.fadeOut(200);
 +
        }
 +
        else{
 +
            $floatingBtn.fadeIn(200);
 +
        }
 +
    }
 +
    hideFloatingBtn(scrollTop);
 +
    $(document).on("scroll",function () {
 +
        scrollTop=$(document).scrollTop();
 +
        hideFloatingBtn(scrollTop);
 +
    });
 +
 
 +
 
 +
    //hide the nav
 +
    var $topNav=$("#topNav");
 +
    var footerHeight=$("#FudanFooter").height();
 +
    var pageHeight=$("#FudanWrapper").height();
 +
    scrollTop=$(document).scrollTop();
 +
    if(scrollTop>pageHeight-footerHeight-$(window).height() && $(window).width()>991){
 +
        $topNav.fadeOut(200);
 +
    }
 +
    else {
 +
        $topNav.fadeIn(200);
 +
    }
 +
    $(window).on("scroll",function () {
 +
        footerHeight=$("#FudanFooter").height();
 +
        pageHeight=$("#FudanWrapper").height();
 +
        scrollTop=$(document).scrollTop();
 +
        if(scrollTop>pageHeight-footerHeight-$(window).height() && $(window).width()>991){
 +
            $topNav.fadeOut(200);
 +
        }
 +
        else {
 +
            $topNav.fadeIn(200);
 +
        }
 +
    });
 +
</script>
  
 
</body>
 
</body>
 
</html>
 
</html>

Revision as of 01:07, 17 October 2018

ENABLE

To survive, cells must identify and integrate various signals from the environment. Cells utilize their transmembrane receptors to recognize extracellular signals to execute a myriad of tasks ranging from cell-mediated immunity to tissue formation and regeneration.

Therefore, in the field of synthetic biology, it would be especially impactful if cells could be programmed to recognize external environmental signals, generate contact-dependent signaling, and perform reliable logical computations.

Our project ENABLE (ENgineered, Across membrane, Binary Logic in Eukaryotes) offers the first toolbox for mammalian cells to generate contact-dependent signaling from the external environment and Boolean output decisions. We believe this is a foundational advance for synthetic biology, and enables a wide range of opportunities.

Highlights

Demonstration
Public engagement
Model
Human practices
Parts collection

Abstract

Contact-dependent signaling is critical for multicellular biological events, yet customizing contact-dependent signal transduction between cells remains challenging. Here we have developed the ENABLE toolbox, a complete set of transmembrane binary logic gates. Each gate consists of 3 layers: Receptor, Amplifier, and Combiner. We first optimized synthetic Notch receptors to enable cells to respond to different signals across the membrane reliably. These signals, individually amplified intracellularly by transcription, are further combined for computing. Our engineered zinc finger-based transcription factors perform binary computation and output designed products. In summary, we have combined spatially different signals in mammalian cells, and revealed new potentials for biological oscillators, tissue engineering, cancer treatments, bio-computing, etc. ENABLE is a toolbox for constructing contact-dependent signaling networks in mammals. The 3-layer design principle underlying ENABLE empowers any future development of transmembrane logic circuits, thus contributes a foundational advance to Synthetic Biology.