Difference between revisions of "Team:JiangnanU China"

Line 1: Line 1:
 
{{:Team:JiangnanU_China/Header}}
 
{{:Team:JiangnanU_China/Header}}
−
<html>
+
<html lang="en">
 
<head>
 
<head>
−
     <meta charset="utf-8" />
+
     <meta charset="UTF-8">
−
    <title>JiangNan</title>
+
−
    <meta name="description" content="An iGEM project" />
+
−
    <meta name="author" content="Yifan Liu" />
+
−
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
+
−
 
+
−
    <!-- FONT -->
+
−
    <link href="http://fonts.googleapis.com/css?family=Comfortaa|Lato|Raleway:400,300,600" rel="stylesheet" type="text/css" />
+
−
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
+
−
 
+
−
    <!-- CSS -->
+
−
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
+
−
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.7.1/katex.min.css" integrity="sha384-wITovz90syo1dJWVh32uuETPVEtGigN07tkttEqPv+uR2SE/mbQcG7ATL28aI9H0" crossorigin="anonymous">
+
−
    <link rel="stylesheet" href="https://2019.igem.org/Team:JiangnanU_China/css/custom?action=raw&ctype=text/css" />
+
−
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.4.1/css/all.css" integrity="sha384-5sAR7xN1Nv6T6+dT2mhtzEpVJvfS3NScPQTrOxhwjIuvcA67KV2R5Jz6kr4abQsz" crossorigin="anonymous">
+
−
 
+
−
    <!-- JS -->
+
−
    <script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>
+
−
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
+
−
    <script src="https://use.fontawesome.com/b31c04f526.js"></script>
+
−
 
+
−
    <!-- KATEX -->
+
−
    <script src="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.7.1/katex.min.js" integrity="sha384-/y1Nn9+QQAipbNQWU65krzJralCnuOasHncUFXGkdwntGeSvQicrYkiUBwsgUqc1" crossorigin="anonymous"></script>
+
−
    <script src="https://2017.igem.org/Team:TUDelft/js/auto-render?action=raw&ctype=text/javascript" type="text/javascript"></script>
+
−
    <script>
+
−
        document.addEventListener("DOMContentLoaded", function() {
+
−
            renderMathInElement(document.body, {
+
−
                delimiters: [{
+
−
                    left: "$$",
+
−
                    right: "$$",
+
−
                    display: true
+
−
                },
+
−
                    {
+
−
                        left: "\\[",
+
−
                        right: "\\]",
+
−
                        display: true
+
−
                    },
+
−
                    {
+
−
                        left: "$",
+
−
                        right: "$",
+
−
                        display: false
+
−
                    },
+
−
                    {
+
−
                        left: "\\(",
+
−
                        right: "\\)",
+
−
                        display: false
+
−
                    }
+
−
                ],
+
−
                throwOnError: false,
+
−
                macros: {
+
−
                    '\\tag': '\\pod\\text'
+
−
                }
+
−
            });
+
−
            var eqno = document.querySelectorAll(".katex span > span.mspace.quad");
+
−
            for (var i = 0; i < eqno.length; ++i) {
+
−
                if (eqno[i].parentNode.className)
+
−
                    continue;
+
−
                var quad = eqno[i];
+
−
                var span = quad.parentNode;
+
−
                var text = span.nextSibling;
+
−
                var pare = text.nextSibling;
+
−
                span.removeChild(quad);
+
−
                span.appendChild(text);
+
−
                span.appendChild(pare);
+
−
                span.className = 'eqno';
+
−
            }
+
−
        });
+
−
    </script>
+
−
 
+
−
    <!-- 标题栏logo -->
+
−
    <link rel="icon" type="image/jpg" href="https://static.igem.org/mediawiki/2019/3/34/T--JiangnanU_China--Logo-Web_version.jpg" />
+
−
 
+
 
     <style>
 
     <style>
−
         @media screen and (min-width: 768px){
+
         #first {
−
             CSS
+
            background-image: url('https://static.igem.org/mediawiki/2019/c/c2/T--JiangnanU_China--host_bg.png');
 +
             background-size: cover;
 +
            background-position: center;
 +
            background-repeat: no-repeat;
 
         }
 
         }
−
        /*总背景*/
+
 
−
         #custom-nav {
+
         .box {
−
             background-color: rgba(0, 19, 86,1);
+
             height: 100vh;
−
             border: 0;
+
             display: flex;
−
             box-shadow: none;
+
             flex-direction: column;
−
             z-index: 999;
+
             justify-content: center;
−
             -webkit-transition: background .5s ease-in-out, opacity .5s ease;
+
             align-items: center;
−
             -moz-transition: background .5s ease-in-out, opacity .5s ease;
+
             /*margin-top: -100px;*/
−
             transition: background .5s ease-in-out, opacity .5s ease;
+
             position: relative;
−
            margin-right: -15px;
+
 
         }
 
         }
