Difference between revisions of "Team:Hong Kong HKU"

(making the added navbar collapse-able)
 
(118 intermediate revisions by 2 users not shown)
Line 1: Line 1:
−
{{Hong_Kong_HKU}}
+
{{:Team:Hong_Kong_HKU/Templates/NavBar}}
−
 
+
 
<html>
 
<html>
−
 
+
<head>
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
 
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
 
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
−
 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js">
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js">
−
 
 
</script>
 
</script>
−
<nav class="navbar navbar-inverse">
+
</head>
−
   <div class="container-fluid">
+
<div id = "main-body">
−
     <div class="navbar-header">
+
  <img src="https://static.igem.org/mediawiki/2017/8/86/16681805_1351181934924813_260556013027435769_n.png" alt="" width=100% style="height:80%">
−
       <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
+
   <div>
−
        <span class="icon-bar"></span>
+
   
−
        <span class="icon-bar"></span>
+
    <div style="border-style: solid; border-color:green;padding: 25px;margin: 25px;" >
−
         <span class="icon-bar"></span>                      
+
      <h1> About this project </h1>
−
       </button>
+
 
−
       <a class="navbar-brand" href="#">WebSiteName</a>
+
      <p style="text-align:justify">Greetings!
 +
 
 +
        By focusing on the intriguing world of diagnostic probes, our project aims to design an effective DNA nanostructure for Disease detection. Contrary to HKU iGEM Team 2016 design, we have come up with an alternative tetrahedron structure, in which the 3D tetrahedron is only formed upon binding to the target sequence. Our ultimate goal is to enable our functional DNA nanostructure to be synthesized and self-assembled inside E. coli. They will detect specific biomarkers expressed in the diseased cells. This website will guide you on our journey throughout the iGEM Competition 2017. Click to explore and enjoy! </p>
 +
      </div>
 +
<center>
 +
      
 +
   
 +
<br>
 +
      <div style="float: left; ">
 +
<center>
 +
        <a href="https://2017.igem.org/Team:Hong_Kong_HKU/Attributions" style="margin-left:30px"><img src="https://static.igem.org/mediawiki/2017/7/7a/TeamHKU.png" style="width:10%; height:90px; padding-right:20px" > </a>
 +
        <a href="https://2017.igem.org/Team:Hong_Kong_HKU/Collaborations"><img src="https://static.igem.org/mediawiki/2017/e/eb/CollaborationHKU.png" style="padding-right:20px; width:10%; height:90px"  > </a>
 +
<a href="https://2017.igem.org/Team:Hong_Kong_HKU/HP/Silver"><img src="https://static.igem.org/mediawiki/2017/4/4f/Human_practice.png" style="padding-right:20px; width:10%; height:90px"  > </a>
 +
<a href="https://2017.igem.org/Team:Hong_Kong_HKU/Notebook"><img src="https://static.igem.org/mediawiki/2017/d/d9/NotebookHKU.png" style="padding-right:20px; width:10%; height:90px"  > </a>
 +
<a href="https://2017.igem.org/Team:Hong_Kong_HKU/InterLab"><img src="https://static.igem.org/mediawiki/2017/6/63/InterlabHKU.png" style="padding-right:20px; width:10%; height:90px"  > </a>
 +
<a href="https://2017.igem.org/Team:Hong_Kong_HKU/Parts"><img src="https://static.igem.org/mediawiki/2017/6/62/PartsHKU.png" style="padding-right:20px; width:10%; height:90px"  > </a>
 +
<a href="https://2017.igem.org/Team:Hong_Kong_HKU/Results"><img src="https://static.igem.org/mediawiki/2017/c/c4/ResultsHKU.png" style="padding-right:20px; width:10%; height:90px"  > </a>
 +
<a href="https://2017.igem.org/Team:Hong_Kong_HKU/Description"><img src="https://static.igem.org/mediawiki/2017/c/c4/DescriptionHKU1.png" style="padding-right:20px; width:10%; height:90px" > </a>
 +
</center>
 +
       </div>
 +
     
 +
 
 +
 
 +
 
 +
 
 +
 
 +
<img src="https://2017.igem.org/File:BiosafetyHKU.png" alt="">
 +
<img src="" alt="">
 +
 
 +
<center>
 +
<br><br>
 +
