|
|
| (9 intermediate revisions by 4 users not shown) |
| Line 1: |
Line 1: |
| − | {{Fudan-TSI}} | + | {{Fudan-TSI}}<!-- jquery loaded by HQ 1.12.4 --> |
| − | <html> | + | <html></p></div></div></div><meta name="viewport" content="width=device-width, initial-scale=1"><meta charset="UTF-8"> |
| − | | + | <link rel="stylesheet" href="https://2019.igem.org/wiki/index.php?title=Template:Fudan-TSI/materialize.css&action=raw&ctype=text/css"> |
| − | | + | <link rel="stylesheet" href="https://2019.igem.org/wiki/index.php?title=Template:Fudan-TSI/Fudan-font-awesome.css&action=raw&ctype=text/css" /> |
| − | <script> | + | <link rel="stylesheet" type="text/css" href="https://2019.igem.org/wiki/index.php?title=Template:Fudan-TSI/Fudan-css.css&action=raw&ctype=text/css" /> |
| − | //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// | + | |
| − | | + | |
| − | $(document).ready(function() {
| + | |
| − | | + | |
| − | //remove the HQ_page id
| + | |
| − | $("#HQ_page").attr('id','');
| + | |
| − |
| + | |
| − | | + | |
| − | //highlight current page on the menu
| + | |
| − | highlight_current_page_menu();
| + | |
| − |
| + | |
| − | //accessing submenus
| + | |
| − | $(".menu_item").click(function(){
| + | |
| − | $(".submenu_control_icon", this).toggleClass("open");
| + | |
| − | $(this).next(".submenu").fadeToggle(400);
| + | |
| − | });
| + | |
| − |
| + | |
| − | //mobile menu access
| + | |
| − | $(".igem_2019_team_mobile_bar").click(function(){
| + | |
| − | $(this).next().toggleClass("displaying_menu");
| + | |
| − | });
| + | |
| − |
| + | |
| − | });
| + | |
| − | | + | |
| − | | + | |
| − | function highlight_current_page_menu() {
| + | |
| − |
| + | |
| − | var page_url="https://2019.igem.org/";
| + | |
| − | page_url = page_url + wgPageName;
| + | |
| − | $("a[href$='"+ page_url +"']").children().addClass("current_page");
| + | |
| − |
| + | |
| − | //if the page is in a submenu, open the submenu and make the appropiate changes
| + | |
| − | if( $( ".current_page" ).hasClass( "submenu_item" )){
| + | |
| − |
| + | |
| − | $(".current_page").parent().parent().fadeToggle(400);
| + | |
| − | $(".current_page").parent().parent().prev().addClass("current_page");
| + | |
| − | $(".menu_item.current_page > .submenu_control_icon").toggleClass("open");
| + | |
| − |
| + | |
| − | }
| + | |
| − | }
| + | |
| − | | + | |
| − | | + | |
| − | //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// | + | |
| − | </script>
| + | |
| − | | + | |
| − | | + | |
| | <style> | | <style> |
| − | /**************************************************************************************************************************************************************************************************/ | + | /*****************************************************************************/ |
| − | | + | |
| − | | + | |
| − | | + | |
| − | /**************************************************************************************************************************************************************************************************/
| + | |
| | /* DEFAULT WIKI SETTINGS */ | | /* DEFAULT WIKI SETTINGS */ |
| − | /**************************************************************************************************************************************************************************************************/ | + | /*****************************************************************************/ |
| − | | + | #home_logo, #sideMenu { display:none; } |
| − | | + | #sideMenu, #top_title, .patrollink { display:none; } |
| − | #home_logo, #sideMenu { display:none; }
| + | #content { margin-left: 0; padding:0px; width:100%;} |
| − | #sideMenu, #top_title, .patrollink {display:none;}
| + | .judges-will-not-evaluate { border: 4px solid #e4dede; padding: 2% !important; width: 92%!important; } |
| − | #content { margin-left:0px; margin-top:-7px; padding:0px; width:100%;}
| + | /* css clean * */ |
| − | #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
| + | #FudanTSIBody li { list-style: none; } |
| − | #bodyContent a[href ^="https://"], .link-https { padding-right:0px;}
| + | </style> |
| − |
| + | <title>Part Collection | 2019 iGEM Team:Fudan-TSI</title> |
| − |
| + | </head> |
| − | | + | <body> |
| − | | + | <div id="FudanTSIdivWrapper"><div id="FudanTSIBody"> |
| − | /**************************************************************************************************************************************************************************************************/
| + | <header> |
| − | /* MENU */
| + | <div id="emptyBar" style="position:relative;width: 100%;"></div><nav id="topNav" class="black z-depth-0_5"><div class="nav-wrapper"><div id="teamLogo" class="brand-logo"> <a href="/Team:Fudan-TSI" target="_self"><img alt="2019 team logo" src="https://static.igem.org/mediawiki/2019/d/d3/T--Fudan-TSI--HomepageLogo.gif"></a></div><ul id="nav-mobile" class="right"> |
| − | /**************************************************************************************************************************************************************************************************/
| + | <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">Results</a></li><li class="hide-on-med-and-down"><a class="dropdown-trigger" data-target="dropdown3">Model</a></li><li class="hide-on-med-and-down"><a class="dropdown-trigger" data-target="dropdown4">Parts</a></li><li class="hide-on-med-and-down"><a class="dropdown-trigger" data-target="dropdown5">Human practices</a></li><li class="hide-on-med-and-down"><a class="dropdown-trigger" data-target="dropdown6">Team</a></li> |
| − | | + | <li class="hide-on-med-and-down"><a href="/Team:Fudan-TSI/Judging">Judging</a></li> |
| − | /*wrapping for the menu*/
| + | <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> |
| − | .igem_2019_team_menu {
| + | <!-- Dropdown and List elements in navigation bar --> |
| − | background-color:#cecece;
| + | <ul id="dropdown1" class="dropdown-content"> |
| − | border-left: 1px solid #635d5d;
| + | <li><a href="/Team:Fudan-TSI/Description">Background</a></li> |
| − | float:right;
| + | <li><a href="/Team:Fudan-TSI/Design">Design</a></li> |
| − | height:100vh;
| + | <li><a href="/Team:Fudan-TSI/Experiments">Experiments</a></li> |
| − | max-width: 270px;
| + | <li><a href="/Team:Fudan-TSI/Applied_Design">Applied design</a></li> |
| − | overflow-y: auto;
| + | </ul> |
| − | overflow-x: hidden;
| + | <ul id="dropdown2" class="dropdown-content"> |
| − | padding:0px;
| + | <li><a href="/Team:Fudan-TSI/Demonstrate#ReverseTranscription">Reverse transcription</a></li> |
| − | position:fixed;
| + | <li><a href="/Team:Fudan-TSI/Demonstrate#Recombination">Recombination</a></li> |
| − | right:0%;
| + | <li><a href="/Team:Fudan-TSI/Demonstrate">Demonstration</a></li> |
| − | text-align:left;
| + | <li><a href="/Team:Fudan-TSI/Measurement">Measurement</a></li> |
| − | width: 15%;
| + | <li><a href="/Team:Fudan-TSI/Notebook">Notebook</a></li> |
| − | }
| + | </ul> |
| − | | + | <ul id="dropdown3" class="dropdown-content"> |
| − | /*controlling menu visibility*/
| + | <li><a href="/Team:Fudan-TSI/Model">Modeling</a></li> |
| − | .igem_2019_team_menu.displaying_menu{
| + | <li><a href="/Team:Fudan-TSI/Software">Software</a></li> |
| − | display:block;
| + | <li><a href="/Team:Fudan-TSI/Hardware">Hardware</a></li> |
| − | }
| + | </ul> |
| − | | + | <ul id="dropdown4" class="dropdown-content"> |
| − | /*links in the menu*/
| + | <li><a href="/Team:Fudan-TSI/Basic_Part">Basic parts</a></li> |
| − | .igem_2019_team_menu a {
| + | <li><a href="/Team:Fudan-TSI/Composite_Part">Composite parts</a></li> |
| − | color: #484848;
| + | <li><a href="/Team:Fudan-TSI/Improve">Part improvement</a></li> |
| − | text-decoration:none;
| + | <li><a href="/Team:Fudan-TSI/Part_Collection">Part collection</a></li> |
| − | }
| + | </ul> |
| − | | + | <ul id="dropdown5" class="dropdown-content"> |
| − | /*images in the menu*/
| + | <li><a href="/Team:Fudan-TSI/Public_Engagement">Public engagement</a></li> |
| − | .igem_2019_team_menu img {
| + | <li><a href="/Team:Fudan-TSI/Human_Practices#IntegratedHumanPractice">Integrated HP</a></li> |
| − | width:100%;
| + | <li><a href="/Team:Fudan-TSI/Collaborations">Collaborations</a></li> |
| − | }
| + | <li><a href="/Team:Fudan-TSI/Safety">Safety</a></li> |
| − | | + | </ul> |
| − | /*level 1 menu items*/
| + | <ul id="dropdown6" class="dropdown-content"> |
| − | .igem_2019_team_menu .menu_item {
| + | <li><a href="/Team:Fudan-TSI/Team">Members</a></li> |
| − | background-color: #cecece;
| + | <li><a href="/Team:Fudan-TSI/Attributions">Attributions</a></li> |
| − | border-bottom: 1px solid #635d5d;
| + | <li><a href="/Team:Fudan-TSI/Team#Acknowledge">Acknowledge</a></li> |
| − | clear: both;
| + | <li><a href="/Team:Fudan-TSI/Heritage">Heritage</a></li> |
| − | color: #484848;
| + | </ul> |
| − | cursor: pointer;
| + | |
| − | float: left;
| + | |
| − | font-size: 120%;
| + | |
| − | font-weight: bold;
| + | |
| − | padding: 15px 0px 15px 5%;
| + | |
| − | width: 100%;
| + | |
| − | }
| + | |
| − | | + | |
| − | /*level 1 menu items without submenus*/
| + | |
| − | .igem_2019_team_menu .menu_item.direct_link {
| + | |
| − | color: #484848;
| + | |
| − | padding-left: 15%;
| + | |
| − | }
| + | |
| − | | + | |
| − |
| + | |
| − | /*level 1 menu items on hover*/
| + | |
| − | .igem_2019_team_menu .menu_item:hover {
| + | |
| − | background-color: #ecb656 !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | /*icon for expanding and collapsing level 1 menut items*/
| + | |
| − | .igem_2019_team_menu .menu_item .submenu_control_icon {
| + | |
| − | color: #484848;
| + | |
| − | float: left;
| + | |
| − | width: 10%;
| + | |
| − | }
| + | |
| − | | + | |
| − | /* submenu icon "-"*/
| + | |
| − | .igem_2019_team_menu .menu_item .submenu_control_icon::before {
| + | |
| − | content: "+";
| + | |
| − | }
| + | |
| − | | + | |
| − | /* submenu icon "-"*/
| + | |
| − | .igem_2019_team_menu .menu_item .submenu_control_icon.open::before {
| + | |
| − | content: "-";
| + | |
| − | }
| + | |
| − | | + | |
| − |
| + | |
| − | /*level 2 menu (submenu) wrapper*/
| + | |
| − | .igem_2019_team_menu .submenu{
| + | |
| − | background-color: #ececec;
| + | |
| − | clear:both;
| + | |
| − | display:none;
| + | |
| − | float: left;
| + | |
| − | width:100%;
| + | |
| − | }
| + | |
| − | | + | |
| − | /*level 2 menu (submenu) item*/
| + | |
| − | .igem_2019_team_menu .submenu .submenu_item {
| + | |
| − | border-bottom: 1px solid #cecece;
| + | |
| − | color: #635d5d;
| + | |
| − | height: 30px;
| + | |
| − | float: left;
| + | |
| − | font-size: 110%;
| + | |
| − | font-weight: bold;
| + | |
| − | padding: 12px 0px 0px 15%;
| + | |
| − | width: 100%;
| + | |
| − | }
| + | |
| − | | + | |
| − | /*level 2 menu (submenu) items on hover*/
| + | |
| − | .igem_2019_team_menu .submenu .submenu_item:hover {
| + | |
| − | background-color: #ecb656 !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | /*color for highlighting current page on the wiki*/
| + | |
| − | .igem_2019_team_menu .submenu .submenu_item.current_page,
| + | |
| − | .igem_2019_team_menu .menu_item.current_page,
| + | |
| − | .igem_2019_team_menu .menu_item.direct_link.current_page {
| + | |
| − | background-color:#a2d3d0;
| + | |
| − | }
| + | |
| − | | + | |
| − | | + | |
| − | /*mobile menu bar styling*/ | + | |
| − | /**************************************************************************************************************************************************************************************************/ | + | |
| − | | + | |
| − | /*mobile bar that controls the menu*/
| + | |
| − | .igem_2019_team_mobile_bar {
| + | |
| − | background-color:#ececec;
| + | |
| − | border-bottom: 1px solid #cecece;
| + | |
| − | cursor:pointer;
| + | |
| − | display:none;
| + | |
| − | float:left;
| + | |
| − | margin-top: 0;
| + | |
| − | padding: 5px 0;
| + | |
| − | position:fixed;
| + | |
| − | width:100%;
| + | |
| − | }
| + | |
| − |
| + | |
| − | /*mobile logo*/
| + | |
| − | .igem_logo_mobile {
| + | |
| − | float:left;
| + | |
| − | padding-left: 5%;
| + | |
| − | width: 30%;
| + | |
| − | }
| + | |
| − | | + | |
| − | /*image within the mobile logo*/
| + | |
| − | .igem_logo_mobile img {
| + | |
| − | width:70px;
| + | |
| − | }
| + | |
| − |
| + | |
| − | /*mobile expand collapse button*/
| + | |
| − | .igem_menu_control_mobile {
| + | |
| − | float:right;
| + | |
| − | padding-right:5%;
| + | |
| − | padding-top:5px;
| + | |
| − | text-align:right;
| + | |
| − | width: 30%;
| + | |
| − | }
| + | |
| − | | + | |
| − | /*image for mobile expand collapse button*/
| + | |
| − | .igem_menu_control_mobile img {
| + | |
| − | width:25px;
| + | |
| − | }
| + | |
| − | | + | |
| − | | + | |
| − | /*add extra padding to the menu to improve mobile scrolling*/
| + | |
| − | .menu_padding{
| + | |
| − | float:left;
| + | |
| − | height:100px;
| + | |
| − | }
| + | |
| − | | + | |
| − | | + | |
| − | /**************************************************************************************************************************************************************************************************/
| + | |
| − | /* CONTENT OF THE PAGE */
| + | |
| − | /**************************************************************************************************************************************************************************************************/
| + | |
| − | | + | |
| − | /* general wrapper for the content */
| + | |
| − | .igem_2019_team_content {
| + | |
| − | background-color:white;
| + | |
| − | display:block;
| + | |
| − | width: 87%;
| + | |
| − | }
| + | |
| − | | + | |
| − | /* subwrapper to center content */
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper {
| + | |
| − | margin:auto;
| + | |
| − | max-width: 1400px;
| + | |
| − | width:90%;
| + | |
| − | }
| + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | /*general styling*/ | + | |
| − | /**************************************************************************************************************************************************************************************************/
| + | |
| − | | + | |
| − | /*size for title h tags*/
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper h1 { font-size: 210%;}
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper h2 { font-size: 190%;}
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper h3 { font-size: 170%;}
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper h4 { font-size: 150%;}
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper h5 { font-size: 140%;}
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper h6 { font-size: 130%;}
| + | |
| − | | + | |
| − | | + | |
| − | /*titles h1, h2*/
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper h1, .igem_2019_team_content .igem_2019_team_column_wrapper h2 {
| + | |
| − | border-bottom:0px;
| + | |
| − | color: white;
| + | |
| − | font-family: "Arial Black", Gadget, sans-serif;
| + | |
| − | padding: 10px 0px;
| + | |
| − | }
| + | |
| − | | + | |
| − | /*titles h3, h3, h5, h6 */
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper h3,
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper h4,
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper h5,
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper h6 {
| + | |
| − | border-bottom:0px;
| + | |
| − | color: white;
| + | |
| − | font-family: "Arial Black", Gadget, sans-serif;
| + | |
| − | padding: 5px 0px;
| + | |
| − | }
| + | |
| − | | + | |
| − | /* text p tag*/
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper p {
| + | |
| − | font-size: 130%;
| + | |
| − | font-family: Arial, Helvetica, sans-serif;
| + | |
| − | padding: 5px 0px;
| + | |
| − | text-align: left;
| + | |
| − | color: white;
| + | |
| − | }
| + | |
| − | | + | |
| − | /* Links a tag*/
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper a {
| + | |
| − | color: #00a19b;
| + | |
| − | font-weight: bold;
| + | |
| − | text-decoration: underline;
| + | |
| − | text-decoration-color:#00a19b;
| + | |
| − | 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;
| + | |
| − | }
| + | |
| − | | + | |
| − | /* hover for the links */
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper a:hover {
| + | |
| − | color: #085156;
| + | |
| − | text-decoration:none;
| + | |
| − | }
| + | |
| − | | + | |
| − | | + | |
| − | /* Table tag*/
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper table {
| + | |
| − | border: 1px solid #635d5d;
| + | |
| − | border-collapse: collapse;
| + | |
| − | font-size: 130%;
| + | |
| − | width: 100%;
| + | |
| − | }
| + | |
| − | | + | |
| − | /* table cells */
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper td {
| + | |
| − | border: 1px solid #cecece;
| + | |
| − | border-collapse: collapse;
| + | |
| − | font-size: 105%;
| + | |
| − | padding: 10px;
| + | |
| − | vertical-align: text-top;
| + | |
| − | }
| + | |
| − | | + | |
| − | /* table headers */
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper th {
| + | |
| − | background-color:#cecece;
| + | |
| − | border: 1px solid #635d5d;
| + | |
| − | border-collapse: collapse;
| + | |
| − | font-size: 110%;
| + | |
| − | padding: 10px;
| + | |
| − | vertical-align: text-top;
| + | |
| − | }
| + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | /* non numbered lists */
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper ul, .igem_2019_team_content .igem_2019_team_column_wrapper ol {
| + | |
| − | font-size: 130%;
| + | |
| − | font-family: Arial, Helvetica, sans-serif;
| + | |
| − | padding:0px 20px;
| + | |
| − | }
| + | |
| − | | + | |
| − | | + | |
| − | /*font sizing within list nesting*/
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper ul ul li, .igem_2019_team_content .igem_2019_team_column_wrapper ul ul ul li,
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper ul ol li, .igem_2019_team_content .igem_2019_team_column_wrapper ul ul ol li,
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper ol ol li, .igem_2019_team_content .igem_2019_team_column_wrapper ul ol ul li,
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper ol ul li, .igem_2019_team_content .igem_2019_team_column_wrapper ul ol ol li,
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper ol ul ul li, .igem_2019_team_content .igem_2019_team_column_wrapper ol ol ul li,
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper ol ol ol li, .igem_2019_team_content .igem_2019_team_column_wrapper ol ul ol li{ font-size: 76%; }
| + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | /*layout classes*/ | + | |
| − | /**************************************************************************************************************************************************************************************************/ | + | |
| − | | + | |
| − | /*main layout class */
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper .column {
| + | |
| − | float:left;
| + | |
| − | margin: 1% 2%;
| + | |
| − | padding: 0px;
| + | |
| − | }
| + | |
| − | | + | |
| − | /* 100% */
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper .column.full_size { width:96%; }
| + | |
| − | | + | |
| − | /* 66% */
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper .column.two_thirds_size { width: 62.6%; }
| + | |
| − | | + | |
| − | /* 33% */
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper .column.third_size { width: 29.3%; }
| + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | /*all images*/
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper .column.full_size img,
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper .column.two_thirds_size img,
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper .column.third_size img {
| + | |
| − | margin-bottom: 15px;
| + | |
| − | width: 100%;
| + | |
| − | }
| + | |
| − | | + | |
| − | | + | |
| − | /* page break */
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper .clear {
| + | |
| − | clear:both;
| + | |
| − | }
| + | |
| − | /*add extra space to page break with clear class*/
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper .clear.extra_space {
| + | |
| − | height: 30px;
| + | |
| − | }
| + | |
| − | | + | |
| − | /* horizontal line to divide the page*/
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper .line_divider {
| + | |
| − | border-top: 1px solid #cecece;
| + | |
| − | margin: auto;
| + | |
| − | width: 98%;
| + | |
| − | }
| + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − |
| + | |
| − | /*support classes*/ | + | |
| − | /**************************************************************************************************************************************************************************************************/ | + | |
| − | | + | |
| − | | + | |
| − | /*Button */
| + | |
| − | /************************************************/
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper .button_link {
| + | |
| − | font-size: 130%;
| + | |
| − | margin: 30px auto;
| + | |
| − | text-align: center;
| + | |
| − | }
| + | |
| − | | + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper .button_link a {
| + | |
| − | background-color: #00a19bad !important;
| + | |
| − | color: #000 !important;
| + | |
| − | font-weight: bold;
| + | |
| − | margin: auto;
| + | |
| − | text-decoration: none !important;
| + | |
| − | padding: 10px 15px !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper .button_link a:hover {
| + | |
| − | background-color: #ffb819 !important;
| + | |
| − | }
| + | |
| − | | + | |
| − |
| + | |
| − | | + | |
| − | /*highlight */
| + | |
| − | /************************************************/
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper .highlight {
| + | |
| − | padding: 15px 20px;
| + | |
| − | }
| + | |
| − | | + | |
| − | | + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper .highlight p,
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper .highlight h1,
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper .highlight h2,
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper .highlight h3,
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper .highlight h4,
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper .highlight h5,
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper .highlight h6 {
| + | |
| − | padding: 5px 15px;
| + | |
| − | }
| + | |
| − | | + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper .highlight.decoration_background {
| + | |
| − | background-color: #ececec;
| + | |
| − | }
| + | |
| − | | + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper .highlight.decoration_A_top {
| + | |
| − | border-top: 4px solid #00a19bad;
| + | |
| − | }
| + | |
| − | | + | |
| − | | + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper .highlight.decoration_A_full {
| + | |
| − | border: 4px solid #00a19bad;
| + | |
| − | }
| + | |
| − | | + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper .highlight.decoration_B_top {
| + | |
| − | border-top: 4px solid #ffb819
| + | |
| − | }
| + | |
| − | | + | |
| − | | + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper .highlight.decoration_B_full {
| + | |
| − | border: 4px solid #ffb819;
| + | |
| − | }
| + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | /*mobile*/ | + | |
| − | /**************************************************************************************************************************************************************************************************/ | + | |
| − | | + | |
| − | | + | |
| − | /* 1800px */
| + | |
| − | /************************************************/
| + | |
| − | @media only screen and (max-width: 1800px) {
| + | |
| − | .igem_2019_team_content { width: 85%;}
| + | |
| − | .igem_2019_team_menu {display:block;}
| + | |
| − |
| + | |
| − | }
| + | |
| − | | + | |
| − | /* 1400px */
| + | |
| − | /************************************************/
| + | |
| − | @media only screen and (max-width: 1400px) {
| + | |
| − | .igem_2019_team_menu .menu_item { font-size:100%;}
| + | |
| − | .igem_2019_team_menu .submenu .submenu_item { font-size:90%;}
| + | |
| − | .igem_2019_team_menu {display:block;}
| + | |
| − | }
| + | |
| − | | + | |
| − | | + | |
| − | /* 1100px */
| + | |
| − | /************************************************/
| + | |
| − | @media only screen and (max-width: 1100px) {
| + | |
| − | .igem_2019_team_content {width:100%; margin-left:0px;}
| + | |
| − |
| + | |
| − | .igem_2019_team_menu {display:none;float:right;margin-top:47px;max-width:100%;position:fixed;width:25%;}
| + | |
| − |
| + | |
| − | .igem_2019_team_mobile_bar {display:block;}
| + | |
| − |
| + | |
| − | .igem_2019_team_content .igem_2019_team_column_wrapper .column.full_size, .igem_2019_team_content .igem_2019_team_column_wrapper .column.two_thirds_size,.igem_2019_team_content .igem_2019_team_column_wrapper .column.third_size {width:96%; }
| + | |
| − | | + | |
| − | }
| + | |
| − | | + | |
| − | /* 850px */
| + | |
| − | /************************************************/
| + | |
| − | @media only screen and (max-width: 850px) {
| + | |
| − | .igem_2019_team_menu {width:40%;}
| + | |
| − | }
| + | |
| − | | + | |
| − | /*500px */
| + | |
| − | /************************************************/
| + | |
| − | @media only screen and (max-width: 500px) {
| + | |
| − | .igem_2019_team_menu {min-width:100%;width:100%;}
| + | |
| − | }
| + | |
| − | | + | |
| − | | + | |
| − | /**************************************************************************************************************************************************************************************************/ | + | |
| − | | + | |
| | | | |
| | | | |
| | + | <ul id="slide-out" class="sidenav"> |
| | + | <li style="padding: 0"><div class="sidenavBanner"> |
| | + | <div class="background"></div> |
| | + | <p class="flow-text" style="width:100%;text-align:center"><span class="white-text">Part Collection</span></p> |
| | + | </div></li> |
| | + | <li> |
| | + | <ul class="collapsible expandable"> |
| | + | <li class="onThisPageNav"><span>On this page</span></li> |
| | + | <li class="onThisPageNav"><a href="#section1">Overview</a></li> |
| | + | <li class="onThisPageNav"><a href="#section2">Reverse transcriptase</a></li> |
| | + | <li class="onThisPageNav"><a href="#section22">Chl<sup>R</sup> gene</a></li> |
| | + | <li class="onThisPageNav"><a href="#section3">RT initiation</a></li> |
| | + | <li class="onThisPageNav"><a href="#section4">Degradation tag</a></li> |
| | + | <li class="onThisPageNav"><a href="#section5">Cre recombinase</a></li> |
| | + | <li class="onThisPageNav"><a href="#section6">loxP sites</a></li> |
| | | | |
| | + | <li><span class="pageSidebar">Team: Fudan-TSI</span></li><li><div class="collapsible-header"><span class="pageSidebar">Project</span></div><div class="collapsible-body"><ul><li><a class="pageSidebar" href="/Team:Fudan-TSI/Description">Background</a></li><li><a class="pageSidebar" href="/Team:Fudan-TSI/Design">Design</a></li><li><a class="pageSidebar" href="/Team:Fudan-TSI/Experiments">Experiments</a></li><li><a class="pageSidebar" href="/Team:Fudan-TSI/Applied_Design">Applied design</a></li><li><a class="pageSidebar" href="/Team:Fudan-TSI/Judging">Judging</a></li></ul></div></li><li><div class="collapsible-header"><span class="pageSidebar">Results</span></div><div class="collapsible-body"><ul><li><a class="pageSidebar" href="/Team:Fudan-TSI/Demonstrate#ReverseTranscription">Reverse transcription</a></li><li><a class="pageSidebar" href="/Team:Fudan-TSI/Demonstrate#Recombination">Recombination</a></li><li><a class="pageSidebar" href="/Team:Fudan-TSI/Demonstrate">Demonstration</a></li><li><a class="pageSidebar" href="/Team:Fudan-TSI/Measurement">Measurement</a></li><li><a class="pageSidebar" href="/Team:Fudan-TSI/Notebook">Notebook</a></li></ul></div></li><li><div class="collapsible-header"><span class="pageSidebar">Model</span></div><div class="collapsible-body"><ul><li><a class="pageSidebar" href="/Team:Fudan-TSI/Model">Modeling</a></li><li><a class="pageSidebar" href="/Team:Fudan-TSI/Software">Software</a></li><li><a class="pageSidebar" href="/Team:Fudan-TSI/Hardware">Hardware</a></li></ul></div></li><li><div class="collapsible-header active"><span class="pageSidebar">Parts</span></div><div class="collapsible-body"><ul><li><a class="pageSidebar" href="/Team:Fudan-TSI/Basic_Part">Basic parts</a></li><li><a class="pageSidebar" href="/Team:Fudan-TSI/Composite_Part">Composite parts</a></li><li><a class="pageSidebar" href="/Team:Fudan-TSI/Improve">Part improvement</a></li><li><a class="pageSidebar" href="/Team:Fudan-TSI/Part_Collection">Part collection</a></li></ul></div></li><li><div class="collapsible-header"><span class="pageSidebar">Human practices</span></div><div class="collapsible-body"><ul><li><a class="pageSidebar" href="/Team:Fudan-TSI/Public_Engagement">Public engagement</a></li><li><a class="pageSidebar" href="/Team:Fudan-TSI/Human_Practices#IntegratedHumanPractice">Integrated HP</a></li><li><a class="pageSidebar" href="/Team:Fudan-TSI/Collaborations">Collaborations</a></li><li><a class="pageSidebar" href="/Team:Fudan-TSI/Safety">Safety</a></li></ul></div></li><li><div class="collapsible-header"><span class="pageSidebar">Team</span></div><div class="collapsible-body"><ul><li><a class="pageSidebar" href="/Team:Fudan-TSI/Team">Members</a></li><li><a class="pageSidebar" href="/Team:Fudan-TSI/Attributions">Attributions</a></li><li><a class="pageSidebar" href="/Team:Fudan-TSI/Heritage">Heritage</a></li></ul></div></li> |
| | + | </ul><!-- .expandable --> |
| | + | </li> |
| | + | <li><div class="placeHolder"></div></li> |
| | + | </ul> |
| | + | </header> |
| | | | |
| | + | <div id="pageContent"> |
| | + | <div id="contentBanner" class="figureBanner"> |
| | + | <div class="row"> |
| | + | <div class="col s12 hide-on-med-and-up"> |
| | + | <h1><br/>Part Collection</h1> |
| | + | <p class="flow-text">We provide a toolbox for <i>in vivo</i> site-specific continuous mutagenesis. Our part collection provides a complete set for assembly, test, and optimization of continuous mutagenesis in different prokaryotic hosts.</p> |
| | + | </div> |
| | + | </div> |
| | + | <div class="hide-on-small-only"> |
| | + | <style> |
| | + | #demo {width:100%;height:100%;position:relative;z-index:-100;} |
| | + | #demo svg {width:100%;height:100%;position:fixed;} |
| | + | #demo svg g {mix-blend-mode:lighten;} |
| | + | #demo svg polygon {stroke:none;fill:white;} |
| | </style> | | </style> |
| | + | <div id="pageCover"> |
| | + | <svg id="demo" viewBox="0 0 1600 600" preserveAspectRatio="xMidYMid slice"> |
| | + | <defs> |
| | + | <linearGradient id="grad1" x1="0" y1="0" x2="1" y2="0" color-interpolation="sRGB"> |
| | + | <stop id="stop1a" offset="0%" stop-color="#12a3b4"></stop> |
| | + | <stop id="stop1b" offset="100%" stop-color="#ff509e"></stop> |
| | + | </linearGradient> |
| | + | <linearGradient id="grad2" x1="0" y1="0" x2="1" y2="0" color-interpolation="sRGB"> |
| | + | <stop id="stop2a" offset="0%" stop-color="#e3bc13"></stop> |
| | + | <stop id="stop2b" offset="100%" stop-color="#00a78f"></stop> |
| | + | </linearGradient> |
| | + | </defs> |
| | + | <rect id="rect1" x="0" y="0" width="1600" height="600" stroke="none" fill="url(#grad1)"></rect> |
| | + | <rect id="rect2" x="0" y="0" width="1600" height="600" stroke="none" fill="url(#grad2)"></rect> |
| | + | </svg> |
| | + | </div><!-- #pageCover --> |
| | + | <script src="https://2019.igem.org/wiki/index.php?title=Template:Fudan-TSI/bkg&action=raw&ctype=text/javascript"></script> |
| | + | <script> |
| | + | ////////////////////////////// |
| | + | // Demo Functions |
| | + | ////////////////////////////// |
| | + | function bkgFunction(showStats) { |
| | + | // stats |
| | + | if (showStats) { |
| | + | var stats = new Stats(); |
| | + | stats.domElement.style.position = 'absolute'; |
| | + | stats.domElement.style.left = '0'; |
| | + | stats.domElement.style.top = '0'; |
| | + | document.body.appendChild(stats.domElement); |
| | + | requestAnimationFrame(function updateStats(){ |
| | + | stats.update(); |
| | + | requestAnimationFrame(updateStats); |
| | + | }); |
| | + | } |
| | + | // init |
| | + | var svg = document.getElementById('demo'); |
| | + | tesselation.setup(svg); |
| | + | gradients.setup(); |
| | + | var lastTransitionAt, transitionDelay = 10000, transitionDuration = 3000; |
| | + | function playNextTransition() { |
| | + | tesselation.next(transitionDuration); |
| | + | gradients.next(transitionDuration); |
| | + | }; |
| | + | function tick(time) { |
| | + | if (!lastTransitionAt || time - lastTransitionAt > transitionDelay) { |
| | + | lastTransitionAt = time; |
| | + | playNextTransition(); |
| | + | } |
| | + | window.requestAnimationFrame(tick); |
| | + | } |
| | + | window.requestAnimationFrame(tick); |
| | + | } |
| | + | ////////////////////////////// |
| | + | // Delaunay Triangulation |
| | + | ////////////////////////////// |
| | + | var calcDelaunayTriangulation = (function() { |
| | + | var EPSILON = 1.0 / 1048576.0; |
| | + | function getSuperT(vertices) { |
| | + | var xMin = Number.POSITIVE_INFINITY, yMin = Number.POSITIVE_INFINITY, |
| | + | xMax = Number.NEGATIVE_INFINITY, yMax = Number.NEGATIVE_INFINITY, |
| | + | i, xDiff, yDiff, maxDiff, xCenter, yCenter; |
| | + | for(i = vertices.length; i--; ) { |
| | + | if(vertices[i][0] < xMin) xMin = vertices[i][0]; |
| | + | if(vertices[i][0] > xMax) xMax = vertices[i][0]; |
| | + | if(vertices[i][1] < yMin) yMin = vertices[i][1]; |
| | + | if(vertices[i][1] > yMax) yMax = vertices[i][1]; |
| | + | } |
| | + | xDiff = xMax - xMin; |
| | + | yDiff = yMax - yMin; |
| | + | maxDiff = Math.max(xDiff, yDiff); |
| | + | xCenter = xMin + xDiff * 0.5; |
| | + | yCenter = yMin + yDiff * 0.5; |
| | + | return [ |
| | + | [xCenter - 20 * maxDiff, yCenter - maxDiff], |
| | + | [xCenter, yCenter + 20 * maxDiff], |
| | + | [xCenter + 20 * maxDiff, yCenter - maxDiff] |
| | + | ]; |
| | + | } |
| | + | function circumcircle(vertices, i, j, k) { |
| | + | var xI = vertices[i][0], yI = vertices[i][1], |
| | + | xJ = vertices[j][0], yJ = vertices[j][1], |
| | + | xK = vertices[k][0], yK = vertices[k][1], |
| | + | yDiffIJ = Math.abs(yI - yJ), yDiffJK = Math.abs(yJ - yK), |
| | + | xCenter, yCenter, m1, m2, xMidIJ, xMidJK, yMidIJ, yMidJK, xDiff, yDiff; |
| | + | // bail condition |
| | + | if(yDiffIJ < EPSILON){ |
| | + | if (yDiffJK < EPSILON){ |
| | + | throw new Error("Can't get circumcircle since all 3 points are y-aligned"); |
| | + | } |
| | + | } |
| | | | |
| | | | |
| − | <!------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
| + | // calc circumcircle center x/y, radius |
| − | <!--- THIS IS WHERE THE HTML BEGINS --->
| + | m1 = -((xJ - xI) / (yJ - yI)); |
| − | <!------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
| + | m2 = -((xK - xJ) / (yK - yJ)); |
| − | | + | xMidIJ = (xI + xJ) / 2.0; |
| − | <head>
| + | xMidJK = (xJ + xK) / 2.0; |
| − | | + | yMidIJ = (yI + yJ) / 2.0; |
| − | <!-- This tells the browser that your page is responsive -->
| + | yMidJK = (yJ + yK) / 2.0; |
| − | <meta name="viewport" content="width=device-width, initial-scale=1">
| + | xCenter = (yDiffIJ < EPSILON) ? xMidIJ : |
| − |
| + | (yDiffJK < EPSILON) ? xMidJK : |
| − | <script type="text/javascript" src="https://2019.igem.org/wiki/index.php?title=Template:Fudan-TSI/jQuery&action=raw&ctype=text/javascript"></script>
| + | (m1 * xMidIJ - m2 * xMidJK + yMidJK - yMidIJ) / (m1 - m2); |
| − |
| + | yCenter = (yDiffIJ > yDiffJK) ? |
| − |
| + | m1 * (xCenter - xMidIJ) + yMidIJ : |
| − |
| + | m2 * (xCenter - xMidJK) + yMidJK; |
| − | </head>
| + | xDiff = xJ - xCenter; |
| − | | + | yDiff = yJ - yCenter; |
| − | <link rel="stylesheet" href="https://2019.igem.org/wiki/index.php?title=Template:Fudan-TSI/Fudan-font-awesome.css&action=raw&ctype=text/css" />
| + | // return |
| − | | + | return {i: i, j: j, k: k, x: xCenter, y: yCenter, r: xDiff * xDiff + yDiff * yDiff}; |
| − | <!------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
| + | } |
| − | <!--- Menu --->
| + | function dedupeEdges(edges) { |
| − | <!------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
| + | var i, j, a, b, m, n; |
| − |
| + | for(j = edges.length; j; ) { |
| − | | + | b = edges[--j]; a = edges[--j]; |
| − | <style>
| + | for(i = j; i; ) { |
| − |
| + | n = edges[--i]; m = edges[--i]; |
| − | *{margin: 0;padding: 0;list-style: none;}
| + | if(a === m){ |
| − | /* via: https://blog.csdn.net/weixin_41014370/article/details/79523637 */
| + | if (b===n){ |
| − | | + | edges.splice(j, 2); edges.splice(i, 2); |
| − | /** 清除内外边距 **/
| + | break; |
| − | body, h1, h3, h3, h4, h5, h6, hr, p, blockquote, /* structural elements 结构元素 */
| + | } |
| − | dl, dt, dd, ul, ol, li, /* list elements 列表元素 */
| + | } |
| − | pre, /* text formatting elements 文本格式元素 */
| + | if(a === n){ |
| − | form, fieldset, legend, button, input, textarea, /* form elements 表单元素 */
| + | if (b===m){ |
| − | th, td /* table elements 表格元素 */ {
| + | edges.splice(j, 2); edges.splice(i, 2); |
| − | margin: 0;
| + | break; |
| − | padding: 0;
| + | } |
| − | }
| + | } |
| − | | + | } |
| − | /** 设置默认字体 **/
| + | } |
| − | | + | } |
| − | /* @@@@ h1, h3, h3, h4, h5, h6 { font-size: 100%; }*/
| + | return function(vertices) { |
| − | address, cite, dfn, em, var { font-style: normal; } /* 将斜体扶正 */
| + | var n = vertices.length, |
| − | code, kbd, pre, samp { font-family: courier new, courier, monospace; } /* 统一等宽字体 */
| + | i, j, indices, st, candidates, locked, edges, dx, dy, a, b, c; |
| − | /* @@@@ small { font-size: 12px; } /* 小于 12px 的中文很难阅读，让 small 正常化 */
| + | // bail if too few / too many verts |
| − | | + | if(n < 3 || n > 2000) |
| − | /** 重置列表元素 **/
| + | return []; |
| − | ul, ol { list-style: none; }
| + | // copy verts and sort indices by x-position |
| − | | + | vertices = vertices.slice(0); |
| − | /** 重置文本格式元素 **/
| + | indices = new Array(n); |
| − | a { text-decoration: none; }
| + | for(i = n; i--; ) |
| − | a:hover { text-decoration: underline; }
| + | indices[i] = i; |
| − | | + | indices.sort(function(i, j) { |
| − | | + | return vertices[j][0] - vertices[i][0]; |
| − | /** 重置表单元素 **/
| + | }); |
| − | legend { color: #000; } /* for ie6 */
| + | // supertriangle |
| − | fieldset, img { border: 0; } /* img 搭车：让链接里的 img 无边框 */
| + | st = getSuperT(vertices); |
| − | button, input, select, textarea { font-size: 100%; } /* 使得表单元素在 ie 下能继承字体大小 */
| + | vertices.push(st[0], st[1], st[2]); |
| − | /* 注：optgroup 无法扶正 */
| + | // init candidates/locked tris list |
| − | | + | candidates = [circumcircle(vertices, n + 0, n + 1, n + 2)]; |
| − | /** 重置表格元素 **/
| + | locked = []; |
| − | table { border-collapse: collapse; border-spacing: 0; }
| + | edges = []; |
| − |
| + | // scan left to right |
| − | </style>
| + | for(i = indices.length; i--; edges.length = 0) { |
| − | | + | c = indices[i]; |
| − | | + | // check candidates tris against point |
| − | | + | for(j = candidates.length; j--; ) { |
| − | | + | // lock tri if point to right of circumcirc |
| − | <!------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- Content begins --------------------------------------------------------------------------------------------------------------------------------->
| + | dx = vertices[c][0] - candidates[j].x; |
| − | <!---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
| + | if (dx > 0.0){ |
| − | | + | if(dx * dx > candidates[j].r){ |
| − |
| + | locked.push(candidates[j]); |
| − |
| + | candidates.splice(j, 1); |
| − |
| + | continue; |
| − |
| + | } |
| − |
| + | } |
| − | <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
| + | |
| − | <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
| + | |
| − |
| + | |
| − |
| + | |
| − | <link rel="stylesheet" href="https://2019.igem.org/wiki/index.php?title=Template:Fudan-TSI/materialize.css&action=raw&ctype=text/css">
| + | |
| − |
| + | |
| − | <style>
| + | |
| − |
| + | |
| − | body{
| + | |
| − | margin:0;
| + | |
| − | padding:0;
| + | |
| − | background-color:#08273a;
| + | |
| − | }
| + | |
| − | a{
| + | |
| − | text-decoration:none;
| + | |
| − | }
| + | |
| − | #global_wrapper{
| + | |
| − | width:100%;
| + | |
| − | height:auto;
| + | |
| − | margin:0;
| + | |
| − | position:absolute;
| + | |
| − | }
| + | |
| − | #navUl{
| + | |
| − | width:100%;
| + | |
| − | height:110px;
| + | |
| − | padding:40px 0 0 0;
| + | |
| − | overflow:visible;
| + | |
| − | position:fixed;
| + | |
| − | list-style:none;
| + | |
| − | z-index:999;
| + | |
| − | background-color:#08273a;
| + | |
| − | margin:0;
| + | |
| − | top:0;
| + | |
| − | }
| + | |
| − | #mobileNav{
| + | |
| − | width:100%;
| + | |
| − | height:80px;
| + | |
| − | padding:20px 0 0 0;
| + | |
| − | top:0;
| + | |
| − | background-color:#001d2a;
| + | |
| − | position:fixed;
| + | |
| − | display:none;
| + | |
| − | text-align:center;
| + | |
| − | z-index:999;
| + | |
| − | }
| + | |
| − | #mobileNav img{
| + | |
| − | display:none;
| + | |
| − | margin:0;
| + | |
| − | padding:0;
| + | |
| − | }
| + | |
| − | #mobileLogo{
| + | |
| − | display:inline-block;
| + | |
| − | }
| + | |
| − | #mobileControl{
| + | |
| − | float:right;
| + | |
| − | display:inline-block;
| + | |
| − | margin-right:15px;
| + | |
| − | margin-top:3px;
| + | |
| − | }
| + | |
| − | #mobileCtrl{
| + | |
| − | height:25px;
| + | |
| − | }
| + | |
| − | #mobileTeamName{
| + | |
| − | display:inline-block;
| + | |
| − | }
| + | |
| − | #navImg{
| + | |
| − | display:inline-block;
| + | |
| − | float:left;
| + | |
| − | height:70px;
| + | |
| − | width:auto;
| + | |
| − | position:relative;
| + | |
| − | margin-left:4%;
| + | |
| − | margin-top:0;
| + | |
| − | }
| + | |
| − | .logo{
| + | |
| − | height:55px;
| + | |
| − | width:auto;
| + | |
| − | margin-top:1.3%;
| + | |
| − | }
| + | |
| − | .teamname{
| + | |
| − | height:28px;
| + | |
| − | }
| + | |
| − | | + | |
| − | #navBar{
| + | |
| − | float:right;
| + | |
| − | position:relative;
| + | |
| − | width:auto;
| + | |
| − | display:inline-block;
| + | |
| − | margin-right:4%;
| + | |
| − | }
| + | |
| − | .navLi{
| + | |
| − | float:left;
| + | |
| − | display:inline-block;
| + | |
| − | margin-top:3%;
| + | |
| − | color:white;
| + | |
| − | font-size:20px;
| + | |
| − | position:relative;
| + | |
| − | margin-left:18px;
| + | |
| − | text-align:center;
| + | |
| − | font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, "sans-serif";
| + | |
| − | text-decoration:none;
| + | |
| − | }
| + | |
| − | .navA{
| + | |
| − | display:block;
| + | |
| − | text-align:center;
| + | |
| − | color:white;
| + | |
| − | text-decoration:none;
| + | |
| − | }
| + | |
| − | .navA2{
| + | |
| − | display:block;
| + | |
| − | overflow:visible;
| + | |
| − | color:white;
| + | |
| − | height:auto;
| + | |
| − | }
| + | |
| − | .ul2{
| + | |
| − | list-style:none;
| + | |
| − | position:absolute;
| + | |
| − | display:none;
| + | |
| − | overflow:hidden;
| + | |
| − | padding:10px 0 0 0 !important;
| + | |
| − | margin:0 !important;
| + | |
| − | font-size:17px;
| + | |
| − | left:50%;
| + | |
| − | transform:translateX(-50%);
| + | |
| − | border-bottom-left-radius: 10px;
| + | |
| − | border-bottom-right-radius: 10px;
| + | |
| − | background:linear-gradient(#08273a,rgba(0,138,201,1));
| + | |
| − | }
| + | |
| − | .li2{
| + | |
| − | padding:0;
| + | |
| − | margin:10px 20px;
| + | |
| − | text-align:center;
| + | |
| − | display:block;
| + | |
| − | }
| + | |
| − | .navA:link,.navA2:link{
| + | |
| − | text-decoration:none;
| + | |
| − | }
| + | |
| − | .navA:visited{
| + | |
| − | color:white;
| + | |
| − | }
| + | |
| − | .navA2:visited,.navA2:active{
| + | |
| − | color:white;
| + | |
| − | }
| + | |
| − | .navA:hover{
| + | |
| − | color:#7dded4;
| + | |
| − | }
| + | |
| − | .navA2:hover{
| + | |
| − | color:#7dded4;
| + | |
| − | }
| + | |
| − | .jqhover{
| + | |
| − | color:#7dded4;
| + | |
| − | }
| + | |
| − | .navA:hover{
| + | |
| − | text-decoration:none;
| + | |
| − | }
| + | |
| − | .navA:active{
| + | |
| − | text-decoration:none;
| + | |
| − | color:white;
| + | |
| − | }
| + | |
| − | | + | |
| − | </style>
| + | |
| − | | + | |
| − |
| + | |
| − | | + | |
| − |
| + | |
| − | <style>
| + | |
| − |
| + | |
| − | #pageContent{
| + | |
| − | margin:100px 0 0 0;
| + | |
| − | text-align:center;
| + | |
| − | }
| + | |
| − |
| + | |
| − | .row{
| + | |
| − | clear:both!important;
| + | |
| − | }
| + | |
| − | | + | |
| − | .title1{
| + | |
| − | font-size:2.3rem;
| + | |
| − | text-align:center;
| + | |
| − | color:white;
| + | |
| − | display:block;
| + | |
| − | margin-top:10%;
| + | |
| − | margin-bottom:7%;
| + | |
| − | line-height:110%;
| + | |
| − | }
| + | |
| − | .title2{
| + | |
| − | color:white;
| + | |
| − | text-align:left;
| + | |
| − | font-size:2rem;
| + | |
| − | line-height:130%;
| + | |
| − | display:block;
| + | |
| − | width:100%;
| + | |
| − | }
| + | |
| − | .title3{
| + | |
| − | font-size:1.4rem;
| + | |
| − | color:white;
| + | |
| − | text-align:left !important;
| + | |
| − | display:block;
| + | |
| − | width:100%;
| + | |
| − | line-height:110%;
| + | |
| − | padding-left:2%;
| + | |
| − | }
| + | |
| − | .para1{
| + | |
| − | color:white;
| + | |
| − | text-align:justify !important;
| + | |
| − | align-items:flex-start;
| + | |
| − | line-height:140%;
| + | |
| − | font-size:1.3rem;
| + | |
| − | margin-bottom:50px !important;
| + | |
| − | width:100%;
| + | |
| − | margin:auto 0;
| + | |
| − | }
| + | |
| − | .para1 a{
| + | |
| − | text-decoration:underline !important;
| + | |
| − | color:white;
| + | |
| − | }
| + | |
| − | .para1 a:visited, .para1 a:active{
| + | |
| − | color:white;
| + | |
| − | }
| + | |
| − | .para1 a:hover{
| + | |
| − | color:rgba(96,255,249,1.00)!important;
| + | |
| − | }
| + | |
| − | .content1{
| + | |
| − | margin:7% auto;
| + | |
| − | }
| + | |
| − | .pic2{
| + | |
| − | width:150%;
| + | |
| − | }
| + | |
| − | .reverseDiv{
| + | |
| − | position:relative !important;
| + | |
| − | float:right !important;
| + | |
| − | }
| + | |
| − | | + | |
| − |
| + | |
| − | .paraUl{
| + | |
| − | list-style-type:decimal !important;
| + | |
| − | list-style-position:outside;
| + | |
| − | padding-left:auto;
| + | |
| − | font-size:1rem;
| + | |
| − | }
| + | |
| − | .paraUl li{
| + | |
| − | padding-right:4% ;
| + | |
| − | }
| + | |
| − |
| + | |
| − |
| + | |
| − | #containerWithLeftNav{
| + | |
| − | display:block;
| + | |
| − | margin-left:25%;
| + | |
| − | }
| + | |
| − | .legend{
| + | |
| − | color:white;
| + | |
| − | text-align:center;
| + | |
| − | }
| + | |
| − | .legend>div{
| + | |
| − | width:100%;
| + | |
| − | text-align:justify!important;
| + | |
| − | font-size:1.1rem;
| + | |
| − | }
| + | |
| − | .legends{
| + | |
| − | margin:auto 15%;
| + | |
| − | }
| + | |
| − | | + | |
| − | | + | |
| − | </style>
| + | |
| − |
| + | |
| − | <style>
| + | |
| − |
| + | |
| − | @media only screen and (max-width:1200px){
| + | |
| − | #mobileBar{
| + | |
| − | margin-left:4%;
| + | |
| − | }
| + | |
| − | .navLi{
| + | |
| − | font-size:18px;
| + | |
| − | margin-top:3.5%;
| + | |
| − | }
| + | |
| − | }
| + | |
| − |
| + | |
| − |
| + | |
| − | @media only screen and (max-width:1100px){
| + | |
| − |
| + | |
| − | #navUl{
| + | |
| − | display:block;
| + | |
| − | float:right;
| + | |
| − | margin-top:0;
| + | |
| − | top:80px;
| + | |
| − | right:0;
| + | |
| − | background-color:rgba(0,0,0,0);
| + | |
| − | padding:0;
| + | |
| − | }
| + | |
| − |
| + | |
| − | #mobileNav{
| + | |
| − | display:block;
| + | |
| − | }
| + | |
| − |
| + | |
| − | #navImg{
| + | |
| − | display:none;
| + | |
| − | }
| + | |
| − |
| + | |
| − |
| + | |
| − | #navBar{
| + | |
| − | margin:0 1% 0 0;
| + | |
| − | padding-right:2%;
| + | |
| − | padding-left:1%;
| + | |
| − | position:relative;
| + | |
| − | display:none;
| + | |
| − | }
| + | |
| − |
| + | |
| − | #mobileNav img{
| + | |
| − | display:inline-block;
| + | |
| − | margin:5px 0;
| + | |
| − | padding:0;
| + | |
| − | }
| + | |
| − | #mobileControl{
| + | |
| − | margin-top:8px;
| + | |
| − | }
| + | |
| − | | + | |
| − | .logo{
| + | |
| − | height:45px;
| + | |
| − | margin-top:7px;
| + | |
| − | }
| + | |
| − | .navLi{
| + | |
| − | display:block;
| + | |
| − | position:relative;
| + | |
| − | float:right;
| + | |
| − | clear:both;
| + | |
| − | white-space:nowrap;
| + | |
| − | text-align:right;
| + | |
| − | margin:0;
| + | |
| − | height:60px;
| + | |
| − | width:100%;
| + | |
| − | background-color:#00324a;
| + | |
| − | }
| + | |
| − | .navA{
| + | |
| − | display:block;
| + | |
| − | text-align:right;
| + | |
| − | position:relative;
| + | |
| − | float:right;
| + | |
| − | padding:20px 20px !important;
| + | |
| − | }
| + | |
| − | .n2{
| + | |
| − | display:none;
| + | |
| − | width:0;
| + | |
| − | position:relative;
| + | |
| − | float:left;
| + | |
| − | text-align:right;
| + | |
| − | }
| + | |
| − | .ul2{
| + | |
| − | background:none;
| + | |
| − | padding-top:0;
| + | |
| − | background-color:#00557b;
| + | |
| − | text-align:right;
| + | |
| − | display:block;
| + | |
| − | position:relative;
| + | |
| − | float:right;
| + | |
| − | right:100%;
| + | |
| − | transform:translateX(0%);
| + | |
| − | top:0;
| + | |
| − | transform:translateY(1%);
| + | |
| − | border-radius:0 0 0 10px;
| + | |
| − | }
| + | |
| − | .open{
| + | |
| − | display:block;
| + | |
| − | }
| + | |
| − |
| + | |
| − | .title2{
| + | |
| − | font-size:1.8rem;
| + | |
| − | line-height:140%;
| + | |
| − | }
| + | |
| − | .para1{
| + | |
| − | font-size:1.3rem;
| + | |
| − | }
| + | |
| − | .pic2{
| + | |
| − | width:120%;
| + | |
| − | }
| + | |
| − |
| + | |
| − | .highlightIcon{
| + | |
| − | margin:20% auto 10% auto;
| + | |
| − | }
| + | |
| − | .highlightTitle{
| + | |
| − | margin-bottom:15%;
| + | |
| − | }
| + | |
| − | | + | |
| − |
| + | |
| − | }
| + | |
| − |
| + | |
| − |
| + | |
| − | @media only screen and (max-width:992px){
| + | |
| − |
| + | |
| − | #navUl{
| + | |
| − | display:block;
| + | |
| − | float:right;
| + | |
| − | margin:0;
| + | |
| − | top:80px;
| + | |
| − | right:0;
| + | |
| − | }
| + | |
| − |
| + | |
| − | #mobileNav{
| + | |
| − | display:block;
| + | |
| − | }
| + | |
| − |
| + | |
| − | #navImg{
| + | |
| − | display:none;
| + | |
| − | }
| + | |
| − |
| + | |
| − | #navTeamName{
| + | |
| − | display:none;
| + | |
| − | }
| + | |
| − |
| + | |
| − | #navBar{
| + | |
| − | margin:0 1% 0 0 ;
| + | |
| − | margin-right:2%;
| + | |
| − | padding-right:1%;
| + | |
| − | padding-left:1%;
| + | |
| − | position:relative;
| + | |
| − | display:none;
| + | |
| − | }
| + | |
| − | #mobileControl{
| + | |
| − | margin-top:10px;
| + | |
| − | }
| + | |
| − | #mobileNav img{
| + | |
| − | display:inline-block;
| + | |
| − | margin:5px 0;
| + | |
| − | padding:0;
| + | |
| − | }
| + | |
| − | .logo{
| + | |
| − | height:40px;
| + | |
| − | }
| + | |
| − | .navLi{
| + | |
| − | display:block;
| + | |
| − | position:relative;
| + | |
| − | float:right;
| + | |
| − | clear:both;
| + | |
| − | white-space:nowrap;
| + | |
| − | text-align:right;
| + | |
| − | height:60px;
| + | |
| − | width:100%;
| + | |
| − | }
| + | |
| − | .navA{
| + | |
| − | display:block;
| + | |
| − | text-align:right;
| + | |
| − | position:relative;
| + | |
| − | float:right;
| + | |
| − | font-size:15px;
| + | |
| − | }
| + | |
| − | .n2{
| + | |
| − | display:none;
| + | |
| − | width:0;
| + | |
| − | position:relative;
| + | |
| − | float:left;
| + | |
| − | }
| + | |
| − | .ul2{
| + | |
| − | font-size:13px;
| + | |
| − | }
| + | |
| − | .open{
| + | |
| − | display:block;
| + | |
| − | }
| + | |
| − |
| + | |
| − | | + | |
| − |
| + | |
| − | #animation_container{
| + | |
| − | display:none;
| + | |
| − | }
| + | |
| − | #teamLogo{
| + | |
| − | display:block;
| + | |
| − | }
| + | |
| − | | + | |
| − |
| + | |
| − | .title2{
| + | |
| − | font-size:1.5rem;
| + | |
| − | }
| + | |
| − | .para1{
| + | |
| − | font-size:1.2rem;
| + | |
| − | }
| + | |
| − | .pic2{
| + | |
| − | width:100%;
| + | |
| − | }
| + | |
| − | | + | |
| − |
| + | |
| − | }
| + | |
| − |
| + | |
| − |
| + | |
| − | @media only screen and (max-width:768px){
| + | |
| − | .col-md-4{
| + | |
| − | clear:both;
| + | |
| − | }
| + | |
| − | .col-md-8{
| + | |
| − | clear:both;
| + | |
| − | }
| + | |
| − | .pic2{
| + | |
| − | margin-bottom:10%;
| + | |
| − | width:80%;
| + | |
| − | }
| + | |
| − | .title2{
| + | |
| − | font-size:1.2rem;
| + | |
| − | }
| + | |
| − | .para1{
| + | |
| − | font-size:1rem;
| + | |
| − | }
| + | |
| − | .pic2{
| + | |
| − | width:80%;
| + | |
| − | }
| + | |
| − | #sponser img {
| + | |
| − | width:60%;
| + | |
| − | }
| + | |
| − |
| + | |
| − | #containerWithLeftNav{
| + | |
| − | margin-left:auto;
| + | |
| − | }
| + | |
| − |
| + | |
| − | }
| + | |
| − |
| + | |
| − | </style>
| + | |
| − | | + | |
| − |
| + | |
| − |
| + | |
| − | | + | |
| − | | + | |
| − | <style>
| + | |
| − | #footContainer{
| + | |
| − | width:90%;
| + | |
| − | }
| + | |
| − | #FudanFooter{
| + | |
| − | margin:auto 0;
| + | |
| − | width:100%;
| + | |
| − | padding:3% 0;
| + | |
| − | }
| + | |
| − | #FudanFooter #usefulLinks {
| + | |
| − | color: #cacaca;
| + | |
| − | padding-left: 1rem;
| + | |
| − | }
| + | |
| − | | + | |
| − | #FudanFooter #usefulLinks ul {
| + | |
| − | font-size: 13px;
| + | |
| − | line-height: 14px;
| + | |
| − | border-top: solid 2px;
| + | |
| − | color: inherit;
| + | |
| − | text-decoration: none;
| + | |
| − | padding-top: 5px;
| + | |
| − | margin:0;
| + | |
| − | }
| + | |
| − | | + | |
| − | #FudanFooter #usefulLinks div {
| + | |
| − | color: #cacaca;
| + | |
| − | }
| + | |
| − | | + | |
| − | #FudanFooter #usefulLinks div:hover {
| + | |
| − | color: white;
| + | |
| − | }
| + | |
| − | | + | |
| − | #FudanFooter #usefulLinks a {
| + | |
| − | color: inherit;
| + | |
| − | }
| + | |
| − | | + | |
| − | #FudanFooter #usefulLinks a:hover {
| + | |
| − | text-decoration: underline;
| + | |
| − | }
| + | |
| − | | + | |
| − | #FudanFooter #usefulLinks div.active,
| + | |
| − | #FudanFooter #usefulLinks div.active a {
| + | |
| − | color: white;
| + | |
| − | }
| + | |
| − | | + | |
| − | #FudanFooter #usefulLinks div.active ul {
| + | |
| − | border-top: solid white 2px;
| + | |
| − | }
| + | |
| − | | + | |
| − | #FudanFooter #usefulLinks li {
| + | |
| − | padding: 3px 0 6px 3px;
| + | |
| − | list-style:none;
| + | |
| − | }
| + | |
| − | | + | |
| − | #usefulLinks span {
| + | |
| − | font-size: 20px;
| + | |
| − | }
| + | |
| − |
| + | |
| − | | + | |
| − | #FudanFooter div.footer-copyright {
| + | |
| − | font-size: 13px;
| + | |
| − | line-height: 15px;
| + | |
| − | }
| + | |
| − | .footerUl{
| + | |
| − | margin:2% 4%;
| + | |
| − | }
| + | |
| − | </style>
| + | |
| − | | + | |
| − | <script>
| + | |
| − |
| + | |
| − | $(document).ready(function(){
| + | |
| − |
| + | |
| − |
| + | |
| − | var winWidth=$(window).width();
| + | |
| − |
| + | |
| − | if (winWidth>1100){
| + | |
| − | $(".navA").mouseenter(function(){
| + | |
| − | $(this).parent().find(".ul2").stop().fadeIn(400);
| + | |
| − | });
| + | |
| − | $(".navLi").mouseleave(function(){
| + | |
| − | $(this).find(".ul2").stop().fadeOut(400);
| + | |
| − | });
| + | |
| − |
| + | |
| − |
| + | |
| − | }
| + | |
| − | else{
| + | |
| − | $(".navA:not(.noSubmenu)").removeAttr("href");
| + | |
| − | $("#mobileNav").click(function(){
| + | |
| − | $("#navBar").toggle();
| + | |
| − | });
| + | |
| − | $(document).click(function(event){
| + | |
| − | var m = $("#mobileNav,#navBar");
| + | |
| − | if (!m.is(event.target)){
| + | |
| − | if (m.has(event.target).length===0){
| + | |
| − | $("#navBar").hide();
| + | |
| − | $(".open").parent().find(".navA").css("color","white");
| + | |
| − | $(".open").removeClass("open");
| + | |
| − | }
| + | |
| − | | + | |
| − | }
| + | |
| − | });
| + | |
| − | $(".navLi").click(function(){
| + | |
| − | if ($(this).find(".n2").hasClass("open")){
| + | |
| − | $(".open").parent().find(".navA").css("color","white");
| + | |
| − | $(this).find(".n2").removeClass("open");
| + | |
| − | }
| + | |
| − | else{
| + | |
| − | $(".open").parent().find(".navA").css("color","white");
| + | |
| − | $(".open").removeClass("open");
| + | |
| − | $(this).find(".n2").addClass("open");
| + | |
| − | $(this).find(".navA").css("color","#7dded4");
| + | |
| − | }
| + | |
| − | });
| + | |
| − | }
| + | |
| − |
| + | |
| − |
| + | |
| − |
| + | |
| − |
| + | |
| − |
| + | |
| − |
| + | |
| − | });
| + | |
| − |
| + | |
| − |
| + | |
| − | </script>
| + | |
| − |
| + | |
| − |
| + | |
| − |
| + | |
| − | <div id="global_wrapper">
| + | |
| − | <div id="mobileNav">
| + | |
| − |
| + | |
| − | <div id="mobileLogo"><img src="https://static.igem.org/mediawiki/2019/d/d3/T--Fudan-TSI--HomepageLogo.gif" class="logo"></div>
| + | |
| − | <div id="mobileControl"><img src="https://static.igem.org/mediawiki/2019/thumb/a/ae/T--Fudan-TSI--mobileCtrl.gif/683px-T--Fudan-TSI--mobileCtrl.gif" id="mobileCtrl"></div>
| + | |
| − |
| + | |
| − | </div>
| + | |
| − |
| + | |
| − | <ul id="navUl">
| + | |
| − |
| + | |
| − | <li id="navImg">
| + | |
| − | <img src="https://static.igem.org/mediawiki/2019/d/d3/T--Fudan-TSI--HomepageLogo.gif" class="logo">
| + | |
| − |
| + | |
| − | </li>
| + | |
| − |
| + | |
| − |
| + | |
| − | <ul id="navBar">
| + | |
| − |
| + | |
| − | <li class="navLi"><a class="navA noSubmenu" href="https://2019.igem.org/Team:Fudan-TSI">Home</a></li>
| + | |
| − |
| + | |
| − | <li class="navLi">
| + | |
| − | <a class="navA" href="https://2019.igem.org/Team:Fudan-TSI/Description">Project</a>
| + | |
| − | <div class="n2">
| + | |
| − | <ul class="ul2">
| + | |
| − | <li class="li2"><a class="navA2" href="https://2019.igem.org/Team:Fudan-TSI/Description">Description</a></li>
| + | |
| − | <li class="li2"><a class="navA2" href="https://2019.igem.org/Team:Fudan-TSI/Design">Design</a></li>
| + | |
| − | <li class="li2"><a class="navA2" href="https://2019.igem.org/Team:Fudan-TSI/Design" style="white-space:nowrap">Applied Design</a></li>
| + | |
| − | <li class="li2"><a class="navA2" href="https://2019.igem.org/Team:Fudan-TSI/Experiment">Experiment</a></li>
| + | |
| − | </ul>
| + | |
| − | </div>
| + | |
| − | </li>
| + | |
| − |
| + | |
| − | <li class="navLi">
| + | |
| − | <a class="navA" href="https://2019.igem.org/Team:Fudan-TSI/Results">Results</a>
| + | |
| − | <div class="n2">
| + | |
| − | <ul class="ul2">
| + | |
| − | <li class="li2"><a class="navA2" href="https://2019.igem.org/Team:Fudan-TSI/Results/Reverse_Transcription">Reverse Transcription</a></li>
| + | |
| − | <li class="li2"><a class="navA2" href="https://2019.igem.org/Team:Fudan-TSI/Results/Recombination">Recombination</a></li>
| + | |
| − | <li class="li2"><a class="navA2" href="https://2019.igem.org/Team:Fudan-TSI/Demonstrate">Demonstration</a></li>
| + | |
| − | <li class="li2"><a class="navA2" href="https://2019.igem.org/Team:Fudan-TSI/Measurement">Measurement</a></li>
| + | |
| − | <li class="li2"><a class="navA2" href="https://2019.igem.org/Team:Fudan-TSI/Notebook">Notebook</a></li>
| + | |
| − | </ul>
| + | |
| − | </div>
| + | |
| − | </li>
| + | |
| − |
| + | |
| − | <li class="navLi">
| + | |
| − | <a class="navA" href="https://2019.igem.org/Team:Fudan-TSI/Model_Software">Model</a>
| + | |
| − | <div class="n2">
| + | |
| − | <ul class="ul2">
| + | |
| − | <li class="li2"><a class="navA2" href="https://2019.igem.org/Team:Fudan-TSI/Model">Modeling</a></li>
| + | |
| − | <li class="li2"><a class="navA2" href="https://2019.igem.org/Team:Fudan-TSI/Software">Software</a></li>
| + | |
| − | </ul>
| + | |
| − | </div>
| + | |
| − | </li>
| + | |
| − |
| + | |
| − | <li class="navLi">
| + | |
| − | <a class="navA" href="https://2019.igem.org/Team:Fudan-TSI/Parts">Parts</a>
| + | |
| − | <div class="n2">
| + | |
| − | <ul class="ul2">
| + | |
| − | <li class="li2"><a class="navA2" style="white-space:nowrap;" href="https://2019.igem.org/Team:Fudan-TSI/Basic_Part">Basic Parts</a></li>
| + | |
| − | <li class="li2"><a class="navA2" style="white-space:nowrap;" href="https://2019.igem.org/Team:Fudan-TSI/Composite_Part">Composite Parts</a></li>
| + | |
| − | <li class="li2"><a class="navA2" style="white-space:nowrap;" href="https://2019.igem.org/Team:Fudan-TSI/Improve">Improved Parts</a></li>
| + | |
| − | <li class="li2"><a class="navA2" style="white-space:nowrap;" href="https://2019.igem.org/Team:Fudan-TSI/Part_Collection">Part Collection</a></li>
| + | |
| − | </ul>
| + | |
| − | </div>
| + | |
| − | </li>
| + | |
| − |
| + | |
| − | <li class="navLi">
| + | |
| − | <a class="navA" href="https://2019.igem.org/Team:Fudan-TSI/Human_Practices">Human Practices</a>
| + | |
| − | <div class="n2">
| + | |
| − | <ul class="ul2">
| + | |
| − | <li class="li2"><a class="navA2" style="white-space:nowrap;" href="https://2019.igem.org/Team:Fudan-TSI/Public_Engagement">Education & <br />Public Engagement</a></li>
| + | |
| − | <li class="li2"><a class="navA2" style="white-space:nowrap;" href="https://2019.igem.org/Team:Fudan-TSI/Integrated_Human_Practice">Integrated <br />Human Practice</a></li>
| + | |
| − | <li class="li2"><a class="navA2" href="https://2019.igem.org/Team:Fudan-TSI/Collaborations">Collaboration</a></li>
| + | |
| − | <li class="li2"><a class="navA2" href="https://2019.igem.org/Team:Fudan-TSI/Safety">Safety</a></li>
| + | |
| − | </ul>
| + | |
| − | </div>
| + | |
| − | </li>
| + | |
| − |
| + | |
| − | <li class="navLi">
| + | |
| − | <a class="navA" href="https://2019.igem.org/Team:Fudan-TSI/Team">Team</a>
| + | |
| − | <div class="n2">
| + | |
| − | <ul class="ul2">
| + | |
| − | <li class="li2"><a class="navA2" style="white-space:nowrap;" href="https://2019.igem.org/Team:Fudan-TSI/Team">Team Members</a></li>
| + | |
| − | <li class="li2"><a class="navA2" href="https://2019.igem.org/Team:Fudan-TSI/Team/Attribution">Attribution</a></li>
| + | |
| − | </ul>
| + | |
| − | </div>
| + | |
| − | </li>
| + | |
| − |
| + | |
| − | <li class="navLi"><a class="navA noSubmenu" href="https://igem.org/2019_Judging_Form?id=3257">Judging</a></li>
| + | |
| − |
| + | |
| − | </ul>
| + | |
| − |
| + | |
| − |
| + | |
| − | </ul>
| + | |
| − | | + | |
| − | <!----------------------------------------------------------------------------------------------------------------------------------------->
| + | |
| − | <!---- Cover ---->
| + | |
| − | <!----------------------------------------------------------------------------------------------------------------------------------------->
| + | |
| − |
| + | |
| − | <div id="pageCover">
| + | |
| − |
| + | |
| − | <script type="text/javascript" src="https://2019.igem.org/wiki/index.php?title=Template:Fudan-TSI/bkg&action=raw&ctype=text/javascript"></script>
| + | |
| − | <script>
| + | |
| − | $(document).ready(function($){
| + | |
| − | var $root = $('html, body');
| + | |
| − | $('a[href^="#"]').click(function() {
| + | |
| − | var href = $.attr(this, 'href');
| + | |
| − | $root.animate({
| + | |
| − | scrollTop: $(href).offset().top
| + | |
| − | }, 1000, function () {
| + | |
| − | window.location.hash = href;
| + | |
| − | });
| + | |
| − | return false;
| + | |
| − | });
| + | |
| − | })
| + | |
| − | </script>
| + | |
| − |
| + | |
| − | <svg id="demo" viewBox="0 0 1600 600" preserveAspectRatio="xMidYMid slice" style="z-index: -100;">
| + | |
| − | <defs>
| + | |
| − | <linearGradient id="grad1" x1="0" y1="0" x2="1" y2="0" color-interpolation="sRGB">
| + | |
| − | <stop id="stop1a" offset="0%" stop-color="#12a3b4"></stop>
| + | |
| − | <stop id="stop1b" offset="100%" stop-color="#ff509e"></stop>
| + | |
| − | </linearGradient>
| + | |
| − | <linearGradient id="grad2" x1="0" y1="0" x2="1" y2="0" color-interpolation="sRGB">
| + | |
| − | <stop id="stop2a" offset="0%" stop-color="#e3bc13"></stop>
| + | |
| − | <stop id="stop2b" offset="100%" stop-color="#00a78f"></stop>
| + | |
| − | </linearGradient>
| + | |
| − | </defs>
| + | |
| − | <rect id="rect1" x="0" y="0" width="1600" height="600" stroke="none" fill="url(#grad1)"></rect>
| + | |
| − | <rect id="rect2" x="0" y="0" width="1600" height="600" stroke="none" fill="url(#grad2)"></rect>
| + | |
| − | </svg>
| + | |
| − | <div id="demoCover"><img id="coverPic" src="https://static.igem.org/mediawiki/2019/d/da/T--Fudan-TSI--coverPartCollection.gif"></div>
| + | |
| − | </div>
| + | |
| − | <style>
| + | |
| − | #pageCover{
| + | |
| − | width:100%;
| + | |
| − | margin:0;
| + | |
| − | padding-top:80px;
| + | |
| − | }
| + | |
| − | #demoCover{
| + | |
| − | width:100vw;
| + | |
| − | height:80vh;
| + | |
| − | position:absolute;
| + | |
| − | background-color:rgba(8,39,58,0.5);
| + | |
| − | top:70px;
| + | |
| − | left:0;
| + | |
| − | text-align:center;
| + | |
| − | }
| + | |
| − | #coverPic{
| + | |
| − | width:600px;
| + | |
| − | margin:20vh auto;
| + | |
| − | }
| + | |
| − | #demo{
| + | |
| − | width:100vw;
| + | |
| − | height:70vh;
| + | |
| − | position:relative;
| + | |
| − | }
| + | |
| − | #demo svg {
| + | |
| − | width: 100%;
| + | |
| − | height: 100%;
| + | |
| − | position: fixed;
| + | |
| − | }
| + | |
| − | #demo svg g {
| + | |
| − | mix-blend-mode: lighten;
| + | |
| − | }
| + | |
| − | #demo svg polygon {
| + | |
| − | stroke: none;
| + | |
| − | fill: white;
| + | |
| − | }
| + | |
| − |
| + | |
| − | @media only screen and (max-width:1100px){
| + | |
| − | #pageCover{
| + | |
| − | padding-top:55px;
| + | |
| − | }
| + | |
| − | #demoCover{
| + | |
| − | top:55px;
| + | |
| − | height:30vh;
| + | |
| − | }
| + | |
| − | #demo{
| + | |
| − | height:30vh;
| + | |
| − | }
| + | |
| − | #coverPic{
| + | |
| − | width:500px;
| + | |
| − | margin:7vh auto;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | @media only screen and (max-width:992px){
| + | |
| − | #pageCover{
| + | |
| − | padding-top:55px;
| + | |
| − | }
| + | |
| − | #demoCover{
| + | |
| − | top:55px;
| + | |
| − | }
| + | |
| − | #coverPic{
| + | |
| − | width:400px;
| + | |
| − | margin:6vh auto;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | @media only screen and (max-width:768px){
| + | |
| − | #pageCover{
| + | |
| − | padding-top:55px;
| + | |
| − | }
| + | |
| − | #demoCover{
| + | |
| − | top:55px;
| + | |
| − | }
| + | |
| − | #coverPic{
| + | |
| − | width:350px;
| + | |
| − | margin:8vh auto;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | @media only screen and (max-width:500px){
| + | |
| − | #coverPic{
| + | |
| − | width:250px;
| + | |
| − | margin:8vh auto;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | </style>
| + | |
| − | <script>
| + | |
| − | //////////////////////////////
| + | |
| − | // Demo Functions
| + | |
| − | //////////////////////////////
| + | |
| − | function bkgFunction(showStats) {
| + | |
| − | // stats
| + | |
| − | if (showStats) {
| + | |
| − | var stats = new Stats();
| + | |
| − | stats.domElement.style.position = 'absolute';
| + | |
| − | stats.domElement.style.left = '0';
| + | |
| − | stats.domElement.style.top = '0';
| + | |
| − | document.body.appendChild(stats.domElement);
| + | |
| − | requestAnimationFrame(function updateStats(){
| + | |
| − | stats.update();
| + | |
| − | requestAnimationFrame(updateStats);
| + | |
| − | });
| + | |
| − | }
| + | |
| − | // init
| + | |
| − | var svg = document.getElementById('demo');
| + | |
| − | tesselation.setup(svg);
| + | |
| − | gradients.setup();
| + | |
| − | var lastTransitionAt, transitionDelay = 10000, transitionDuration = 3000;
| + | |
| − | function playNextTransition() {
| + | |
| − | tesselation.next(transitionDuration);
| + | |
| − | gradients.next(transitionDuration);
| + | |
| − | };
| + | |
| − | function tick(time) {
| + | |
| − | if (!lastTransitionAt || time - lastTransitionAt > transitionDelay) {
| + | |
| − | lastTransitionAt = time;
| + | |
| − | playNextTransition();
| + | |
| − | }
| + | |
| − | window.requestAnimationFrame(tick);
| + | |
| − | }
| + | |
| − | window.requestAnimationFrame(tick);
| + | |
| − | }
| + | |
| − | //////////////////////////////
| + | |
| − | // Delaunay Triangulation
| + | |
| − | //////////////////////////////
| + | |
| − | var calcDelaunayTriangulation = (function() {
| + | |
| − | var EPSILON = 1.0 / 1048576.0;
| + | |
| − | function getSuperT(vertices) {
| + | |
| − | var xMin = Number.POSITIVE_INFINITY, yMin = Number.POSITIVE_INFINITY,
| + | |
| − | xMax = Number.NEGATIVE_INFINITY, yMax = Number.NEGATIVE_INFINITY,
| + | |
| − | i, xDiff, yDiff, maxDiff, xCenter, yCenter;
| + | |
| − | for(i = vertices.length; i--; ) {
| + | |
| − | if(vertices[i][0] < xMin) xMin = vertices[i][0];
| + | |
| − | if(vertices[i][0] > xMax) xMax = vertices[i][0];
| + | |
| − | if(vertices[i][1] < yMin) yMin = vertices[i][1];
| + | |
| − | if(vertices[i][1] > yMax) yMax = vertices[i][1];
| + | |
| − | }
| + | |
| − | xDiff = xMax - xMin;
| + | |
| − | yDiff = yMax - yMin;
| + | |
| − | maxDiff = Math.max(xDiff, yDiff);
| + | |
| − | xCenter = xMin + xDiff * 0.5;
| + | |
| − | yCenter = yMin + yDiff * 0.5;
| + | |
| − | return [
| + | |
| − | [xCenter - 20 * maxDiff, yCenter - maxDiff],
| + | |
| − | [xCenter, yCenter + 20 * maxDiff],
| + | |
| − | [xCenter + 20 * maxDiff, yCenter - maxDiff]
| + | |
| − | ];
| + | |
| − | }
| + | |
| − | function circumcircle(vertices, i, j, k) {
| + | |
| − | var xI = vertices[i][0], yI = vertices[i][1],
| + | |
| − | xJ = vertices[j][0], yJ = vertices[j][1],
| + | |
| − | xK = vertices[k][0], yK = vertices[k][1],
| + | |
| − | yDiffIJ = Math.abs(yI - yJ), yDiffJK = Math.abs(yJ - yK),
| + | |
| − | xCenter, yCenter, m1, m2, xMidIJ, xMidJK, yMidIJ, yMidJK, xDiff, yDiff;
| + | |
| − | // bail condition
| + | |
| − | if(yDiffIJ < EPSILON){
| + | |
| − | if (yDiffJK < EPSILON){
| + | |
| − | throw new Error("Can't get circumcircle since all 3 points are y-aligned");
| + | |
| − | }
| + | |
| − | }
| + | |
| − |
| + | |
| − |
| + | |
| − | // calc circumcircle center x/y, radius
| + | |
| − | m1 = -((xJ - xI) / (yJ - yI));
| + | |
| − | m2 = -((xK - xJ) / (yK - yJ));
| + | |
| − | xMidIJ = (xI + xJ) / 2.0;
| + | |
| − | xMidJK = (xJ + xK) / 2.0;
| + | |
| − | yMidIJ = (yI + yJ) / 2.0;
| + | |
| − | yMidJK = (yJ + yK) / 2.0;
| + | |
| − | xCenter = (yDiffIJ < EPSILON) ? xMidIJ :
| + | |
| − | (yDiffJK < EPSILON) ? xMidJK :
| + | |
| − | (m1 * xMidIJ - m2 * xMidJK + yMidJK - yMidIJ) / (m1 - m2);
| + | |
| − | yCenter = (yDiffIJ > yDiffJK) ?
| + | |
| − | m1 * (xCenter - xMidIJ) + yMidIJ :
| + | |
| − | m2 * (xCenter - xMidJK) + yMidJK;
| + | |
| − | xDiff = xJ - xCenter;
| + | |
| − | yDiff = yJ - yCenter;
| + | |
| − | // return
| + | |
| − | return {i: i, j: j, k: k, x: xCenter, y: yCenter, r: xDiff * xDiff + yDiff * yDiff};
| + | |
| − | }
| + | |
| − | function dedupeEdges(edges) {
| + | |
| − | var i, j, a, b, m, n;
| + | |
| − | for(j = edges.length; j; ) {
| + | |
| − | b = edges[--j]; a = edges[--j];
| + | |
| − | for(i = j; i; ) {
| + | |
| − | n = edges[--i]; m = edges[--i];
| + | |
| − | if(a === m){
| + | |
| − | if (b===n){
| + | |
| − | edges.splice(j, 2); edges.splice(i, 2);
| + | |
| − | break;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | if(a === n){
| + | |
| − | if (b===m){
| + | |
| − | edges.splice(j, 2); edges.splice(i, 2);
| + | |
| − | break;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | }
| + | |
| − | }
| + | |
| − | }
| + | |
| − | return function(vertices) {
| + | |
| − | var n = vertices.length,
| + | |
| − | i, j, indices, st, candidates, locked, edges, dx, dy, a, b, c;
| + | |
| − | // bail if too few / too many verts
| + | |
| − | if(n < 3 || n > 2000)
| + | |
| − | return [];
| + | |
| − | // copy verts and sort indices by x-position
| + | |
| − | vertices = vertices.slice(0);
| + | |
| − | indices = new Array(n);
| + | |
| − | for(i = n; i--; )
| + | |
| − | indices[i] = i;
| + | |
| − | indices.sort(function(i, j) {
| + | |
| − | return vertices[j][0] - vertices[i][0];
| + | |
| − | });
| + | |
| − | // supertriangle
| + | |
| − | st = getSuperT(vertices);
| + | |
| − | vertices.push(st[0], st[1], st[2]);
| + | |
| − | // init candidates/locked tris list
| + | |
| − | candidates = [circumcircle(vertices, n + 0, n + 1, n + 2)];
| + | |
| − | locked = [];
| + | |
| − | edges = [];
| + | |
| − | // scan left to right
| + | |
| − | for(i = indices.length; i--; edges.length = 0) {
| + | |
| − | c = indices[i];
| + | |
| − | // check candidates tris against point
| + | |
| − | for(j = candidates.length; j--; ) {
| + | |
| − | // lock tri if point to right of circumcirc
| + | |
| − | dx = vertices[c][0] - candidates[j].x;
| + | |
| − | if (dx > 0.0){
| + | |
| − | if(dx * dx > candidates[j].r){
| + | |
| − | locked.push(candidates[j]);
| + | |
| − | candidates.splice(j, 1);
| + | |
| − | continue;
| + | |
| − | }
| + | |
| − | }
| + | |
| − |
| + | |
| − |
| + | |
| − | // point outside circumcirc = leave candidates
| + | |
| − | dy = vertices[c][1] - candidates[j].y;
| + | |
| − | if(dx * dx + dy * dy - candidates[j].r > EPSILON)
| + | |
| − | continue;
| + | |
| − | // point inside circumcirc = break apart, save edges
| + | |
| − | edges.push(
| + | |
| − | candidates[j].i, candidates[j].j,
| + | |
| − | candidates[j].j, candidates[j].k,
| + | |
| − | candidates[j].k, candidates[j].i
| + | |
| − | );
| + | |
| − | candidates.splice(j, 1);
| + | |
| − | }
| + | |
| − | // new candidates from broken edges
| + | |
| − | dedupeEdges(edges);
| + | |
| − | for(j = edges.length; j; ) {
| + | |
| − | b = edges[--j];
| + | |
| − | a = edges[--j];
| + | |
| − | candidates.push(circumcircle(vertices, a, b, c));
| + | |
| − | }
| + | |
| − | }
| + | |
| − | // close candidates tris, remove tris touching supertri verts
| + | |
| − | for(i = candidates.length; i--; )
| + | |
| − | locked.push(candidates[i]);
| + | |
| − | candidates.length = 0;
| + | |
| − | for(i = locked.length; i--; )
| + | |
| − | if(locked[i].i < n){
| + | |
| − | if(locked[i].j < n){
| + | |
| − | if(locked[i].k < n){
| + | |
| − | candidates.push(locked[i].i, locked[i].j, locked[i].k);
| + | |
| − | }
| + | |
| − | }
| + | |
| − | }
| + | |
| − |
| + | |
| − |
| + | |
| − | // done
| + | |
| − | return candidates;
| + | |
| − | };
| + | |
| − | })();
| + | |
| − | var tesselation = (function() {
| + | |
| − | var svg, svgW, svgH, prevGroup;
| + | |
| − | function createRandomTesselation() {
| + | |
| − | var wW = window.innerWidth;
| + | |
| − | var wH = window.innerHeight;
| + | |
| − | var gridSpacing = 250, scatterAmount = 0.75;
| + | |
| − | var gridSize, i, x, y;
| + | |
| − | if (wW / wH > svgW / svgH) { // window wider than svg = use width for gridSize
| + | |
| − | gridSize = gridSpacing * svgW / wW;
| + | |
| − | } else { // window taller than svg = use height for gridSize
| + | |
| − | gridSize = gridSpacing * svgH / wH;
| + | |
| − | }
| + | |
| − | var vertices = [];
| + | |
| − | var xOffset = (svgW % gridSize) / 2, yOffset = (svgH % gridSize) / 2;
| + | |
| − | for (x = Math.floor(svgW/gridSize) + 1; x >= -1; x--) {
| + | |
| − | for (y = Math.floor(svgH/gridSize) + 1; y >= -1; y--) {
| + | |
| − | vertices.push(
| + | |
| − | [
| + | |
| − | xOffset + gridSize * (x + scatterAmount * (Math.random() - 0.5)),
| + | |
| − | yOffset + gridSize * (y + scatterAmount * (Math.random() - 0.5))
| + | |
| − | ]
| + | |
| − | );
| + | |
| − | }
| + | |
| − | }
| + | |
| − | var triangles = calcDelaunayTriangulation(vertices);
| + | |
| − | var group = document.createElementNS('http://www.w3.org/2000/svg','g');
| + | |
| − | var polygon;
| + | |
| − | for(i = triangles.length; i; ) {
| + | |
| − | polygon = document.createElementNS('http://www.w3.org/2000/svg','polygon');
| + | |
| − | polygon.setAttribute('points',
| + | |
| − | vertices[triangles[--i]][0] + ',' + vertices[triangles[i]][1] + ' ' +
| + | |
| − | vertices[triangles[--i]][0] + ',' + vertices[triangles[i]][1] + ' ' +
| + | |
| − | vertices[triangles[--i]][0] + ',' + vertices[triangles[i]][1]
| + | |
| − | );
| + | |
| − | group.appendChild(polygon);
| + | |
| − | }
| + | |
| − | return group;
| + | |
| − | }
| + | |
| − | return {
| + | |
| − | setup: function(svgElement) {
| + | |
| − | svg = svgElement;
| + | |
| − | var vb = svg.getAttribute('viewBox').split(/\D/g);
| + | |
| − | svgW = vb[2];
| + | |
| − | svgH = vb[3];
| + | |
| − | },
| + | |
| − | next: function(t) {
| + | |
| − | var toRemove, i, n;
| + | |
| − | t /= 1000;
| + | |
| − | if(prevGroup){
| + | |
| − | if(prevGroup.children){
| + | |
| − | if(prevGroup.children.length){
| + | |
| − | toRemove = prevGroup;
| + | |
| − | n = toRemove.children.length;
| + | |
| − | for (i = n; i--; ) {
| + | |
| − | TweenMax.to(toRemove.children[i], t*0.4, {opacity: 0, delay: t*(0.3*i/n)});
| + | |
| − | }
| + | |
| − | TweenMax.delayedCall(t * (0.7 + 0.05), function(group) { svg.removeChild(group); }, [toRemove], this);
| + | |
| − | }
| + | |
| − | }
| + | |
| − | }
| + | |
| − |
| + | |
| − | var g = createRandomTesselation();
| + | |
| − | n = g.children.length;
| + | |
| − | for (i = n; i--; ) {
| + | |
| − | TweenMax.fromTo(g.children[i], t*0.4, {opacity: 0}, {opacity: 0.3 + 0.25 * Math.random(), delay: t*(0.3*i/n + 0.3), ease: Back.easeOut});
| + | |
| − | }
| + | |
| − | svg.appendChild(g);
| + | |
| − | prevGroup = g;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | })();
| + | |
| − | //////////////////////////////
| + | |
| − | // Gradients
| + | |
| − | //////////////////////////////
| + | |
| − | var gradients = (function() {
| + | |
| − | var grad1, grad2, showingGrad1;
| + | |
| − | // using colors from IBM Design Colors this time
| + | |
| − | var colors = [ // 14 colors - use 3-5 span
| + | |
| − | '#3c6df0', // ultramarine50
| + | |
| − | '#12a3b4', // aqua40
| + | |
| − | '#00a78f', // teal40
| + | |
| − | '#00aa5e', // green40
| + | |
| − | '#81b532', // lime30
| + | |
| − | '#e3bc13', // yellow20
| + | |
| − | '#ffb000', // gold20
| + | |
| − | '#fe8500', // orange30
| + | |
| − | '#fe6100', // peach40
| + | |
| − | '#e62325', // red50
| + | |
| − | '#dc267f', // magenta50
| + | |
| − | '#c22dd5', // purple50
| + | |
| − | '#9753e1', // violet50
| + | |
| − | '#5a3ec8' // indigo60
| + | |
| − | ];
| + | |
| − | function assignRandomColors(gradObj) {
| + | |
| − | var rA = Math.floor(colors.length * Math.random());
| + | |
| − | var rB = Math.floor(Math.random() * 3) + 3; // [3 - 5]
| + | |
| − | rB = (rA + (rB * (Math.random() < 0.5 ? -1 : 1)) + colors.length) % colors.length;
| + | |
| − | gradObj.stopA.setAttribute('stop-color', colors[rA]);
| + | |
| − | gradObj.stopB.setAttribute('stop-color', colors[rB]);
| + | |
| − | }
| + | |
| − | return {
| + | |
| − | setup: function() {
| + | |
| − | showingGrad1 = false;
| + | |
| − | grad1 = {
| + | |
| − | stopA: document.getElementById('stop1a'),
| + | |
| − | stopB: document.getElementById('stop1b'),
| + | |
| − | rect: document.getElementById('rect1')
| + | |
| − | };
| + | |
| − | grad2 = {
| + | |
| − | stopA: document.getElementById('stop2a'),
| + | |
| − | stopB: document.getElementById('stop2b'),
| + | |
| − | rect: document.getElementById('rect2')
| + | |
| − | };
| + | |
| − | grad1.rect.style.opacity = 0;
| + | |
| − | grad2.rect.style.opacity = 0;
| + | |
| − | },
| + | |
| − | next: function(t) {
| + | |
| − | t /= 1000;
| + | |
| − | var show, hide;
| + | |
| − | if (showingGrad1) {
| + | |
| − | hide = grad1;
| + | |
| − | show = grad2;
| + | |
| − | } else {
| + | |
| − | hide = grad2;
| + | |
| − | show = grad1;
| + | |
| − | }
| + | |
| − | showingGrad1 = !showingGrad1;
| + | |
| − | TweenMax.to(hide.rect, 0.55*t, {opacity: 0, delay: 0.2*t, ease: Sine.easeOut});
| + | |
| − | assignRandomColors(show);
| + | |
| − | TweenMax.to(show.rect, 0.65*t, {opacity: 1, ease: Sine.easeIn});
| + | |
| − | }
| + | |
| − | };
| + | |
| − | })();
| + | |
| − | //////////////////////////////
| + | |
| − | // Start
| + | |
| − | //////////////////////////////
| + | |
| − | bkgFunction();
| + | |
| − | </script>
| + | |
| − |
| + | |
| − | | + | |
| − | | + | |
| − | <!----------------------------------------------------------------------------------------------------------------------------------------->
| + | |
| − | <!---- Left Navigator ---->
| + | |
| − | <!----------------------------------------------------------------------------------------------------------------------------------------->
| + | |
| − |
| + | |
| | | | |
| | | | |
| | + | // point outside circumcirc = leave candidates |
| | + | dy = vertices[c][1] - candidates[j].y; |
| | + | if(dx * dx + dy * dy - candidates[j].r > EPSILON) |
| | + | continue; |
| | + | // point inside circumcirc = break apart, save edges |
| | + | edges.push( |
| | + | candidates[j].i, candidates[j].j, |
| | + | candidates[j].j, candidates[j].k, |
| | + | candidates[j].k, candidates[j].i |
| | + | ); |
| | + | candidates.splice(j, 1); |
| | + | } |
| | + | // new candidates from broken edges |
| | + | dedupeEdges(edges); |
| | + | for(j = edges.length; j; ) { |
| | + | b = edges[--j]; |
| | + | a = edges[--j]; |
| | + | candidates.push(circumcircle(vertices, a, b, c)); |
| | + | } |
| | + | } |
| | + | // close candidates tris, remove tris touching supertri verts |
| | + | for(i = candidates.length; i--; ) |
| | + | locked.push(candidates[i]); |
| | + | candidates.length = 0; |
| | + | for(i = locked.length; i--; ) |
| | + | if(locked[i].i < n){ |
| | + | if(locked[i].j < n){ |
| | + | if(locked[i].k < n){ |
| | + | candidates.push(locked[i].i, locked[i].j, locked[i].k); |
| | + | } |
| | + | } |
| | + | } |
| | | | |
| − |
| |
| − | <div id="pageContent">
| |
| − | <!----------------------------------------------------------------------------------------------------------------------------------------->
| |
| − | <!---- Content ---->
| |
| − | <!----------------------------------------------------------------------------------------------------------------------------------------->
| |
| − |
| |
| − | <div class="container">
| |
| − | <div class="row">
| |
| − |
| |
| − | <div class="row title1" id="mainTitle1">
| |
| − | <div class="col">Part Collection</div>
| |
| − | </div>
| |
| − |
| |
| − | <div class="row para1">
| |
| − | <div class="row">
| |
| − | <div class="col col-lg-12">
| |
| − | Fudan-TSI provides you with a toolbox for <i>in vivo</i> site-specific continuous mutagenesis. The pivotal elements in the collection are Cre recombinase and Moloney Murine Leukemia Virus reverse transcriptase (MMLV-RT). Our collection contains Cre attached with different degradation tags, and RT under different inducible promoters to achieve diverse steady-state expression level. All parts are well characterized, for researchers to choose their desired ones. To initiate reverse transcription and recombination, additional regulatory sequences are required. We provide incompatible loxP sites for Cre and primer binding site along with other reverse transcription completion sequences for RT. We determined our most favored construct based on both the experimental and modelling result. Our collection provides researchers with a set of elements necessary for mutagenesis, and they can assemble the system based on their own needs.
| |
| − | </div>
| |
| − | </div>
| |
| − | </div>
| |
| − |
| |
| − | <div class="row title2">
| |
| − | <div class="col col-lg-12">The Reverse Transcriptase Collection</div>
| |
| − | </div>
| |
| − |
| |
| − | <div class="row para1">
| |
| − | <div class="row">
| |
| − | <div class="col col-lg-12">
| |
| − | In order to produce the reverse transcriptase effectively inside <i>E.coli</i> cells, we have constructed a series of promoters expressing gag-pol polyprotein with or without operons controlling the transcription. Cloned into a proper protein expression vector, we believe that reverse transcriptase can be expressed in <i>E.coli</i>.
| |
| − | </div>
| |
| − | </div>
| |
| − | <div class="row">
| |
| − | <div class="col col-lg-12">
| |
| − | <table style="color:white;" border="1">
| |
| − | <tr>
| |
| − | <td>Part Number</td>
| |
| − | <td>Part Name</td>
| |
| − | <td>Notes</td>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td>BBa_K3257106</td>
| |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257106">gag-Q-pol with T5 Promoter</a></td>
| |
| − | <td>IPTG Inducible</td>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td>BBa_K3257107</td>
| |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257107">gag-Q-pol with T7 Promoter</a></td>
| |
| − | <td>IPTG Inducible</td>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td>BBa_K3257108</td>
| |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257108">gag-Q-pol with J23119 Promoter</a></td>
| |
| − | <td>IPTG Inducible</td>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td>BBa_K3257110</td>
| |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257110">gag-Q-pol with LacUV5 Promoter</a></td>
| |
| − | <td>IPTG Inducible</td>
| |
| − | </tr>
| |
| − | </table>
| |
| − | </div>
| |
| − | </div>
| |
| − | </div>
| |
| − |
| |
| − | <div class="row title2">
| |
| − | <div class="col col-lg-12">The Reverse Transcription Initiation Collection</div>
| |
| − | </div>
| |
| − |
| |
| − | <div class="row para1">
| |
| − | <div class="row">
| |
| − | <div class="col col-lg-12">
| |
| − | This collection includes the components necessary for the reverse transcription initiation, in which tRNAP<sup>ro</sup> and PBS acts as a primer and its binding site, and others are involved in the first and second strand transfer process.
| |
| − | </div>
| |
| − | </div>
| |
| − | <div class="row">
| |
| − | <div class="col col-lg-12">
| |
| − | <table style="color:white;" border="1">
| |
| − | <tr>
| |
| − | <td>Part Number</td>
| |
| − | <td>Part Name</td>
| |
| − | <td>Notes</td>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td>BBa_K3257060</td>
| |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257060">PolyPurine Tract(PPT)</a></td>
| |
| − | <td>Involved in the first strand transfer in reverse transcription process</td>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td>BBa_K3257061</td>
| |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257061">R Region</a></td>
| |
| − | <td>Involved in the first strand transfer in reverse transcription process</td>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td>BBa_K3257062</td>
| |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257062">U5 Region</a></td>
| |
| − | <td>Important for primer binding and virus encapsidation</td>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td>BBa_K3257063</td>
| |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257063">Primer Binding Site(PBS)</a></td>
| |
| − | <td>Providing bingding site for reverse transcriptase</td>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td>BBa_K3257076</td>
| |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257076">tRNA Primer</a></td>
| |
| − | <td>Initiating the reverse transcription process</td>
| |
| − | </tr>
| |
| − | </table>
| |
| − | </div>
| |
| − | </div>
| |
| − | </div>
| |
| − |
| |
| − | <div class="row title2">
| |
| − | <div class="col">The Degradation Tag Collection</div>
| |
| − | </div>
| |
| − |
| |
| − | <div class="row para1">
| |
| − | <div class="row">
| |
| − | <div class="col col-lg-12">
| |
| − | This collection includes 5 different degradation tags with different degradation rate and steady-state concentration when fused after a CDS of a protein. We have measured the induction curve and growth curve of BL21 (DE3) containing EGFP fused with degradation tags (Figure 1).
| |
| − | </div>
| |
| − | </div>
| |
| − | <div class="row">
| |
| − | <div class="col col-lg-12">
| |
| − | <table style="color:white;" border="1">
| |
| − | <tr>
| |
| − | <td>Part Number</td>
| |
| − | <td>Part Name</td>
| |
| − | <td>Notes</td>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td>BBa_K3257069</td>
| |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257069">SsrA(LAA)</a></td>
| |
| − | <td>LAA stands for the last 3 amino acid residues of this degradation tag and this is a widely-used wild-type tag.</td>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td>BBa_K3257070</td>
| |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257070">SsrA(LAV)</a></td>
| |
| − | <td>LAV stands for the last 3 amino acid residues of this degradation tag and it is mutated from SsrA(LAA).</td>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td>BBa_K3257071</td>
| |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257071">SsrA(LVA)</a></td>
| |
| − | <td>LVA stands for the last 3 amino acid residues of this degradation tag and it is mutated from SsrA(LAA).</td>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td>BBa_K3257072</td>
| |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257072">SsrA(LVV)</a></td>
| |
| − | <td>LVA stands for the last 3 amino acid residues of this degradation tag and it is mutated from SsrA(LAA).</td>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td>BBa_K3257073</td>
| |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257073">SsrA(WVLAA)</a></td>
| |
| − | <td>WVLAA stands for the last 5 amino acid residues of this degradation tag and it is mutated from SsrA(LAA).</td>
| |
| − | </tr>
| |
| − | </table>
| |
| − | </div>
| |
| − | </div>
| |
| − | </div>
| |
| − |
| |
| − | <div class="row title2">
| |
| − | <div class="col col-lg-12">The Cre Recombinase with Degradation Tags Collection</div>
| |
| − | </div>
| |
| − |
| |
| − | <div class="row para1">
| |
| − | <div class="row">
| |
| − | <div class="col col-lg-12">
| |
| − | Combined with Degradation Tags Collection, the leakage of Cre recombinase is solved and difference in expression level between Cre and RT is achieved in an easier way. The steady state concentration of Cre recombinase lowers to a functional level.
| |
| − | </div>
| |
| − | </div>
| |
| − | <div class="row">
| |
| − | <div class="col col-lg-12">
| |
| − | <table style="color:white;" border="1">
| |
| − | <tr>
| |
| − | <td>Part Number</td>
| |
| − | <td>Part Name</td>
| |
| − | <td>Notes</td>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td>BBa_K3257101</td>
| |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257101">Cre with SsrA(WVLAA)</a></td>
| |
| − | <td>Cre recombinase tightly attached with SSr(WVLAA)</td>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td>BBa_K3257102</td>
| |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257102">Cre with SsrA(LAA)</a></td>
| |
| − | <td>Cre recombinase tightly attached with SSr(LAA)</td>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td>BBa_K3257103</td>
| |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257103">Cre with SsrA(LAV)</a></td>
| |
| − | <td>Cre recombinase tightly attached with SSr(LAV)</td>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td>BBa_K3257104</td>
| |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257104">Cre with SsrA(LVA)</a></td>
| |
| − | <td>Cre recombinase tightly attached with SSr(LVA)</td>
| |
| − | </tr>
| |
| − | <tr>
| |
| − | <td>BBa_K3257105</td>
| |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257105">Cre with SsrA(LVV)</a></td>
| |
| − | <td>Cre recombinase tightly attached with SSr(LVV)</td>
| |
| − | </tr>
| |
| − | </table>
| |
| − | </div>
| |
| − | </div>
| |
| − | </div>
| |
| − |
| |
| − | <div class="row title2">
| |
| − | <div class="col col-lg-12">The lox Sites Collection</div>
| |
| − | </div>
| |
| − |
| |
| − | <div class="row para1">
| |
| − | <div class="row">
| |
| − | <div class="col col-lg-12">
| |
| − | This collection includes 4 different types of lox sites. The lox511, lox2272, lox5171 are all orthogonal to loxP as we can see from their inability to be knocked out by Cre if there are loxP on one side and other lox sites on the other side.<br /><br />
| |
| − | After double transformation, colony PCR was done and agarose gel shows that there remains the original DNA fragment.
| |
| | | | |
| − | </div>
| + | // done |
| − | </div>
| + | return candidates; |
| − | <div class="row">
| + | }; |
| − | <div class="col col-lg-12">
| + | })(); |
| − | <table style="color:white;" border="1">
| + | var tesselation = (function() { |
| − | <tr>
| + | var svg, svgW, svgH, prevGroup; |
| − | <td>Part Number</td>
| + | function createRandomTesselation() { |
| − | <td>Part Name</td>
| + | var wW = window.innerWidth; |
| − | <td>Notes</td>
| + | var wH = window.innerHeight; |
| − | </tr>
| + | var gridSpacing = 250, scatterAmount = 0.75; |
| − | <tr>
| + | var gridSize, i, x, y; |
| − | <td>BBa_K3257064</td>
| + | if (wW / wH > svgW / svgH) { // window wider than svg = use width for gridSize |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257064">loxP</a></td>
| + | gridSize = gridSpacing * svgW / wW; |
| − | <td>Wild-type lox site that can be recognized by Cre recombinase.</td>
| + | } else { // window taller than svg = use height for gridSize |
| − | </tr>
| + | gridSize = gridSpacing * svgH / wH; |
| − | <tr>
| + | } |
| − | <td>BBa_K3257074</td>
| + | var vertices = []; |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257074">lox2272</a></td>
| + | var xOffset = (svgW % gridSize) / 2, yOffset = (svgH % gridSize) / 2; |
| − | <td>Orthogonal lox site mutated from loxP.</td>
| + | for (x = Math.floor(svgW/gridSize) + 1; x >= -1; x--) { |
| − | </tr>
| + | for (y = Math.floor(svgH/gridSize) + 1; y >= -1; y--) { |
| − | <tr>
| + | vertices.push( |
| − | <td>BBa_K3257075</td>
| + | [ |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257075">lox5171</a></td>
| + | xOffset + gridSize * (x + scatterAmount * (Math.random() - 0.5)), |
| − | <td>Orthogonal lox site mutated from loxP.</td>
| + | yOffset + gridSize * (y + scatterAmount * (Math.random() - 0.5)) |
| − | </tr>
| + | ] |
| − | </table>
| + | ); |
| − | </div>
| + | } |
| − | </div>
| + | } |
| − | </div>
| + | var triangles = calcDelaunayTriangulation(vertices); |
| | + | var group = document.createElementNS('http://www.w3.org/2000/svg','g'); |
| | + | var polygon; |
| | + | for(i = triangles.length; i; ) { |
| | + | polygon = document.createElementNS('http://www.w3.org/2000/svg','polygon'); |
| | + | polygon.setAttribute('points', |
| | + | vertices[triangles[--i]][0] + ',' + vertices[triangles[i]][1] + ' ' + |
| | + | vertices[triangles[--i]][0] + ',' + vertices[triangles[i]][1] + ' ' + |
| | + | vertices[triangles[--i]][0] + ',' + vertices[triangles[i]][1] |
| | + | ); |
| | + | group.appendChild(polygon); |
| | + | } |
| | + | return group; |
| | + | } |
| | + | return { |
| | + | setup: function(svgElement) { |
| | + | svg = svgElement; |
| | + | var vb = svg.getAttribute('viewBox').split(/\D/g); |
| | + | svgW = vb[2]; |
| | + | svgH = vb[3]; |
| | + | }, |
| | + | next: function(t) { |
| | + | var toRemove, i, n; |
| | + | t /= 1000; |
| | + | if(prevGroup){ |
| | + | if(prevGroup.children){ |
| | + | if(prevGroup.children.length){ |
| | + | toRemove = prevGroup; |
| | + | n = toRemove.children.length; |
| | + | for (i = n; i--; ) { |
| | + | TweenMax.to(toRemove.children[i], t*0.4, {opacity: 0, delay: t*(0.3*i/n)}); |
| | + | } |
| | + | TweenMax.delayedCall(t * (0.7 + 0.05), function(group) { svg.removeChild(group); }, [toRemove], this); |
| | + | } |
| | + | } |
| | + | } |
| | | | |
| − | <div class="row title2">
| + | var g = createRandomTesselation(); |
| − | <div class="col col-lg-12">The Chl<sup>R</sup> Gene Collection</div>
| + | n = g.children.length; |
| − | </div>
| + | for (i = n; i--; ) { |
| − |
| + | TweenMax.fromTo(g.children[i], t*0.4, {opacity: 0}, {opacity: 0.3 + 0.25 * Math.random(), delay: t*(0.3*i/n + 0.3), ease: Back.easeOut}); |
| − | <div class="row para1">
| + | } |
| − | <div class="row">
| + | svg.appendChild(g); |
| − | <div class="col col-lg-12">
| + | prevGroup = g; |
| − | This collection includes wild-type Chloramphinicol resistence gene and its 7 nonsense mutants, which are used as targets of our <i>in vivo</i> sequence-specific toolbox for continuous mutagenesis system. By multiple rounds of mutagenesis process, nonsense mutated Chl<sup>R</sup> gene will undergo recovery mutation and regain its ability of Chloramphinicol resistence.
| + | } |
| − | </div>
| + | } |
| − | </div>
| + | })(); |
| − | <div class="row">
| + | ////////////////////////////// |
| − | <div class="col col-lg-12">
| + | // Gradients |
| − | <table style="color:white;" border="2">
| + | ////////////////////////////// |
| − | <tr>
| + | var gradients = (function() { |
| − | <td>Part Number</td>
| + | var grad1, grad2, showingGrad1; |
| − | <td>Part Name</td>
| + | // using colors from IBM Design Colors this time |
| − | <td>Notes</td>
| + | var colors = [ // 14 colors - use 3-5 span |
| − | </tr>
| + | '#3c6df0', // ultramarine50 |
| − | <tr>
| + | '#12a3b4', // aqua40 |
| − | <td>BBa_K3257034</td>
| + | '#00a78f', // teal40 |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257034">Chl<sup>R</sup></a></td>
| + | '#00aa5e', // green40 |
| − | <td>Wild-type Chl<sup>R</sup> gene.</td>
| + | '#81b532', // lime30 |
| − | </tr>
| + | '#e3bc13', // yellow20 |
| − | <tr>
| + | '#ffb000', // gold20 |
| − | <td>BBa_K3257035</td>
| + | '#fe8500', // orange30 |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257035">Chl<sup>R</sup>_T33X</a></td>
| + | '#fe6100', // peach40 |
| − | <td>T33X mutant of Chl<sup>R</sup> gene.</td>
| + | '#e62325', // red50 |
| − | </tr>
| + | '#dc267f', // magenta50 |
| − | <tr>
| + | '#c22dd5', // purple50 |
| − | <td>BBa_K3257036</td>
| + | '#9753e1', // violet50 |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257036">Chl<sup>R</sup>_Y92X</a></td>
| + | '#5a3ec8' // indigo60 |
| − | <td>Y92X mutant of Chl<sup>R</sup> gene.</td>
| + | ]; |
| − | </tr>
| + | function assignRandomColors(gradObj) { |
| − | <tr>
| + | var rA = Math.floor(colors.length * Math.random()); |
| − | <td>BBa_K3257037</td>
| + | var rB = Math.floor(Math.random() * 3) + 3; // [3 - 5] |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257037">Chl<sup>R</sup>_E97X</a></td>
| + | rB = (rA + (rB * (Math.random() < 0.5 ? -1 : 1)) + colors.length) % colors.length; |
| − | <td>E97X mutant of Chl<sup>R</sup> gene.</td>
| + | gradObj.stopA.setAttribute('stop-color', colors[rA]); |
| − | </tr>
| + | gradObj.stopB.setAttribute('stop-color', colors[rB]); |
| − | <tr>
| + | } |
| − | <td>BBa_K3257038</td>
| + | return { |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257038">Chl<sup>R</sup>_S121X</a></td>
| + | setup: function() { |
| − | <td>S121X mutant of Chl<sup>R</sup> gene.</td>
| + | showingGrad1 = false; |
| − | </tr>
| + | grad1 = { |
| − | <tr>
| + | stopA: document.getElementById('stop1a'), |
| − | <td>BBa_K3257039</td>
| + | stopB: document.getElementById('stop1b'), |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257039">Chl<sup>R</sup>_L158X</a></td>
| + | rect: document.getElementById('rect1') |
| − | <td>L158X mutant of Chl<sup>R</sup> gene.</td>
| + | }; |
| − | </tr>
| + | grad2 = { |
| − | <tr>
| + | stopA: document.getElementById('stop2a'), |
| − | <td>BBa_K3257040</td>
| + | stopB: document.getElementById('stop2b'), |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257040">Chl<sup>R</sup>_K182X</a></td>
| + | rect: document.getElementById('rect2') |
| − | <td>K182X mutant of Chl<sup>R</sup> gene.</td>
| + | }; |
| − | </tr>
| + | grad1.rect.style.opacity = 0; |
| − | <tr>
| + | grad2.rect.style.opacity = 0; |
| − | <td>BBa_K3257041</td>
| + | }, |
| − | <td><a href="http://parts.igem.org/Part:BBa_K3257041">Chl<sup>R</sup>_Q190X</a></td>
| + | next: function(t) { |
| − | <td>Q190X mutant of Chl<sup>R</sup> gene.</td>
| + | t /= 1000; |
| − | </tr>
| + | var show, hide; |
| − | </table>
| + | if (showingGrad1) { |
| − | </div>
| + | hide = grad1; |
| − | </div>
| + | show = grad2; |
| − | </div>
| + | } else { |
| − | </div>
| + | hide = grad2; |
| − | </div>
| + | show = grad1; |
| − |
| + | } |
| | + | showingGrad1 = !showingGrad1; |
| | + | TweenMax.to(hide.rect, 0.55*t, {opacity: 0, delay: 0.2*t, ease: Sine.easeOut}); |
| | + | assignRandomColors(show); |
| | + | TweenMax.to(show.rect, 0.65*t, {opacity: 1, ease: Sine.easeIn}); |
| | + | } |
| | + | }; |
| | + | })(); |
| | + | ////////////////////////////// |
| | + | // Start |
| | + | ////////////////////////////// |
| | + | bkgFunction(); |
| | + | </script> |
| | + | <div style="position:absolute;top:100px;left:9%"><center><img style="height:120px;width:auto" alt="cover gif 1st added" src="https://static.igem.org/mediawiki/2019/d/da/T--Fudan-TSI--coverPartCollection.gif" /></center></div> |
| | + | </div> |
| | + | </div> |
| | | | |
| − |
| + | <!--//////////////////////////////////////////////////// |
| − | </div>
| + | do not edit above, if must BE CAREFUL |
| − |
| + | //////////////////////////////////////////////////////--> |
| − |
| + | |
| − |
| + | <!-- side navigator of page content --> |
| − | <!----------------------------------------------------------------------------------------------------------------------------------------->
| + | <ul id="pageContentNav" class="hide-on-med-and-down z-depth-0"> |
| − | <!---- Foot ---->
| + | <li class=" onThisPageNav"><a href=" #section1"> Overview</a></li> |
| − | <!----------------------------------------------------------------------------------------------------------------------------------------->
| + | <li class=" onThisPageNav"><a href=" #section2"> Reverse transcriptase</a></li> |
| − |
| + | < li class=" onThisPageNav"><a href=" #section22"> Chl< sup> R</ sup>& nbsp; gene</a></li> |
| − | <footer id="FudanFooter" class="page-footer grey">
| + | <li class=" onThisPageNav"><a href=" #section3"> RT initiation</a></li> |
| − |
| + | <li class=" onThisPageNav"><a href=" #section4" >Degradation tag</a></ li> |
| − | <div class="container" id="footContainer">
| + | <li class=" onThisPageNav"><a href=" #section5"> Cre recombinase</a></li> |
| − | <div class="row">
| + | <li class=" onThisPageNav"><a href=" #section6"> loxP& nbsp; sites</a></li> |
| − | <div class="col-md-4" id="sponser" style="padding-top:3%;">
| + | </ul> |
| − | <div class="row">
| + | <!-- main content of the page --> |
| − | <div class="col-sm-6" style="padding:0;">
| + | <main><article> |
| − | <div class="row align-items-center">
| + | |
| − | <div class="col">
| + | |
| − | <img class="img-fluid" alt="Team Fudan-TSI" src="https://static.igem.org/mediawiki/2019/0/0f/T--Fudan-TSI--LogoGrey.gif" />
| + | |
| − | </div>
| + | |
| − | <div class="col">
| + | |
| − | <img class="img-fluid" alt="Fudan University" src="https://static.igem.org/mediawiki/2018/f/f7/T--Fudan--schoolLogo.png" />
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − | <div class="col-sm-6" style="padding:0;">
| + | |
| − | <div class="row align-items-center">
| + | |
| − | <div class="col">
| + | |
| − | <img class="img-fluid" alt="School of Life Sciences, Fudan University" src="https://static.igem.org/mediawiki/2018/1/1d/T--Fudan--schoolOfLifeSciencesIcon.png" />
| + | |
| − | </div>
| + | |
| − | <div class="col">
| + | |
| − | <img class="img-fluid" alt="Yunfeng Capital" src="https://static.igem.org/mediawiki/2018/e/e2/T--Fudan--yunfengLogo.png" />
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − | <div class="row">
| + | |
| − | <h3 class="col s12" style="text-align: left; color: rgba(255, 255, 255, 0.8); font-size:12.5px; margin-top:5px;">R-Evolution: an <i>in vivo</i> sequence-specific toolbox for continuous mutagenesis</h3>
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − |
| + | |
| − | <div class="col-md-8" id="usefulLinks">
| + | |
| − | <div class="row">
| + | |
| − | <div class="col-lg-6" style="padding:0;">
| + | |
| − | <div class="row">
| + | |
| − |
| + | |
| − | <div class="col-sm-4">
| + | |
| − | <div class="footerUl align-items-center">
| + | |
| − | <span><a href="/Team:Fudan-TSI/Description" style="text-decoration:none;">Project</a></span>
| + | |
| − | <ul>
| + | |
| − | <li><a href="/Team:Fudan-TSI/Description">Background</a></li>
| + | |
| − | <li><a href="/Team:Fudan-TSI/Design">Design</a></li>
| + | |
| − | <li><a href="/Team:Fudan-TSI/Applied_Design">Applied Design</a></li>
| + | |
| − | <li><a href="/Team:Fudan-TSI/Experiments">Experiments</a></li>
| + | |
| − | <li><a href="/Team:Fudan-TSI/Judging">Judging</a></li>
| + | |
| − | </ul>
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − |
| + | |
| − | <div class="col-sm-4">
| + | |
| − | <div class="footerUl align-items-center">
| + | |
| − | <span><a href="/Team:Fudan-TSI/Results" style="text-decoration:none;">Results</a></span>
| + | |
| − | <ul>
| + | |
| − | <li><a href="/Team:Fudan-TSI/Results#ReverseTranscription">Reverse Transcription</a></li>
| + | |
| − | <li><a href="/Team:Fudan-TSI/Results#Recombination">Recombination</a></li>
| + | |
| − | <li><a href="/Team:Fudan-TSI/Demonstrate">Demonstration</a></li>
| + | |
| − | <li><a href="/Team:Fudan-TSI/Measurement">Measurement</a></li>
| + | |
| − | <li><a href="/Team:Fudan-TSI/Notebook">Notebook</a></li>
| + | |
| − | </ul>
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − |
| + | |
| − | <div class="col-sm-4">
| + | |
| − | <div class="footerUl align-items-center">
| + | |
| − | <span style="text-decoration:none;">Model</span>
| + | |
| − | <ul>
| + | |
| − | <li><a href="/Team:Fudan-TSI/Model">Modeling</a></li>
| + | |
| − | <li><a href="/Team:Fudan-TSI/Software">Software</a></li>
| + | |
| − | <li><a href="/Team:Fudan-TSI/Hardware">Hardware</a></li>
| + | |
| − | </ul>
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − |
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − | <div class="col-lg-6" style="padding:0;">
| + | |
| − | | + | |
| − |
| + | |
| − | <div class="col-sm-4">
| + | |
| − | <div class="footerUl align-items-center active">
| + | |
| − | <span><a href="/Team:Fudan-TSI/Parts" style="text-decoration:none;">Parts</a></span>
| + | |
| − | <ul>
| + | |
| − | <li><a href="/Team:Fudan-TSI/Basic_Part">Basic parts</a></li>
| + | |
| − | <li><a href=" /Team:Fudan-TSI/Composite_Part"> Composite parts</a></li> | + | |
| − | <li><a href="/Team:Fudan-TSI/Improve">Improved parts</a></li>
| + | |
| − | <li><a href=" /Team:Fudan-TSI/Part_Collection"> Part collection</a></li> | + | |
| − | </ul>
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − |
| + | |
| − | <div class="col-sm-4">
| + | |
| − | <div class="footerUl align-items-center">
| + | |
| − | <span><a href=" /Team:Fudan-TSI/Human_Practices" style="text-decoration:none;"> Outreach< /a></ span> | + | |
| − | <ul>
| + | |
| − | <li><a href="/Team:Fudan-TSI/Public_Engagement">Education & Public engagement</a></li>
| + | |
| − | <li><a href="/Team:Fudan-TSI/Integrated_Human_Practice">Integrated human practice</a></li>
| + | |
| − | <li><a href=" /Team:Fudan-TSI/Collaborations"> Collaborations</a></li> | + | |
| − | <li><a href="/Team:Fudan-TSI/Safety">Safety</a></li>
| + | |
| − | </ul>
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − |
| + | |
| − | <div class="col-sm-4">
| + | |
| − | <div class="footerUl align-items-center">
| + | |
| − | <span><a href=" /Team:Fudan-TSI/Team" style="text-decoration:none; ">Team</a></ span> | + | |
| − | <ul>
| + | |
| − | <li><a href="/Team:Fudan-TSI/Team">Members</a></li>
| + | |
| − | <li><a href=" /Team:Fudan-TSI/Attributions"> Attributions</a></li> | + | |
| − | <li><a href="https://2018.igem.org/Team:Fudan/Heritage" target=_blank>Heritage</a></li>
| + | |
| − | <li><a href=" /Team:Fudan-TSI">& #169; 2019</a></li> | + | |
| − | </ul>
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − |
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − |
| + | |
| − |
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − |
| + | |
| − | <div class="footer-copyright">
| + | |
| − | <div class="container" style="width:90%;">
| + | |
| − | <div class="contactUS row">
| + | |
| − | <div class="col s12 m6 l6"><i class="fa fa-location-arrow"></i> Life Sci Bldg, 2005 Songhu Rd, Shanghai
| + | |
| − | </div>
| + | |
| − | <div class="col s12 m6 l2"><i class="fa fa-fax"></i> +86-21-31246727
| + | |
| − | </div>
| + | |
| − | <div class="col s12 m6 l2"><i class="fa fa-envelope-o"></i> igem@fudan.edu.cn
| + | |
| − | </div>
| + | |
| − | <div class="col s12 m6 l2"><i class="fa fa-twitter"></i> <i class="fa fa-wechat"></i> Fudan_iGEM
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − | </footer>
| + | |
| − |
| + | |
| − |
| + | |
| | | | |
| − | </div>
| + | <div id="section1" class="section container scrolSpy"> |
| | + | <h2>Overview</h2> |
| | + | <p class="flow-text">We provide you with a toolbox for <i>in vivo</i> site-specific continuous mutagenesis. The pivotal elements in the collection are Cre recombinase and Moloney Murine Leukemia Virus reverse transcriptase (MMLV-RT). Our collection contains Cre attached with different degradation tags, and RT under different inducible promoters to achieve diverse steady-state expression level. All parts are BioBrick RFC10 compatible, well characterized, for researchers to choose their desired ones. To initiate reverse transcription and recombination, additional regulatory sequences are required. We provide incompatible loxP sites for Cre and primer binding site along with other reverse transcription completion sequences for RT. We determined our most favored construct based on both the experimental and modeling result. Our collection provides researchers with a set of elements necessary for mutagenesis, and they can assemble the system based on their own needs.</p> |
| | + | </div> |
| | | | |
| − |
| + | <div id="section2" class="section container scrolSpy"> |
| − |
| + | <h2>The Reverse Transcriptase Collection</h2> |
| − | <script>
| + | <p class="flow-text">In order to produce the reverse transcriptase effectively inside <i>E. coli</i> cells, we have constructed a series of promoters expressing gag-pol polyprotein with or without operons controlling the transcription. Cloned into a proper protein expression vector, we believe that reverse transcriptase can be expressed in <i>E. coli</i>.</p> |
| − |
| + | <div class="tableHolder"> |
| − | var winHeight=$(window).height();
| + | <table> |
| − | var winWidth=$(window).width();
| + | <tr> |
| − | var pagePosition=$("#pageContent").offset().top+90;
| + | <th>Part Number</th> |
| − | var navHeight=$(".leftNav").height();
| + | <th>Part Name</th> |
| − | var footerHeight=$("#FudanFooter").height();
| + | <th>Notes</th> |
| − | var maxTopDistance=$("#FudanFooter").offset().top-$(".leftNav").height()-$("#top_menu_14").height()-$("#navUl").height();
| + | </tr> |
| − | $(".leftNav").css({"position":"absolute","top":pagePosition});
| + | <tr> |
| − | $(window).resize(function(){
| + | <td>BBa_K3257106</td> |
| − | var winHeight=$(window).height();
| + | <td><a target="_blank" href="http://parts.igem.org/Part:BBa_K3257106">gag-Q-pol with T5 Promoter</a></td> |
| − | var winWidth=$(window).width();
| + | <td>IPTG Inducible</td> |
| − | var topDistance=$(window).scrollTop()+0.25*winHeight;
| + | </tr> |
| − | var navHeight=$(".leftNav").height();
| + | <tr> |
| − | var footerHeight=$("#FudanFooter").height();
| + | <td>BBa_K3257107</td> |
| − | var maxTopDistance=$("#FudanFooter").offset().top-$(".leftNav").height()-$("#navUl").height();
| + | <td><a target="_blank" href="http://parts.igem.org/Part:BBa_K3257107">gag-Q-pol with T7 Promoter</a></td> |
| − | var leftNavFromTop=pagePosition-$(window).scrollTop();
| + | <td>IPTG Inducible</td> |
| − | if (leftNavFromTop<0.25*winHeight){
| + | </tr> |
| − | if(topDistance<maxTopDistance){
| + | <tr> |
| − | $(".leftNav").css({"position":"fixed","top":0.25*winHeight+$("#top_menu_14").height()});
| + | <td>BBa_K3257108</td> |
| − | }
| + | <td><a target="_blank" href="http://parts.igem.org/Part:BBa_K3257108">gag-Q-pol with J23119 Promoter</a></td> |
| − | else{
| + | <td>IPTG Inducible</td> |
| − | $(".leftNav").css({"position":"absolute","top":maxTopDistance});
| + | </tr> |
| − | }
| + | <tr> |
| − | }
| + | <td>BBa_K3257110</td> |
| − | else{
| + | <td><a target="_blank" href="http://parts.igem.org/Part:BBa_K3257110">gag-Q-pol with LacUV5 Promoter</a></td> |
| − | $(".leftNav").css({"position":"absolute","top":pagePosition});
| + | <td>IPTG Inducible</td> |
| − | }
| + | </tr> |
| − | });
| + | </table> |
| | + | </div> |
| | + | </div> |
| | | | |
| − | $(window).scroll(function(){
| + | <div id="section22" class="section container scrolSpy"> |
| − | var winHeight=$(window).height();
| + | <h2>The Chl<sup>R</sup> Gene Collection</h2> |
| − | var winWidth=$(window).width();
| + | <p class="flow-text">This collection includes wild-type Chloramphinicol resistence gene and its 7 nonsense mutants, which are used as targets of our <i>in vivo</i> sequence-specific toolbox for continuous mutagenesis system. By multiple rounds of mutagenesis process, nonsense mutated ChlR gene will undergo recovery mutation and regain its ability of Chloramphinicol resistence.</p> |
| − | var leftNavFromTop=pagePosition-$(window).scrollTop();
| + | <div class="tableHolder"> |
| − | var topDistance=$(window).scrollTop()+0.25*winHeight;
| + | <table> |
| − | if (leftNavFromTop<0.25*winHeight){
| + | <tr> |
| − | if(topDistance<maxTopDistance){
| + | <td>Part Number</td> |
| − | $(".leftNav").css({"position":"fixed","top":0.25*winHeight+$("#top_menu_14").height()});
| + | <td>Part Name</td> |
| − | }
| + | <td>Notes</td> |
| − | else{
| + | </tr> |
| − | $(".leftNav").css({"position":"absolute","top":maxTopDistance});
| + | <tr> |
| − | };
| + | <td>BBa_K3257111</td> |
| − | }
| + | <td><a href="http://parts.igem.org/Part:BBa_K3257111"><u>Chl<sup>R</sup></u></a></td> |
| − | else{
| + | <td>Wild-type Chl<sup>R</sup> gene with regulatory elements.</td> |
| − | $(".leftNav").css({"position":"absolute","top":pagePosition});
| + | </tr> |
| − | }
| + | <tr> |
| − | });
| + | <td>BBa_K3257112</td> |
| − |
| + | <td><a href="http://parts.igem.org/Part:BBa_K3257112"><u>Chl<sup>R</sup>_T33X</u></a></td> |
| − | $(".leftNav a").click(function () {
| + | <td>T33X mutant of Chl<sup>R</sup> gene with regulatory elements.</td> |
| − | $('html, body').animate({
| + | </tr> |
| − | scrollTop: $($.attr(this, 'href')).offset().top-$("#navUl").height()-50
| + | <tr> |
| − | }, 500);
| + | <td>BBa_K3257113</td> |
| − | return false;
| + | <td><a href="http://parts.igem.org/Part:BBa_K3257113"><u>Chl<sup>R</sup>_Y92X</u></a></td> |
| − | });
| + | <td>Y92X mutant of Chl<sup>R</sup> gene with regulatory elements.</td> |
| | + | </tr> |
| | + | <tr> |
| | + | <td>BBa_K3257114</td> |
| | + | <td><a href="http://parts.igem.org/Part:BBa_K3257114"><u>Chl<sup>R</sup>_E97X</u></a></td> |
| | + | <td>E97X mutant of Chl<sup>R</sup> gene with regulatory elements.</td> |
| | + | </tr> |
| | + | <tr> |
| | + | <td>BBa_K3257115</td> |
| | + | <td><a href="http://parts.igem.org/Part:BBa_K3257115"><u>Chl<sup>R</sup>_S121X</u></a></td> |
| | + | <td>S121X mutant of Chl<sup>R</sup> gene with regulatory elements.</td> |
| | + | </tr> |
| | + | <tr> |
| | + | <td>BBa_K3257116</td> |
| | + | <td><a href="http://parts.igem.org/Part:BBa_K3257116"><u>Chl<sup>R</sup>_L158X</u></a></td> |
| | + | <td>L158X mutant of Chl<sup>R</sup> gene with regulatory elements.</td> |
| | + | </tr> |
| | + | <tr> |
| | + | <td>BBa_K3257117</td> |
| | + | <td><a href="http://parts.igem.org/Part:BBa_K3257117"><u>Chl<sup>R</sup>_K182X</u></a></td> |
| | + | <td>K182X mutant of Chl<sup>R</sup> gene with regulatory elements.</td> |
| | + | </tr> |
| | + | <tr> |
| | + | <td>BBa_K3257118</td> |
| | + | <td><a href="http://parts.igem.org/Part:BBa_K3257118"><u>Chl<sup>R</sup>_Q190X</u></a></td> |
| | + | <td>Q190X mutant of Chl<sup>R</sup> gene with regulatory elements.</td> |
| | + | </tr> |
| | + | </table> |
| | + | </div> |
| | + | </div> |
| | | | |
| | + | <div id="section3" class="section container scrolSpy"> |
| | + | <h2>The Reverse Transcription Initiation Collection</h2> |
| | + | <p class="flow-text">This collection includes the components necessary for the reverse transcription initiation, in which tRNA<sup>Pro</sup> and PBS acts as a primer and its binding site, and others are involved in the first and second strand transfer process.</p> |
| | + | <div class="tableHolder"> |
| | + | <table> |
| | + | <tr> |
| | + | <th>Part Number</th> |
| | + | <th>Part Name</th> |
| | + | <th>Notes</th> |
| | + | </tr> |
| | + | <tr> |
| | + | <td>BBa_K3257060</td> |
| | + | <td><a target="_blank" href="http://parts.igem.org/Part:BBa_K3257060">PolyPurine Tract(PPT)</a></td> |
| | + | <td>Involved in the first strand transfer in reverse transcription process</td> |
| | + | </tr> |
| | + | <tr> |
| | + | <td>BBa_K3257061</td> |
| | + | <td><a target="_blank" href="http://parts.igem.org/Part:BBa_K3257061">R Region</a></td> |
| | + | <td>Involved in the first strand transfer in reverse transcription process</td> |
| | + | </tr> |
| | + | <tr> |
| | + | <td>BBa_K3257062</td> |
| | + | <td><a target="_blank" href="http://parts.igem.org/Part:BBa_K3257062">U5 Region</a></td> |
| | + | <td>Important for primer binding and virus encapsidation</td> |
| | + | </tr> |
| | + | <tr> |
| | + | <td>BBa_K3257063</td> |
| | + | <td><a target="_blank" href="http://parts.igem.org/Part:BBa_K3257063">Primer Binding Site(PBS)</a></td> |
| | + | <td>Providing bingding site for reverse transcriptase</td> |
| | + | </tr> |
| | + | <tr> |
| | + | <td>BBa_K3257076</td> |
| | + | <td><a target="_blank" href="http://parts.igem.org/Part:BBa_K3257076">tRNA Primer</a></td> |
| | + | <td>Initiating the reverse transcription process</td> |
| | + | </tr> |
| | + | </table> |
| | + | </div> |
| | + | </div> |
| | | | |
| − | $(window).scroll(function(){
| + | <div id="section4" class="section container scrolSpy"> |
| − |
| + | <h2>The Degradation Tag Collection</h2> |
| − | var currentScroll=$(this).scrollTop();
| + | <p class="flow-text">This collection includes 5 different degradation tags with different degradation rate and steady-state concentration when fused after a CDS of a protein. We have measured the induction curve and growth curve of BL21(DE3) containing EGFP fused with degradation tags <a href="#Fig1">(Figure 1)</a>.</p> |
| − | var firstHeight=$("#pageCover").height();
| + | <div class="tableHolder"> |
| − | var footerFromTop=$("#FudanFooter").offset().top;
| + | <table> |
| − | var $currentSection=null;
| + | <tr> |
| − | $(".leftNavA").each(function(){
| + | <th>Part Number</th> |
| − | $('.leftNavA').removeClass('menu-active');
| + | <th>Part Name</th> |
| − | var hePoint=$($(this).attr("href"));
| + | <th>Notes</th> |
| − | var divPosition=hePoint.offset().top-$("#navUl").height()-50;
| + | </tr> |
| − | if (divPosition-1<currentScroll){
| + | <tr> |
| − | $currentSection=$(this);
| + | <td>BBa_K3257069</td> |
| − | }
| + | <td><a target="_blank" href="http://parts.igem.org/Part:BBa_K3257069">SsrA(LAA)</a></td> |
| − | if (currentScroll>firstHeight){
| + | <td>LAA stands for the last 3 amino acid residues of this degradation tag and this is a widely-used wild-type tag.</td> |
| − | $(".leftNavA").removeClass("menu-active");
| + | </tr> |
| − | $currentSection.addClass("menu-active");
| + | <tr> |
| − | }
| + | <td>BBa_K3257070</td> |
| − | });
| + | <td><a target="_blank" href="http://parts.igem.org/Part:BBa_K3257070">SsrA(LAV)</a></td> |
| − |
| + | <td>LAV stands for the last 3 amino acid residues of this degradation tag and it is mutated from SsrA(LAA).</td> |
| − | var $currentSection2;
| + | </tr> |
| − | $('.leftNavA2').each(function(){
| + | <tr> |
| − | $('.leftNavA2').removeClass('menu-active2');
| + | <td>BBa_K3257071</td> |
| − | var hePoint2=$($(this).attr("href"));
| + | <td><a target="_blank" href="http://parts.igem.org/Part:BBa_K3257071">SsrA(LVA)</a></td> |
| − | var divPosition2=hePoint2.offset().top-$("#navUl").height()-50;
| + | <td>LVA stands for the last 3 amino acid residues of this degradation tag and it is mutated from SsrA(LAA).</td> |
| − | if (divPosition2-1<currentScroll){
| + | </tr> |
| − | $currentSection2=$(this);
| + | <tr> |
| − | }
| + | <td>BBa_K3257072</td> |
| − | if (currentScroll>firstHeight){
| + | <td><a target="_blank" href="http://parts.igem.org/Part:BBa_K3257072">SsrA(LVV)</a></td> |
| − | $('.leftNavA2').removeClass('menu-active2');
| + | <td>LVA stands for the last 3 amino acid residues of this degradation tag and it is mutated from SsrA(LAA).</td> |
| − | $currentSection2.addClass('menu-active2');
| + | </tr> |
| − | }
| + | <tr> |
| − | });
| + | <td>BBa_K3257073</td> |
| − | });
| + | <td><a target="_blank" href="http://parts.igem.org/Part:BBa_K3257073">SsrA(WVLAA)</a></td> |
| | + | <td>WVLAA stands for the last 5 amino acid residues of this degradation tag and it is mutated from SsrA(LAA).</td> |
| | + | </tr> |
| | + | </table> |
| | + | </div> |
| | + | </div> |
| | | | |
| − | </script>
| + | <div id="section5" class="section container scrolSpy"> |
| | + | <h2>The Cre Recombinase with Degradation Tags Collection</h2> |
| | + | <p class="flow-text">Combined with Degradation Tags Collection, the leakage of Cre recombinase is solved and difference in expression level between Cre and RT is achieved in an easier way. The steady state concentration of Cre recombinase lowers to a functional level.</p> |
| | + | <div class="tableHolder"> |
| | + | <table> |
| | + | <tr> |
| | + | <th>Part Number</th> |
| | + | <th>Part Name</th> |
| | + | <th>Notes</th> |
| | + | </tr> |
| | + | <tr> |
| | + | <td>BBa_K3257101</td> |
| | + | <td><a target="_blank" href="http://parts.igem.org/Part:BBa_K3257101">Cre with SsrA(WVLAA)</a></td> |
| | + | <td>Cre recombinase tightly attached with SSr(WVLAA)</td> |
| | + | </tr> |
| | + | <tr> |
| | + | <td>BBa_K3257102</td> |
| | + | <td><a target="_blank" href="http://parts.igem.org/Part:BBa_K3257102">Cre with SsrA(LAA)</a></td> |
| | + | <td>Cre recombinase tightly attached with SSr(LAA)</td> |
| | + | </tr> |
| | + | <tr> |
| | + | <td>BBa_K3257103</td> |
| | + | <td><a target="_blank" href="http://parts.igem.org/Part:BBa_K3257103">Cre with SsrA(LAV)</a></td> |
| | + | <td>Cre recombinase tightly attached with SSr(LAV)</td> |
| | + | </tr> |
| | + | <tr> |
| | + | <td>BBa_K3257104</td> |
| | + | <td><a target="_blank" href="http://parts.igem.org/Part:BBa_K3257104">Cre with SsrA(LVA)</a></td> |
| | + | <td>Cre recombinase tightly attached with SSr(LVA)</td> |
| | + | </tr> |
| | + | <tr> |
| | + | <td>BBa_K3257105</td> |
| | + | <td><a target="_blank" href="http://parts.igem.org/Part:BBa_K3257105">Cre with SsrA(LVV)</a></td> |
| | + | <td>Cre recombinase tightly attached with SSr(LVV)</td> |
| | + | </tr> |
| | + | </table> |
| | + | </div> |
| | + | </div> |
| | | | |
| − |
| + | <div id="section6" class="section container scrolSpy"> |
| − | <script src="https://2019.igem.org/wiki/index.php?title=Template:Fudan-TSI/popper.min.js&action=raw&ctype=text/javascript" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
| + | <h2>The lox Sites Collection</h2> |
| − | <script src="https://2019.igem.org/wiki/index.php?title=Template:Fudan-TSI/bootstrap.js&action=raw&ctype=text/javascript" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
| + | |
| | | | |
| | + | <div class="tableHolder"> |
| | + | <table> |
| | + | <tr> |
| | + | <th>Part Number</th> |
| | + | <th>Part Name</th> |
| | + | <th>Notes</th> |
| | + | </tr> |
| | + | <tr> |
| | + | <td>BBa_K3257064</td> |
| | + | <td><a target="_blank" href="http://parts.igem.org/Part:BBa_K3257064">loxP</a></td> |
| | + | <td>Wild-type lox site that can be recognized by Cre recombinase.</td> |
| | + | </tr> |
| | + | <tr> |
| | + | <td>BBa_K3257074</td> |
| | + | <td><a target="_blank" href="http://parts.igem.org/Part:BBa_K3257074">lox2272</a></td> |
| | + | <td>Orthogonal lox site mutated from loxP.</td> |
| | + | </tr> |
| | + | <tr> |
| | + | <td>BBa_K3257075</td> |
| | + | <td><a target="_blank" href="http://parts.igem.org/Part:BBa_K3257075">lox5171</a></td> |
| | + | <td>Orthogonal lox site mutated from loxP.</td> |
| | + | </tr> |
| | + | </table> |
| | + | </div> |
| | | | |
| | + | <p class="flow-text">This collection includes 4 different types of lox sites. The lox511, lox2272, lox5171 are all orthogonal to loxP as we can see from their inability to be knocked out by Cre if there are loxP on one side and other lox sites on the other side.</p> |
| | + | <p class="flow-text">After double transformation, colony PCR was done and agarose gel shows that there remains the original DNA fragment.</p> |
| | + | </div> |
| | | | |
| − |
| + | <!--//////////////////////////////////////////////////// |
| − |
| + | do not edit below, if must BE CAREFUL |
| − |
| + | //////////////////////////////////////////////////////--> |
| − |
| + | </article></main></div><!-- end of side navigator and main of the page --> |
| − |
| + | |
| − |
| + | |
| − |
| + | |
| | | | |
| − | <!------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- Content ends ---------------------------------------------------------------------------------------------------------------------------------> | + | <!-- Floating Btns, Footer with sponsors --> |
| − | <!----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------> | + | <div class="floatingBtn"> <a href="#FudanTSIdivWrapper" class="btn"> <i class="fa fa-angle-up" style="font-size:48px;line-height:45px"></i> </a></div> <footer id="FudanTSIfooter" class="page-footer blue-grey darken-1"><div class="container"><div class="row"><div id="sponsor" class="col m3 s12 row"> <a href="https://2019.igem.org/Team:Fudan-TSI"><img alt="2019 Team:Fudan-TSI logo white" class="col s3 m6 l3" style="position:relative; padding: 0.45em 0.3rem; margin:-0.15rem 0; left: -0.45rem;" src="https://static.igem.org/mediawiki/2019/0/0f/T--Fudan-TSI--LogoGrey.gif"> </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"> </a><a href="http://life.fudan.edu.cn/" target="_blank"><img class="col s3 m6 l3" style="margin-bottom: 4%;/* fig should be smaller, 2018 ht */" alt="School of Life Sciences, Fudan University" src="https://static.igem.org/mediawiki/2018/1/1d/T--Fudan--schoolOfLifeSciencesIcon.png"> </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"> </a><h3 class="col s12" style="text-align:left;font-size:12.5px">R-Evolution: an <i>in vivo</i> sequence-specific toolbox for continuous mutagenesis</h3></div><div id="footerNavList" class="col m9 s12 row"><div class="col s12 l6 row"><div class="col s12 m4"> <span><a href="/Team:Fudan-TSI/Description">Project</a></span><ul><li><a href="/Team:Fudan-TSI/Description">Background</a></li><li><a href="/Team:Fudan-TSI/Design">Design</a></li><li><a href="/Team:Fudan-TSI/Experiments">Experiments</a></li><li><a href="/Team:Fudan-TSI/Applied_Design">Applied design</a></li><li><a href="/Team:Fudan-TSI/Judging">Judging</a></li></ul></div><div class="col s12 m4"> <span><a href="/Team:Fudan-TSI/Demonstrate">Results</a></span><ul><li><a href="/Team:Fudan-TSI/Demonstrate#ReverseTranscription">Reverse transcription</a></li><li><a href="/Team:Fudan-TSI/Demonstrate#Recombination">Recombination</a></li><li><a href="/Team:Fudan-TSI/Demonstrate">Demonstration</a></li><li><a href="/Team:Fudan-TSI/Measurement">Measurement</a></li><li><a href="/Team:Fudan-TSI/Notebook">Notebook</a></li></ul></div><div class="col s12 m4"> <span><a href="/Team:Fudan-TSI/Model">Model</a></span><ul><li><a href="/Team:Fudan-TSI/Model">Modeling</a></li><li><a href="/Team:Fudan-TSI/Software">Software</a></li><li><a href="/Team:Fudan-TSI/Hardware">Hardware</a></li></ul></div></div><div class="col s12 l6 row"><div class="col s12 m4 active"> <span><a href="/Team:Fudan-TSI/Parts">Parts</a></span><ul><li><a href="/Team:Fudan-TSI/Basic_Part">Basic parts</a></li><li><a href="/Team:Fudan-TSI/Composite_Part">Composite parts</a></li><li><a href="/Team:Fudan-TSI/Improve">Part improvement</a></li><li><a href="/Team:Fudan-TSI/Part_Collection">Part collection</a></li></ul></div><div class="col s12 m4"> <span><a href="/Team:Fudan-TSI/Human_Practices">Outreach</a></span><ul><li><a href="/Team:Fudan-TSI/Public_Engagement">Public engagement</a></li><li><a href="/Team:Fudan-TSI/Human_Practices#IntegratedHumanPractice">Integrated HP</a></li><li><a href="/Team:Fudan-TSI/Collaborations">Collaborations</a></li><li><a href="/Team:Fudan-TSI/Safety">Safety</a></li></ul></div><div class="col s12 m4"> <span><a href="/Team:Fudan-TSI/Team">Team</a></span><ul><li><a href="/Team:Fudan-TSI/Team">Members</a></li><li><a href="/Team:Fudan-TSI/Attributions">Attributions</a></li><li><a href="/Team:Fudan-TSI/Team#Acknowledge">Acknowledge</a></li><li><a href="/Team:Fudan-TSI/Heritage">Heritage</a></li></ul></div><div class="col s12 m4"> </div></div></div></div></div><div class="footer-copyright"><div class="container"><div class="contactUS row"><div class="col s12 m6 l4"><i class="fa fa-location-arrow"></i> Life Sci Bldg, 2005 Songhu Rd, Shanghai</div><div class="col s12 m6 l2"><i class="fa fa-fax"></i> +86-21-31246727</div><div class="col s12 m6 l2"><i class="fa fa-envelope-o"></i> igem@fudan.edu.cn</div><div class="col s12 m6 l4"><i class="fa fa-twitter"></i> <i class="fa fa-wechat"></i> Fudan_iGEM</div></div></div></div> </footer> |
| | + | </div></div></div><!-- #pageContent #FudanTSIBody #FudanTSIdivWrapper --> |
| | | | |
| | + | <script src="https://2019.igem.org/wiki/index.php?title=Template:Fudan-TSI/materialize.js&action=raw&ctype=text/javascript"></script><!-- Materialize 1.0.0-rc.2 --> |
| | + | <script src="https://2019.igem.org/wiki/index.php?title=Template:Fudan-TSI/Fudan-js.js&action=raw&ctype=text/javascript"></script> |
| | + | </body> |
| | </html> | | </html> |