−
         /*二级菜单*/
+
 
−
         #custom-nav .dropdown-menu {
+
         /*跳转按钮*/
−
             float: right;
+
         .rdmrbttn img {
−
            border-radius: 0;
+
             width: 10%;
−
            border: none;
+
             height: auto;
−
            border-top: 5px solid transparent;
+
−
            background-color: rgba(0,19,86,1);
+
−
            -webkit-box-shadow: none;
+
−
            box-shadow: none;
+
−
             padding-top: 0;
+
 
         }
 
         }
−
         #custom-nav .dropdown-menu a{
+
 
−
             color: white;
+
         .rdmrbttn {
 +
             position: absolute;
 +
            top: 88%;
 +
            left: 20%;
 
         }
 
         }
−
         #custom-nav .dropdown-menu a:hover{
+
 
−
             background: rgb(0, 178, 255);
+
        /*缩略图*/
 +
         .thumbnail img {
 +
             opacity: 0.7;
 
         }
 
         }
−
         #custom-nav .container {
+
 
−
            padding-top: 25px;
+
         .thumbnail:hover {
−
            padding-bottom: 25px;
+
             -webkit-transform: scale(1.05);
−
             -webkit-transition: padding-top .5s ease, padding-bottom .5s ease;
+
             -ms-transform: scale(1.05);
−
             -moz-transition: padding-top .5s ease, padding-bottom .5s ease;
+
             transform: scale(1.05);
−
             transition: padding-top .5s ease, padding-top .5s ease, padding-bottom .5s ease;
+
 
         }
 
         }
−
         #custom-nav.affix {
+
 
−
             top: 0;
+
         .thumbnail:hover img {
−
            min-width: 100%;
+
             opacity: 1;
−
            background-color: rgba(0,19,86,0.7);
+
−
            /* opacity: 0.9; */
+
−
            -webkit-transition: background .5s ease-in-out, opacity .5s ease;
+
−
            -moz-transition: background .5s ease-in-out, opacity .5s ease;
+
−
            transition: background .5s ease-in-out, opacity .5s ease;
+
−
            margin-right: 15px;
+
−
        }
+
−
        @media screen and (max-width: 767px){
+
−
            #wrapwrap {
+
−
                padding-top: 50px;
+
−
            }
+
−
            .navbar-fixed-top {
+
−
                z-index: 999;
+
−
            }
+
 
         }
 
         }
  
−
         /* navbar
+
         /*///////////////////////////////*/
−
        .navbar-default {
+
 
−
            background-color: #0092CB;
+
         /*//////////////////*/
−
            border-color: #E7E7E7;
+
         .top {
−
        }*/
+
             width: 30%;
−
        /* Title */
+
             height: auto;
−
        .navbar-default .navbar-brand {
+
             position: absolute;
−
            color: #FFFFFF;
+
             top: 20%;
−
        }
+
             left: 20%;
−
        .navbar-default .navbar-brand:hover,
+
−
        .navbar-default .navbar-brand:focus {
+
−
            color: #5E5E5E;
+
−
        }
+
−
         /* Link */
+
−
        .navbar-default .navbar-nav > li > a {
+
−
            color: #FFFFFF;
+
−
        }
+
−
        .navbar-default .navbar-nav > li > a:hover,
+
−
        .navbar-default .navbar-nav > li > a:focus {
+
−
            color: #555;
+
−
        }
+
−
        .navbar-default .navbar-nav > .active > a,
+
−
        .navbar-default .navbar-nav > .active > a:hover,
+
−
        .navbar-default .navbar-nav > .active > a:focus {
+
−
            color: #555;
+
−
            background-color: #E7E7E7;
+
−
        }
+
−
        .navbar-default .navbar-nav > .open > a,
+
−
        .navbar-default .navbar-nav > .open > a:hover,
+
−
        .navbar-default .navbar-nav > .open > a:focus {
+
−
            color: #555;
+
−
            background-color: rgba(0,19,86,1);
+
−
        }
+
−
        /* Caret */
+
−
         .navbar-default .navbar-nav > .dropdown > a .caret {
+
−
             border-top-color: #FFFFFF;
+
−
             border-bottom-color: #FFFFFF;
+
−
        }
+
−
        .navbar-default .navbar-nav > .dropdown > a:hover .caret,
+
−
        .navbar-default .navbar-nav > .dropdown > a:focus .caret {
+
−
             border-top-color: #555;
+
−
             border-bottom-color: #555;
+
−
        }
+
−
        .navbar-default .navbar-nav > .open > a .caret,
+
−
        .navbar-default .navbar-nav > .open > a:hover .caret,
+
−
        .navbar-default .navbar-nav > .open > a:focus .caret {
+
−
            border-top-color: #555;
+
−
             border-bottom-color: #555;
+
−
        }
+
−
        /* Mobile version */
+
−
        .navbar-default .navbar-toggle {
+
−
            border-color: #FFF;
+
 
         }
 
         }
  