<div id="myCarousel" class="carousel slide" data-ride="carousel" style="width:800px;">
 +
  <!-- Indicators -->
 +
  <ol class="carousel-indicators">
 +
    <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
 +
    <li data-target="#myCarousel" data-slide-to="1"></li>
 +
    <li data-target="#myCarousel" data-slide-to="2"></li>
 +
    <li data-target="#myCarousel" data-slide-to="3"></li>
 +
    <li data-target="#myCarousel" data-slide-to="4"></li>
 +
    <li data-target="#myCarousel" data-slide-to="5"></li>
 +
 
 +
 
 +
 
 +
  </ol>
 +
 
 +
  <!-- Wrapper for slides -->
 +
  <div class="carousel-inner">
 +
    <div class="item active">
 +
      <img src="https://static.igem.org/mediawiki/2017/1/1f/Planing_HKU.jpeg" alt="HKU iGEM 2017 Team Spirit", width=400px, height=400px>
 +
      <div class="carousel-caption">
 +
        <h3> HKU iGEM 2017 Team Spirit</h3>
 +
         <p>Initial group discussions</p>
 +
      </div>
 +
    </div>
 +
 
 +
    <div class="item">
 +
      <img src="https://static.igem.org/mediawiki/2017/1/1f/Learning_for_youngHKU.jpeg" alt="HKU iGEM 2017 Collaboration", width=400px, height=400px>
 +
       <div class="carousel-caption">
 +
        <h3>HKU iGEM 2017 Collaboration</h3>
 +
        <p>Learning from the youngsters</p>
 +
       </div>
 +
    </div>
 +
 
 +
    <div class="item">
 +
      <img src="https://static.igem.org/mediawiki/2017/2/20/DesignHKU1.png" alt="Explaning Concepts", width=800px, style="margin-bottom:400px;">
 +
      <div class="carousel-caption">
 +
        <h3>HKU iGEM 2017 Design</h3>
 +
 
 
     </div>
 
     </div>
−
    <ul class="nav navbar-nav">
 
−
      <li class="active">
 
−
        <a href="#">Home</a>
 
−
      </li>
 
−
      <li class="dropdown">
 
−
        <a class="dropdown-toggle" data-toggle="dropdown" href="#">Project</a>
 
−
        <ul class="dropdown-menu">
 
−
          <li>
 
−
            <a href="#">Parts</a>
 
−
          </li>
 
−
          <li>
 
−
            <a href="#">Notebook</a>
 
−
          </li>
 
−
          <li>
 
−
            <a href="#">Interlab</a>
 
−
          </li>
 
−
          <li>
 
−
            <a href="#">Contribution</a>
 
−
          </li>
 
−
          <li>
 
−
            <a href="#">Demonstrate</a>
 
−
          </li>
 
−
        </ul>
 
−
      </li>
 
−
      <li class="dropdown">
 
−
        <a class="dropdown-toggle" data-toggle="dropdown" href="#">Human Practice<span class="caret"></span></a>
 
−
        <ul class="dropdown-menu">
 
−
          <li>
 
−
            <a href="#">Public Education</a>
 
−
          </li>
 
−
          <li>
 
−
            <a href="#">Workshops</a>
 
−
          </li>
 
−
        </ul>
 
−
      </li>
 
−
      <li class="dropdown">
 
−
        <a class="dropdown-toggle" data-toggle="dropdown" href="#">Human Practice<span class="caret"></span></a>
 
−
        <ul class="dropdown-menu">
 
−
          <li>
 
−
            <a href="#">Gold</a>
 
−
          </li>
 
−
          <li>
 
−
            <a href="#">Silver</a>
 
−
          </li>
 
−
          <li>
 
−
            <a href="#">Bronze</a>
 
−
          </li>
 
−
        </ul>
 
−
      </li>
 
−
      <li class="dropdown">
 
−
        <a class="dropdown-toggle" data-toggle="dropdown" href="#">Team<span class="caret"></span></a>
 
−
        <ul class="dropdown-menu">
 
−
          <li>
 
−
            <a href="#">Members and attribution</a>
 
−
          </li>
 
−
          <li>
 
−
            <a href="#">Collaborations</a>
 
−
          </li>
 
−
        </ul>
 
−
      </li>
 
−
    </ul>
 
−
  </div>
 
−
</nav>
 
−
<div class="column full_size">
 
−
  <img id="banner" alt="banner-image" class="img-responsive" src="https://static.igem.org/mediawiki/2017/a/a6/T--Hong_Kong_HKU--bg.jpg">
 
 
