Difference between revisions of "Team:Mingdao/Part Collection"

(Prototype team page)
 
 
(14 intermediate revisions by 4 users not shown)
Line 1: Line 1:
−
{{Mingdao}}
+
{{:Team:Mingdao/test9}}
−
<html>
+
<html lang="en">
 +
  <head>
 +
    <meta charset="UTF-8">
 +
    <link href='https://fonts.googleapis.com/css?family=Arizonia' rel='stylesheet'>
 +
    <link href='https://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet'>
 +
    <title>Description</title>
 +
  </head>
  
 +
<style type="text/css">
  
 +
* {
 +
  margin: 0;
 +
  padding: 0;
 +
  box-sizing: border-box; }
  
−
<div class="column full_size judges-will-not-evaluate">
+
body {
−
<h3>★  ALERT! </h3>
+
  width: 100%;
−
<p>This page is used by the judges to evaluate your team for the <a href="https://2018.igem.org/Judging/Medals">medal criterion</a> or <a href="https://2018.igem.org/Judging/Awards"> award listed below</a>. </p>
+
  margin: 0;
−
<p> Delete this box in order to be evaluated for this medal criterion and/or award. See more information at <a href="https://2018.igem.org/Judging/Pages_for_Awards"> Instructions for Pages for awards</a>.</p>
+
  padding: 0;
−
</div>
+
  font-family: 'Ubuntu' !important; }
  
  