−
         .navbar-default .navbar-toggle:hover,
+
         .dna {
−
        .navbar-default .navbar-toggle:focus {
+
            width: 30%;
−
             background-color: #DDD;
+
            height: auto;
 +
             margin-right: 5%;
 
         }
 
         }
−
         .navbar-default .navbar-toggle .icon-bar {
+
         .block{
−
             background-color: #FFF;
+
            width: 25%;
 +
            height: auto;
 +
            display: flex;
 +
            flex-direction: column;
 +
            justify-content: center;
 +
             align-content: center;
 
         }
 
         }
−
         @media (max-width: 767px) {
+
         .block img{
−
             .navbar-default .navbar-nav .open .dropdown-menu > li > a {
+
             width: 40%;
−
                color: #FFFF;
+
             height: auto;
−
             }
+
−
            .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
+
−
            .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
+
−
                color: white;
+
−
            }
+
 
         }
 
         }
 +
    </style>
 +
</head>
 +
<body style="margin: 0">
  
−
/*/////////////////////////////////////////////////*/
+
<header id="first" class="box">
  
−
        .chosen_bar{
+
    <img class="top" src="https://static.igem.org/mediawiki/2019/9/9c/T--JiangnanU_China--host_top_text.png" alt="">
−
            top: -10px;
+
    <div class="rdmrbttn"><a href="#second" class="thumbnail"><img style="width: 15%;height: auto"
−
            position: absolute;
+
                                                                  src="https://static.igem.org/mediawiki/2019/0/09/T--JiangnanU_China--host_liubianxing.png"></a>
−
            width:100%;
+
    </div>
−
            height: 10px;
+
−
        }
+
−
        .adopeicon {
+
−
            height: 40px;
+
−
            width: auto;
+
−
            margin: 10px;
+
−
            padding-left: 10px;
+
−
        }
+
  
−
    </style>
+
</header>
−
    <script>
+
−
        $(window).scroll(function() {
+
−
            if ($(".navbar").offset().top > 50) {
+
−
                $('#custom-nav').addClass('affix');
+
−
                $(".navbar-fixed-top").addClass("top-nav-collapse");
+
−
            } else {
+
−
                $('#custom-nav').removeClass('affix');
+
−
                $(".navbar-fixed-top").removeClass("top-nav-collapse");
+
−
            }
+
−
        });
+
−
    </script>
+
  
 +
<div id="second" class="box" style="flex-direction: row">
 +
    <img class="dna" src="https://static.igem.org/mediawiki/2019/3/38/T--JiangnanU_China--host_circle.png" alt="">
 +
    <p style="width: 40%;margin-left: 5%">What is ‘TOP’<br>
 +
        Our aim is to construct a device which will increase the fermentation strains’ phage tolerance while
 +
        wouldn’t have apparent effect on their growth.
 +
        We want to develop an innovative methodology towards the prevention and control of phage infection in
 +
        factories. And now we are devoted to studying the interaction mechanism between phages and bacteria. We
 +
        firmly believe that this anti-phage biobrick can enhance the potential for open fermentation. [333333 Futura
 +
        Medium 22pt 1.5倍行距]
 +
    </p>
 +
    <div class="rdmrbttn"><a href="#third" class="thumbnail"><img style="width: 15%;height: auto"
 +
                                                                  src="https://static.igem.org/mediawiki/2019/b/bb/T--JiangnanU_China--host_next.png"></a>
 +
    </div>
 +
</div>
  
−
</head>
+
<div id="third" class="box" style="flex-direction: row">
−
<body>
+
  
−
<header>
+
    <div class="block">
 +
        <img src="https://static.igem.org/mediawiki/2019/2/24/T--JiangnanU_China--host_back.png"alt="">
 +
    </div>
 +
    <div class="block">
 +
        <img src="https://static.igem.org/mediawiki/2019/2/24/T--JiangnanU_China--host_back.png"alt="">
 +
    </div>
 +
    <div class="block">
 +
        <img src="https://static.igem.org/mediawiki/2019/2/24/T--JiangnanU_China--host_back.png"alt="">
 +
    </div>
 +
    <div class="rdmrbttn"><a href="#first" class="thumbnail"><img style="width: 15%;height: auto"
 +
                                                                  src="https://static.igem.org/mediawiki/2019/2/24/T--JiangnanU_China--host_back.png"></a>
 +
    </div>
 +