</div>
 
</div>
−
<h2>
+
<div class="item">
−
  <b>Project Description</b>
+
      <img src="https://static.igem.org/mediawiki/2017/6/6b/Interlab_Fluorescence_Graph.PNG" alt="" , width=800px, style="margin-bottom:200px;">
−
</h2>
+
      <div class="carousel-caption">
−
  <p style = "font-family: 'Roboto', sans-serif;" "align="left" class="text-justify">
+
        <h3>HKU iGEM 2017 Interlab</h3>
−
    With the advent of DNA nanotechnology, the age old "DNA is the genetic blueprint of living beings" has expanded greatly with our increasing understanding about the physical and chemical properties of DNA. Establishing its basis through "Holiday Junction" and DNA origami such as of "Smiley Face", DNA nanotechnology has made its way as one of the most advanced and sought-after branches of synthetic biology.<br>
+
        <p>To be better we work together </p>
−
    <br>
+
−
    With the recent advances in DNA nanotechnology, scientists have made one success story after another to apply DNA nanodevices like three dimensional DNA structures in clinical diagnosis, environmental and nutritional fields. However, all of these structures have so far been done in vitro, where the structures are functional only outside living cells.<br>
+
−
    <br>
+
−
    Therefore, HKU iGEM Team 2017 will continue to focus on HKU's strengths in the field of DNA nanotechnology and will be aiming to delve into this field, taking it further by aiming to produce a three dimensional nuclei acid-detecting structure in vivo that can be expressed directly in the living cell. Our goal is to design a DNA structure and try to express it in <i>E. coli</i> where the structure will be used to detect nucleic acid markers which may have prospective applications in aspects such as disease diagnosis, environmental fields, etc. We will make use of Watson-Crick base pairings, aptamers and G-quadruplex sequences to achieve our goal.<br>
+
−
    <br>
+
−
    <b>All in all, we are opting our best to create something new through iGEM in the world of synthetic biology to contribute to its advancement.</b>
+
−
  </p>
+
  
 +
 +
 +
      </div>
 +
    </div>
 +
 +
    <div class="item">
 +
      <img src="https://static.igem.org/mediawiki/2017/8/84/Teachingsecondaryschool.jpg" alt="Explaning Concepts" , width=400px, height=400px>
 +
      <div class="carousel-caption">
 +
        <h3>HKU iGEM Human Practice</h3>
 +
        <p>Paying it forward </p>
 +
 +
      </div>
 +
    </div>
 +
 +
<div class="item">
 +
      <img src="https://static.igem.org/mediawiki/2017/d/d5/HKUBio2.jpg" alt="", width=400px, height=400px>
 +
      <div class="carousel-caption">
 +
        <h3>HKU iGEM 2017 Biosafety Conference</h3>
 +
        <p>Better safe than sorry</p>
 +
      </div>
 +
    </div>
 +
 +
 +
 +
  </div>
 +
 +
 +
 +
 +
 +
<div class="clear"></div>
 +
</div>
 +
</center>
 
<style>
 
<style>
 +
/* custom css */
 +
#para-1 {
 +
    padding-right: 20px;
 +
}
 +
/*-- Remove borders, float content left and remove padding/margin */
 +
        #globalWrapper, #content{
 +
margin-left: 10px;
 +
                width: 98%;
 +
                height: 98%;
 +
}
 +
/* Remove header footer and borders */
 +
#contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo {
 +
    display:none;}
 +
#top-section {
 +
    border: none;
 +
    height: 0px;}
 +
#content {
 +
    border: none;}
 +
#main-body {
 +
    margin-top: 120px;
 +
}
 +
#main-text {
 +
margin-top: 10px;
 +
}
 
</style>
 
</style>
 +
 
</html>
 
</html>

Latest revision as of 18:41, 1 November 2017

About this project

Greetings! By focusing on the intriguing world of diagnostic probes, our project aims to design an effective DNA nanostructure for Disease detection. Contrary to HKU iGEM Team 2016 design, we have come up with an alternative tetrahedron structure, in which the 3D tetrahedron is only formed upon binding to the target sequence. Our ultimate goal is to enable our functional DNA nanostructure to be synthesized and self-assembled inside E. coli. They will detect specific biomarkers expressed in the diseased cells. This website will guide you on our journey throughout the iGEM Competition 2017. Click to explore and enjoy!