−
<div class="clear"></div>
+
.bg-container {
 +
  background-attachment: fixed;
 +
  overflow: hidden;
 +
  position: relative;
 +
  background-image: url(https://static.igem.org/mediawiki/2018/b/b7/T--Mingdao--ModelingBackground.jpg);
 +
  background-repeat: no-repeat;
 +
  background-size: 100%;
 +
  background-position: center;
 +
}
  
  
 +
.my-main-container {
 +
  width: 103.4%;
 +
  padding: 50px 7%;
 +
}
  
 +
.main-content {
 +
  background-color: rgba(255,255,255, .7);
 +
  width: 75%;
 +
  margin-left: 11%;
 +
  padding: 50px;
 +
  min-height: 180vh;
 +
  z-index: 10;
 +
margin-top:600px;}
  
−
<div class="column full_size">
+
.text-area {
 +
  margin-bottom: 80px; }
 +
  .text-area h1 {
 +
    font-size: 130px;
 +
    font-weight: 700;
 +
    font-family: 'Arizonia' !important;
 +
    text-align: center;
 +
    margin-bottom: 1rem; }
 +
  .text-area p {
 +
    font-size: 22px;
 +
    font-weight: 500; }
  
−
<h1> Part Collection </h1>
+
.m-block img {
−
<p>Did your team make a lot of great parts? Is there a theme that ties all your parts together? Do you have more than 10 parts in this collection? Did you make a CRISPR collection, a MoClo collection, or a collection of awesome pigment parts? Describe your parts collection on this page, so the judges can evaluate you for the Best Part Collection award.</p>
+
  width: 100%; }
  
−
<p>
+
.path-btns {
−
While you should put all the characterization information for your parts on the Registry, you are encouraged to explain how all your parts form a collection on this page.  
+
  position: fixed;
 +
  width: 250px;
 +
  top: 200px;
 +
  left: 225px; }
 +
  .path-btns .path-dot {
 +
    width: 25px;
 +
    height: 25px;
 +
    border-radius: 50%;
 +
    position: absolute;
 +
    background-color: #fff;
 +
    top: 5px;
 +
    left: 27px;
 +
    border: 5px solid #385e66;
 +
    cursor: pointer; }
 +
    .path-btns .path-dot.active {
 +
      background-color: #385e66; }
 +
    .path-btns .path-dot:hover {
 +
      transition: all .3s;
 +
      transform: scale(1.2); }
 +
 
 +
 
 +
.path {
 +
  height: 100px;
 +
  display: flex; }
 +
  .path .pathSvg {
 +
    display: block; }
 +
  .path .pathWord {
 +
    padding-right: 10%; }
 +
  .path .path-btn {
 +
    cursor: pointer;
 +
    fill: #fff; }
 +
    .path .path-btn.path-active {
 +
      fill: #385e66; }
 +
  .path .path-word-sm {
 +
    font-size: 12px; }
 +
#HQ_page .path .pathWord p {
 +
      font-weight: 700;
 +
      text-align: left !important;
 +
      font-size: 16px;
 +
}
 +
#HQ_page .text-area p {
 +
  font-size: 22px;
 +
  font-family: 'Ubuntu';
 +
  font-weight: 500; }
 +
img.center {
 +
  display: block;
 +
  margin: 0 auto; }
 +
 
 +
.text-area h2{
 +
    text-align: center;
 +
    margin-bottom: 2rem !important;
 +
    margin-top: 2rem;
 +
    color: black !important;
 +
    font-size: 40px;
 +
    font-weight:bold;
 +
    font-family:serif;
 +
}
 +
  .text-area h3{
 +
  text-align: left;
 +
  margin-bottom: 2rem !important;
 +
  margin-top: 2rem;
 +
  color: #4682B4  !important;
 +
  font-size: 28px;
 +
  font-weight:bold;
 +
}
 +
  .text-area h4{
 +
  text-align: left;
 +
  margin-bottom: 2rem !important;
 +
  margin-top: 2rem;
 +
  color: #f9000c !important;
 +
  font-size: 30px;
 +
  font-weight:bold;
 +
}
 +
 
 +
.text-area h5{
 +
  text-align: center;
 +
  margin-bottom: 2rem !important;
 +
  margin-top: 2rem;
 +
  color: #f9000c !important;
 +
  font-size: 30px;
 +
  font-weight:bold;
 +
}
 +
 
 +
.top {
 +
  position: fixed;
 +
  right: 50px;
 +
  bottom: 50px;
 +
  height: 50px;
 +
  width: 50px;
 +
  cursor: pointer; }
 +
  .top img {
 +
    width: 100%; }
 +
img.pic {
 +
  display: block !important;
 +
  margin: 40px auto !important;
 +
}
 +
 
 +
.top-picture{
 +
z-index:2;
 +
width:100%;
 +
  position: absolute;
 +
}
 +
 
 +
video {
 +
            position:relative;
 +
            width: 100%;
 +
            height:auto;
 +
            margin: 20px auto !important;
 +
          }
 +
</style>
 +
 
 +
<body>
 +
      <img class="top-picture" src="https://static.igem.org/mediawiki/2018/9/90/T--Mingdao--Phil13-2.png" >
 +
    <div class="bg-container" style="max-height:none;">
 +
 
 +
      <div class="my-main-container">
 +
        <div class="main-content">
 +
          <div class="text-area">
 +
         
 +
        <h2 id="d-intro">  </h2>
 +
 
 +
 
 +
<p style="text-indent:2em">
 +
Mosquito Toll-Amp signaling plays an important roll in response to and regulating blood infectious pathogens.
 
</p>
 
</p>
−
</div>
+
<br />
 +
<p style="text-indent:2em">
 +
To genetically engineer mosquitoes as blood testing tools, we’ve collected DNA materials as BioBrick parts for future assembly.
 +
</p>
 +
<br />
 +
<p style="text-indent:2em">
 +
First, we designed a universal pathogen blood testing kit consisting of BioBrick parts of GAM1 promoter, GFP and polyA, as well as Ac5 promoter as a positive expression control.
 +
</p>
 +
<br />
 +
<p style="text-indent:2em">
 +
Second, we designed a HIV viral blood testing kit consisting of BioBrick parts of Ac5 promoter, CD4 extracellular domain, Drosophila transmembrane and intracellular domains, and poly A, as well as Ac5-GFP-polyA as a positive expression control.
 +
</p>
 +
<br /><br />
 +
<img class="center" src="https://static.igem.org/mediawiki/2018/f/f0/T--Mingdao--phil14-2.png" alt="" style="width: 100%; margin-bottom: 20px;">
 +
<br /><br />
 +
<img class="center" src="https://static.igem.org/mediawiki/2018/3/38/T--Mingdao--phil14-3.png" alt="" style="width: 80%; margin-bottom: 20px;">
 +
<br />
 +
<br /><br />
 +
          <h5 id="d-kit1">UNIVERSAL PATHOGEN BLOOD TESTING KIT I</h5>
 +
<img class="center" src="https://static.igem.org/mediawiki/2018/2/2f/T--Mingdao--phil14-4.png" alt="" style="width: 70%; margin-bottom: 20px;">
 +
<br /><br />
 +
<img class="center" src="https://static.igem.org/mediawiki/2018/a/a0/T--Mingdao--phil13M1.png" alt="" style="width: 70%; margin-bottom: 20px;">
 +
<br /><br />
 +
<img class="center" src="https://static.igem.org/mediawiki/2018/c/c7/T--Mingdao--phil14-9.png" alt="" style="width: 70%; margin-bottom: 20px;">
 +
<br /><br />
 +
<img class="center" src="https://static.igem.org/mediawiki/2018/b/bd/T--Mingdao--phil14-10.png" alt="" style="width: 70%; margin-bottom: 20px;">
 +
<br /><br />
 +
<img class="center" src="https://static.igem.org/mediawiki/2018/f/f9/T--Mingdao--phil14-11.png" alt="" style="width: 70%; margin-bottom: 20px;">
 +
<br /><br />
 +
<img class="center" src="https://static.igem.org/mediawiki/2018/6/60/T--Mingdao--phil14-12.png" alt="" style="width: 70%; margin-bottom: 20px;">
 +
<br /><br />
 +
          <h5 id="d-kit2">HUMAN HIV VIRUS BLOOD TESTING KIT II</h5>
 +
<img class="center" src="https://static.igem.org/mediawiki/2018/6/6c/T--Mingdao--phil14-13.png" alt="" style="width: 70%; margin-bottom: 20px;">
 +
<br /><br />
 +
<img class="center" src="https://static.igem.org/mediawiki/2018/d/db/T--Mingdao--phil14-14.png" alt="" style="width: 70%; margin-bottom: 20px;">
 +
<br /><br />
 +
<img class="center" src="https://static.igem.org/mediawiki/2018/e/e5/T--Mingdao--phil14-15.png" alt="" style="width: 70%; margin-bottom: 20px;">
 +
<br /><br />
 +
<img class="center" src="https://static.igem.org/mediawiki/2018/2/29/T--Mingdao--phil14-16.png" alt="" style="width: 70%; margin-bottom: 20px;">
 +
<br /><br />
 +
<img class="center" src="https://static.igem.org/mediawiki/2018/7/70/T--Mingdao--phil14-17.png" alt="" style="width: 70%; margin-bottom: 20px;">
 +
<br /><br />
 +
 
 +
          </div>
 +
        </div>
 +
      </div>
 +
    </div>
 +
 
 +
    <div class="path-btns" style="left:0;">
 +
      <div class="path">
 +
        <div class="pathSvg">
 +
          <svg width="80" height = "100">
 +
            <rect x ="36" y="20" width="6" height="80" style="fill:#385e66"/>
 +
          </svg>
 +
        </div>
 +
        <div id="intro-btn" class="path-dot"></div>
 +
        <div class="pathWord path-word-sm">
 +
          <p>Introduction</p>
 +
        </div>
 +
      </div>
 +
 
 +
      <div class="path">
 +
        <div class="pathSvg">
 +
          <svg width="80" height = "100">
 +
            <rect x ="36" y="20" width="6" height="80" style="fill:#385e66"/>
 +
          </svg>
 +
        </div>
 +
        <div id="kit1-btn" class="path-dot" style="top: 100px"></div>
 +
        <div class="pathWord path-word-sm">
 +
          <p>Kit 1</p>
 +
        </div>
 +
      </div>
 +
 
 +
      <div class="path">
 +
        <div class="pathSvg">
 +
          <svg width="80" height = "100">
 +
            <rect x ="36" y="20" width="0" height="80" style="fill:#385e66"/>
 +
          </svg>
 +
        </div>
 +
        <div id="kit2-btn" class="path-dot" style="top: 200px"></div>
 +
        <div class="pathWord path-word-sm">
 +
          <p>Kit 2</p>
 +
        </div>
 +
      </div>
 +
 
 +
    </div>
 +
 
 +
    <div class="top">
 +
      <img class="center" src="https://static.igem.org/mediawiki/2018/5/58/T--Mingdao--go_to_top.jpg" alt="">
 +
    </div>
 +
 
 +
</body>
 +
  <script type="text/javascript">
 +
    $("#intro-btn").click(function() {
 +
      $('html, body').animate({
 +
          scrollTop: $("#d-intro").offset().top
 +
      }, 400);
 +
    });
 +
    $("#kit1-btn").click(function() {
 +
      $('html, body').animate({
 +
          scrollTop: $("#d-kit1").offset().top
 +
      }, 400);
 +
    });
 +
    $("#kit2-btn").click(function() {
 +
      $('html, body').animate({
 +
          scrollTop: $("#d-kit2").offset().top
 +
      }, 400);
 +
    });
 +
 
 +
    $(document).ready(function(){
 +
      $('.top').on('click', function(){
 +
        $('html, body').animate({scrollTop: '0px'}, 400);
 +
      });
 +
        $("#intro-btn").css('background-color', '#385e66');
 +
        var scroll_pos = 0;
 +
        $(document).scroll(function() {
 +
            scroll_pos = $(this).scrollTop();
  
 +
            d_intro_pos = $("#d-intro").offset().top -100
 +
            d_k1_pos = $("#d-kit1").offset().top -100
 +
            d_k2_pos= $("#d-kit2").offset().top -100
  
−
<div class="column full_size">
+
            // introduction
−
<div class="highlight decoration_background">
+
            if(scroll_pos < d_k1_pos) {
−
<h3>Note</h3>
+
                $(".path-dot").css('background-color', '#fff')
−
<p>This page should list all the parts in the collection your team made during your project. You must add all characterization information for your parts on the Registry. You should not put characterization information on this page.</p>
+
                $("#intro-btn").css('background-color', '#385e66');}
−
</div>
+
            // model1
−
</div>
+
            else if(scroll_pos < d_k2_pos){
 +
              if(scroll_pos >= d_k1_pos){
 +
                $(".path-dot").css('background-color', '#fff')
 +
                $("#kit1-btn").css('background-color', '#385e66');}
 +
            }
 +
           
 +
            // conclusion
 +
            else if( scroll_pos >= d_k2_pos) {
 +
                $(".path-dot").css('background-color', '#fff')
 +
                $("#kit2-btn").css('background-color', '#385e66');
 +
            }
 +
        });
 +
    });
  
−
<div class="column full_size">
+
  </script>
−
<h3>Best Part Collection Special Prize</h3>
+
−
<p>To be eligible for this award, these parts must adhere to <a href="http://parts.igem.org/DNA_Submission">Registry sample submission guidelines</a> and have been sent to the Registry of Standard Biological Parts. If you have a collection of parts you wish to nominate your team for this <a href="https://2018.igem.org/Judging/Awards">special prize</a>, make sure you add your part numbers to your <a href="https://2018.igem.org/Judging/Judging_Form">judging form</a> and delete the box at the top of this page.</p>
+
−
</div>
+
  
 
</html>
 
</html>
 +
{{:Team:Mingdao/test6}}

Latest revision as of 03:34, 18 October 2018

HOME
Description

Mosquito Toll-Amp signaling plays an important roll in response to and regulating blood infectious pathogens.


To genetically engineer mosquitoes as blood testing tools, we’ve collected DNA materials as BioBrick parts for future assembly.


First, we designed a universal pathogen blood testing kit consisting of BioBrick parts of GAM1 promoter, GFP and polyA, as well as Ac5 promoter as a positive expression control.


Second, we designed a HIV viral blood testing kit consisting of BioBrick parts of Ac5 promoter, CD4 extracellular domain, Drosophila transmembrane and intracellular domains, and poly A, as well as Ac5-GFP-polyA as a positive expression control.








UNIVERSAL PATHOGEN BLOOD TESTING KIT I












HUMAN HIV VIRUS BLOOD TESTING KIT II










Introduction

Kit 1

Kit 2