</div>
  
−
    <nav class="navbar navbar-default navbar-fixed-top" id="custom-nav" style="margin:15px;">
 
−
        <div class="container-fluid">
 
−
            <div class="navbar-header">
 
−
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#adopenav" aria-expanded="false">
 
−
                    <span class="sr-only"></span>
 
−
                    <span class="icon-bar"></span>
 
−
                    <span class="icon-bar"></span>
 
−
                    <span class="icon-bar"></span>
 
−
                </button>
 
−
                <!-- 顶部栏logo -->
 
−
                <a class="pull-left" href="https://2019.igem.org/Team:JiangnanU_China" style="color: white"><img class="adopeicon" src="https://static.igem.org/mediawiki/2019/3/34/T--JiangnanU_China--Logo-Web_version.jpg">JiangnanU_China</a>
 
−
            </div>
 
−
            <div class="collapse navbar-collapse" id="adopenav"  >
 
−
                <ul class="nav navbar-nav">
 
−
                    <!-- Project -->
 
−
                    <li class="dropdown">
 
−
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Project</a>
 
−
                        <ul class="dropdown-menu" >
 
−
                            <li><img class="chosen_bar" src="https://static.igem.org/mediawiki/2019/3/31/T--JiangnanU_China--chosen_bar.jpg" alt="  "></li>
 
−
                            <li><a href="https://2019.igem.org/Team:JiangnanU_China/Description">Description</a></li>
 
−
                            <li><a href="https://2019.igem.org/Team:JiangnanU_China/Design">Design</a></li>
 
−
                            <li><a href="https://2019.igem.org/Team:JiangnanU_China/Results">Results</a></li>
 
−
                            <li><a href="https://2019.igem.org/Team:JiangnanU_China/Demonstrate">Demonstration</a></li>
 
−
                        </ul>
 
−
                    </li>
 
−
                    <!-- Wetlab -->
 
−
                    <li class="dropdown">
 
−
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Wetlab</a>
 
−
                        <ul class="dropdown-menu">
 
−
                            <li><img class="chosen_bar" src="https://static.igem.org/mediawiki/2019/3/31/T--JiangnanU_China--chosen_bar.jpg" alt="  "></li>
 
−
                            <li><a href="https://2019.igem.org/Team:JiangnanU_China/Experiments">Experiments (Protocols)</a></li>
 
−
                            <li><a href="https://2019.igem.org/Team:JiangnanU_China/Notebook">Notebook</a></li>
 
−
                            <li><a href="https://2019.igem.org/Team:JiangnanU_China/InterLab">InterLab</a></li>
 
−
                            <li><a href="https://2019.igem.org/Team:JiangnanU_China/Safety">Safety</a></li>
 
−
                            <li><a href="https://2019.igem.org/Team:JiangnanU_China/Measurement">Measurement</a></li>
 
−
                        </ul>
 
−
                    </li>
 
−
                    <!-- Parts -->
 
−
                    <li class="dropdown">
 
−
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Parts</a>
 
−
                        <ul class="dropdown-menu">
 
−
                            <li><img class="chosen_bar" src="https://static.igem.org/mediawiki/2019/3/31/T--JiangnanU_China--chosen_bar.jpg" alt="  "></li>
 
−
                            <li><a href="https://2019.igem.org/Team:JiangnanU_China/Parts">Parts Overview</a></li>
 
−
                            <li><a href="https://2019.igem.org/Team:JiangnanU_China/Basic_Part">Basic Parts</a></li>
 
−
                            <li><a href="https://2019.igem.org/Team:JiangnanU_China/Composite_Parts">Composite Parts</a></li>
 
−
                            <li><a href="https://2019.igem.org/Team:JiangnanU_China/Part_Collection">Part Collection</a></li>
 
−
                            <li><a href="https://2019.igem.org/Team:JiangnanU_China/Primers">Sequences</a></li>
 
−
                        </ul>
 
−
                    </li>
 
−
                    <!-- Modeling -->
 
−
                    <li class="dropdown">
 
−
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Modeling</a>
 
−
                        <ul class="dropdown-menu">
 
−
                            <li><img class="chosen_bar" src="https://static.igem.org/mediawiki/2019/3/31/T--JiangnanU_China--chosen_bar.jpg" alt="  "></li>
 
−
                            <li><a href="https://2019.igem.org/Team:JiangnanU_China/Model">Model</a></li>
 
−
                            <li><a href="https://2019.igem.org/Team:JiangnanU_China/Software">Software Tool</a></li>
 
−
                            <li><a href="https://2019.igem.org/Team:JiangnanU_China/Improve">Improvement</a></li>
 
−
                        </ul>
 
−
                    </li>
 
−
                    <!-- Human Practices -->
 
−
                    <li class="dropdown">
 
−
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Human Practices</a>
 
−
                        <ul class="dropdown-menu">
 
−
                            <li><img class="chosen_bar" src="https://static.igem.org/mediawiki/2019/3/31/T--JiangnanU_China--chosen_bar.jpg" alt="  "></li>
 
−
                            <li><a href="https://2019.igem.org/Team:JiangnanU_China/Human_Practices">Integrated Human Practices</a></li>
 
−
                            <li><a href="https://2019.igem.org/Team:JiangnanU_China/Public_Engagement">Education and Engagement</a></li>
 
−
                            <li><a href="https://2019.igem.org/Team:JiangnanU_China/Entrepreneurship">Entrepreneurship</a></li>
 
−
                            <li><a href="https://2019.igem.org/Team:JiangnanU_China/Applied_Design">Applied Design</a></li>
 
−
                        </ul>
 
−
                    </li>
 
−
                    <!-- EurAsian Meetup -->
 
−
                    <li><a href="https://2019.igem.org/Team:JiangnanU_China/Meetup">Meetup</a></li>
 
−
                    <!-- Team -->
 
−
                    <li class="dropdown">
 
−
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Team</a>
 
−
                        <ul class="dropdown-menu">
 
−
                            <li><img class="chosen_bar" src="https://static.igem.org/mediawiki/2019/3/31/T--JiangnanU_China--chosen_bar.jpg" alt="  "></li>
 
−
                            <li><a href="https://2019.igem.org/Team:JiangnanU_China/Team">Team Members</a></li>
 
−
                            <li><a href="https://2019.igem.org/Team:JiangnanU_China/Collaborations">Collaborations</a></li>
 
−
                            <li><a href="https://2019.igem.org/Team:JiangnanU_China/Contributions">Contributions</a></li>
 
−
                            <li><a href="https://2019.igem.org/Team:JiangnanU_China/Team_Building">Team Building</a></li>
 
−
                        </ul>
 
−
                    </li>
 
−
                    <!-- Acknowledgements -->
 
−
                    <li class="dropdown">
 
−
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Acknowledgements</a>
 
−
                        <ul class="dropdown-menu">
 
−
                            <li><img class="chosen_bar" src="https://static.igem.org/mediawiki/2019/3/31/T--JiangnanU_China--chosen_bar.jpg" alt="  "></li>
 
−
                            <li><a href="https://2019.igem.org/Team:JiangnanU_China/Attributions">Attributions</a></li>
 
−
                            <li><a href="https://2019.igem.org/Team:JiangnanU_China/Sponsors">Sponsors</a></li>
 
−
                        </ul>
 
−
                    </li>
 
−
                    <!-- awards -->
 
−
                    <li class="dropdown">
 
−
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><i class="fa fa-trophy"></i></a>
 
−
                        <ul class="dropdown-menu">
 
−
                            <li><img class="chosen_bar" src="https://static.igem.org/mediawiki/2019/3/31/T--JiangnanU_China--chosen_bar.jpg" alt="  "></li>
 
−
                            <li><a href="https://igem.org/2019_Judging_Form?team=JiangnanU_China">Judging form</a></li>
 
−
                            <li><a href="https://2019.igem.org/Team:TUDelft/Medals">Medal Requirements</a></li>
 
−
                            <li><a href="https://2019.igem.org/Team:TUDelft/Awards">Awards</a></li>
 
−
                        </ul>
 
−
                    </li>
 
−
                </ul>
 
−
            </div>
 
−
        </div>
 
−
    </nav>
 
−
</header>
 
  
  
 
</body>
 
</body>
 
</html>
 
</html>

Revision as of 08:23, 29 September 2019

JiangNan

What is ‘TOP’
Our aim is to construct a device which will increase the fermentation strains’ phage tolerance while wouldn’t have apparent effect on their growth. We want to develop an innovative methodology towards the prevention and control of phage infection in factories. And now we are devoted to studying the interaction mechanism between phages and bacteria. We firmly believe that this anti-phage biobrick can enhance the potential for open fermentation. [333333 Futura Medium 22pt 1.5倍行距]