Difference between revisions of "Team:Hong Kong UCCKE/Notebook"

 
(48 intermediate revisions by the same user not shown)
Line 1: Line 1:
 
{{Hong_Kong_UCCKE/CSS/reset.css}} {{Hong_Kong_UCCKE/CSS/bootstrap.css}} {{Hong_Kong_UCCKE/CSS/style.css}} {{Hong_Kong_UCCKE/CSS/latofonts.css}} {{Hong_Kong_UCCKE/CSS/font-awesome.css}} {{Hong_Kong_UCCKE/CSS/jcarousel.responsive.css}} {{Hong_Kong_UCCKE/CSS/bootstrap.toc.css}}
 
{{Hong_Kong_UCCKE/CSS/reset.css}} {{Hong_Kong_UCCKE/CSS/bootstrap.css}} {{Hong_Kong_UCCKE/CSS/style.css}} {{Hong_Kong_UCCKE/CSS/latofonts.css}} {{Hong_Kong_UCCKE/CSS/font-awesome.css}} {{Hong_Kong_UCCKE/CSS/jcarousel.responsive.css}} {{Hong_Kong_UCCKE/CSS/bootstrap.toc.css}}
−
{{Hong_Kong_UCCKE/CSS/notebook}}
 
 
<html>
 
<html>
 +
 +
<style>
 +
    h2 {
 +
        padding-top: 50px;
 +
        margin-top: -30px;
 +
    }
 +
</style>
 +
 
<link rel="stylesheet" href="https://2016.igem.org/Team:Leiden/libraries/font-awesome-4-6-3/css/font-awesome-min?action=raw&amp;ctype=text/css" type="text/css" />
 
<link rel="stylesheet" href="https://2016.igem.org/Team:Leiden/libraries/font-awesome-4-6-3/css/font-awesome-min?action=raw&amp;ctype=text/css" type="text/css" />
 
<meta name="viewport" content="width=device-width, initial-scale=1">
 
<meta name="viewport" content="width=device-width, initial-scale=1">
 
<div class="wholehead">
 
<div class="wholehead">
 +
 
</html>
 
</html>
 
{{Hong_Kong_UCCKE/crazyheader}}
 
{{Hong_Kong_UCCKE/crazyheader}}
Line 14: Line 22:
 
             <div class="col-sm-12 page_header-text">
 
             <div class="col-sm-12 page_header-text">
 
                 <div>
 
                 <div>
−
                     <h1 data-toc-skip>UCCKE / Contact</h1>
+
                     <h1 data-toc-skip>UCCKE / Notebook</h1>
−
                     <p>offendit malis arbitror appellat o arbitror nisi nam quamquam illustriora do se appellat praetermissum.</p>
+
                     <p>In this page, you can breifly know about the process of our project.</p>
 
                 </div>
 
                 </div>
 
             </div>
 
             </div>
Line 28: Line 36:
 
</div>
 
</div>
 
</div>
 
</div>
−
+
      
−
<script src="https://codyhouse.co/demo/horizontal-timeline/js/modernizr.js"></script> <!-- Modernizr -->
+
−
<script src="https://codyhouse.co/demo/horizontal-timeline/js/jquery-2.1.4.js"></script>
+
−
<script src="https://codyhouse.co/demo/horizontal-timeline/js/jquery.mobile.custom.min.js"></script>
+
−
<script src="https://codyhouse.co/demo/horizontal-timeline/js/main.js"></script>
+
−
<style>
+
−
.cd-horizontal-timeline .events-content {
+
−
  position: relative;
+
−
}
+
−
.cd-horizontal-timeline .events-content li {
+
−
  position: absolute;
+
−
  z-index: 1;
+
−
  width: 100%;
+
−
  left: 0;
+
−
  top: 0;
+
−
  transform: translateX(-100%);
+
−
  opacity: 0;
+
−
  animation-duration: 0.4s;
+
−
  animation-timing-function: ease-in-out;
+
−
}
+
−
.cd-horizontal-timeline .events-content li.selected {
+
−
  /* visible event content */
+
−
  position: relative;
+
−
  z-index: 2;
+
−
  opacity: 1;
+
−
  transform: translateX(0);
+
−
}
+
−
.cd-horizontal-timeline .events-content li.enter-right,
+
−
.cd-horizontal-timeline .events-content li.leave-right {
+
−
  animation-name: cd-enter-right;
+
−
}
+
−
.cd-horizontal-timeline .events-content li.enter-left,
+
−
.cd-horizontal-timeline .events-content li.leave-left {
+
−
  animation-name: cd-enter-left;
+
−
}
+
−
.cd-horizontal-timeline .events-content li.leave-right,
+
−
.cd-horizontal-timeline .events-content li.leave-left {
+
−
  animation-direction: reverse;
+
−
}
+
−
@keyframes cd-enter-right {
+
−
  0% {
+
−
     opacity: 0;
+
−
    transform: translateX(100%);
+
−
  }
+
−
  100% {
+
−
    opacity: 1;
+
−
    transform: translateX(0%);
+
−
  }
+
−
}
+
−
@keyframes cd-enter-left {
+
−
  0% {
+
−
    opacity: 0;
+
−
    transform: translateX(-100%);
+
−
  }
+
−
  100% {
+
−
    opacity: 1;
+
−
    transform: translateX(0%);
+
−
  }
+
−
}
+
−
</style>
+
  
−
<section class="cd-horizontal-timeline">
 
−
<div class="timeline">
 
−
<style>
 
−
.cd-horizontal-timeline .events-wrapper::before {
 
−
background-image: none;
 
−
}
 
−
.cd-horizontal-timeline .events-wrapper::after {
 
−
background-image: none;
 
−
}
 
−
</style>
 
−
<div style="background:none;" class="events-wrapper">
 
−
<div class="events">
 
−
<ol style="list-style:none;">
 
−
<li><a href="#0" data-date="16/01/2014" class="selected">16 Jan</a></li>
 
−
<li><a href="#0" data-date="28/02/2014">28 Feb</a></li>
 
−
<li><a href="#0" data-date="20/04/2014">20 Mar</a></li>
 
−
<li><a href="#0" data-date="20/05/2014">20 May</a></li>
 
−
<li><a href="#0" data-date="09/07/2014">09 Jul</a></li>
 
−
<li><a href="#0" data-date="30/08/2014">30 Aug</a></li>
 
−
<li><a href="#0" data-date="15/09/2014">15 Sep</a></li>
 
−
<li><a href="#0" data-date="01/11/2014">01 Nov</a></li>
 
−
<li><a href="#0" data-date="10/12/2014">10 Dec</a></li>
 
−
<li><a href="#0" data-date="19/01/2015">29 Jan</a></li>
 
−
<li><a href="#0" data-date="03/03/2015">3 Mar</a></li>
 
−
</ol>
 
−
 
−
<span class="filling-line" aria-hidden="true"></span>
 
−
</div> <!-- .events -->
 
−
</div> <!-- .events-wrapper -->
 
−
 
−
<ul class="cd-timeline-navigation" style="list-style:none;">
 
−
<li><a href="#0" class="prev inactive">Prev</a></li>
 
−
<li><a href="#0" class="next">Next</a></li>
 
−
</ul> <!-- .cd-timeline-navigation -->
 
−
</div> <!-- .timeline -->
 
−
 
−
<div class="events-content">
 
−
<ol>
 
−
<li class="selected" data-date="16/01/2014">
 
−
<h2>Horizontal Timeline</h2>
 
−
<em>January 16th, 2014</em>
 
−
<p>
 
−
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Illum praesentium officia, fugit recusandae ipsa, quia velit nulla adipisci? Consequuntur aspernatur at, eaque hic repellendus sit dicta consequatur quae, ut harum ipsam molestias maxime non nisi reiciendis eligendi! Doloremque quia pariatur harum ea amet quibusdam quisquam, quae, temporibus dolores porro doloribus.
 
−
</p>
 
−
</li>
 
  
−
<li data-date="28/02/2014">
 
−
<h2>Event title here</h2>
 
−
<em>February 28th, 2014</em>
 
−
<p>
 
−
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Illum praesentium officia, fugit recusandae ipsa, quia velit nulla adipisci? Consequuntur aspernatur at, eaque hic repellendus sit dicta consequatur quae, ut harum ipsam molestias maxime non nisi reiciendis eligendi! Doloremque quia pariatur harum ea amet quibusdam quisquam, quae, temporibus dolores porro doloribus.
 
−
</p>
 
−
</li>
 
  
−
<li data-date="20/04/2014">
 
−
<h2>Event title here</h2>
 
−
<em>March 20th, 2014</em>
 
−
<p>
 
−
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Illum praesentium officia, fugit recusandae ipsa, quia velit nulla adipisci? Consequuntur aspernatur at, eaque hic repellendus sit dicta consequatur quae, ut harum ipsam molestias maxime non nisi reiciendis eligendi! Doloremque quia pariatur harum ea amet quibusdam quisquam, quae, temporibus dolores porro doloribus.
 
−
</p>
 
−
</li>
 
  
−
<li data-date="20/05/2014">
 
−
<h2>Event title here</h2>
 
−
<em>May 20th, 2014</em>
 
−
<p>
 
−
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Illum praesentium officia, fugit recusandae ipsa, quia velit nulla adipisci? Consequuntur aspernatur at, eaque hic repellendus sit dicta consequatur quae, ut harum ipsam molestias maxime non nisi reiciendis eligendi! Doloremque quia pariatur harum ea amet quibusdam quisquam, quae, temporibus dolores porro doloribus.
 
−
</p>
 
−
</li>
 
  
−
<li data-date="09/07/2014">
 
−
<h2>Event title here</h2>
 
−
<em>July 9th, 2014</em>
 
−
<p>
 
−
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Illum praesentium officia, fugit recusandae ipsa, quia velit nulla adipisci? Consequuntur aspernatur at, eaque hic repellendus sit dicta consequatur quae, ut harum ipsam molestias maxime non nisi reiciendis eligendi! Doloremque quia pariatur harum ea amet quibusdam quisquam, quae, temporibus dolores porro doloribus.
 
−
</p>
 
−
</li>
 
  
−
<li data-date="30/08/2014">
 
−
<h2>Event title here</h2>
 
−
<em>August 30th, 2014</em>
 
−
<p>
 
−
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Illum praesentium officia, fugit recusandae ipsa, quia velit nulla adipisci? Consequuntur aspernatur at, eaque hic repellendus sit dicta consequatur quae, ut harum ipsam molestias maxime non nisi reiciendis eligendi! Doloremque quia pariatur harum ea amet quibusdam quisquam, quae, temporibus dolores porro doloribus.
 
−
</p>
 
−
</li>
 
  
−
<li data-date="15/09/2014">
 
−
<h2>Event title here</h2>
 
−
<em>September 15th, 2014</em>
 
−
<p>
 
−
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Illum praesentium officia, fugit recusandae ipsa, quia velit nulla adipisci? Consequuntur aspernatur at, eaque hic repellendus sit dicta consequatur quae, ut harum ipsam molestias maxime non nisi reiciendis eligendi! Doloremque quia pariatur harum ea amet quibusdam quisquam, quae, temporibus dolores porro doloribus.
 
−
</p>
 
−
</li>
 
  
−
<li data-date="01/11/2014">
 
−
<h2>Event title here</h2>
 
−
<em>November 1st, 2014</em>
 
−
<p>
 
−
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Illum praesentium officia, fugit recusandae ipsa, quia velit nulla adipisci? Consequuntur aspernatur at, eaque hic repellendus sit dicta consequatur quae, ut harum ipsam molestias maxime non nisi reiciendis eligendi! Doloremque quia pariatur harum ea amet quibusdam quisquam, quae, temporibus dolores porro doloribus.
 
−
</p>
 
−
</li>
 
  
−
<li data-date="10/12/2014">
 
−
<h2>Event title here</h2>
 
−
<em>December 10th, 2014</em>
 
−
<p>
 
−
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Illum praesentium officia, fugit recusandae ipsa, quia velit nulla adipisci? Consequuntur aspernatur at, eaque hic repellendus sit dicta consequatur quae, ut harum ipsam molestias maxime non nisi reiciendis eligendi! Doloremque quia pariatur harum ea amet quibusdam quisquam, quae, temporibus dolores porro doloribus.
 
−
</p>
 
−
</li>
 
  
−
<li data-date="19/01/2015">
 
−
<h2>Event title here</h2>
 
−
<em>January 19th, 2015</em>
 
−
<p>
 
−
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Illum praesentium officia, fugit recusandae ipsa, quia velit nulla adipisci? Consequuntur aspernatur at, eaque hic repellendus sit dicta consequatur quae, ut harum ipsam molestias maxime non nisi reiciendis eligendi! Doloremque quia pariatur harum ea amet quibusdam quisquam, quae, temporibus dolores porro doloribus.
 
−
</p>
 
−
</li>
 
  
−
<li data-date="03/03/2015">
+
<div class="container" id="normalsec">
−
<h2>Event title here</h2>
+
−
<em>March 3rd, 2015</em>
+
−
<p>
+
−
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Illum praesentium officia, fugit recusandae ipsa, quia velit nulla adipisci? Consequuntur aspernatur at, eaque hic repellendus sit dicta consequatur quae, ut harum ipsam molestias maxime non nisi reiciendis eligendi! Doloremque quia pariatur harum ea amet quibusdam quisquam, quae, temporibus dolores porro doloribus.
+
−
</p>
+
−
</li>
+
−
</ol>
+
−
</div> <!-- .events-content -->
+
−
</section>
+
  
 +
<link rel="stylesheet" href="https://2016.igem.org/Template:Hong_Kong_UCCKE/NotebookCSS?action=raw&amp;ctype=text/css"> <!-- Resource style -->
 +
<script src="https://2016.igem.org/Template:Hong_Kong_UCCKE/NotebookOneJS?action=raw&amp;ctype=text/javascript"></script> <!-- Modernizr -->
 +
<section id="cd-timeline" class="cd-container">
 +
<div class="cd-timeline-block">
 +
<div class="cd-timeline-img cd-picture">
 +
<i class="fa fa-users timeline-icons" aria-hidden="true"></i>
 +
 +
</div> <!-- <img src="img/cd-icon-picture.svg" alt="Picture"> cd-timeline-img -->
  
 +
<div class="cd-timeline-content">
 +
<h2>Meeting with Team:HKU</h2>
 +
<p style="text-align:left !important;">We have met the members from the Hong Kong University iGem team (known as the HKU iGem team), briefly introduce to them our interested area of study and the origin of the idea. By sharing our interested fields, we established a close bond in between. Thanks to the HKU iGem team, we can set our topic with more background knowledges provided.<br>
 +
<img src="https://static.igem.org/mediawiki/2016/6/6f/T--Hong_Kong_UCCKE--collabhku2.jpeg" style="width:100%; max-width:400px;">
 +
</p>
 +
 +
<span class="cd-date">Apr 20</span>
 +
</div> <!-- cd-timeline-content -->
 +
</div> <!-- cd-timeline-block -->
  
 +
<div class="cd-timeline-block">
 +
<div class="cd-timeline-img cd-movie">
 +
<i class="fa fa-comment timeline-icons" aria-hidden="true"></i>
 +
</div> <!-- cd-timeline-img -->
  
 +
<div class="cd-timeline-content">
 +
<h2>Finalized project idea</h2>
 +
<p>We have finalized the area of investigation during our meeting after 3 weeks of researches and discussion subsequent to our meeting with HKU iGem team. We have eventually decided to investigate on C. elegans, a kind of well-studied roundworm which has a short life cycle and is easy to reproduce. </p>
 +
 +
<span class="cd-date">May 9</span>
 +
</div> <!-- cd-timeline-content -->
 +
</div> <!-- cd-timeline-block -->
  
 +
<div class="cd-timeline-block">
 +
<div class="cd-timeline-img cd-picture">
 +
<i class="fa fa-users timeline-icons" aria-hidden="true"></i>
 +
 +
</div> <!-- cd-timeline-img -->
  
 +
<div class="cd-timeline-content">
 +
<h2>Meeting with Team:HKU</h2>
 +
<p>We have the second meeting with the HKU iGem team through video conference software to exchange our progress and discussed on the possibility of further development regarding our collaboration bond. </p>
 +
 +
<span class="cd-date">Jun 29</span>
 +
</div> <!-- cd-timeline-content -->
 +
</div> <!-- cd-timeline-block -->
  
 +
<div class="cd-timeline-block">
 +
<div class="cd-timeline-img cd-location">
 +
<img src="https://static.igem.org/mediawiki/2016/d/d5/T--Hong_Kong_UCCKE--notebookicon1.png" alt="Location">
 +
</div> <!-- cd-timeline-img -->
  
 +
<div class="cd-timeline-content">
 +
<h2>Um....</h2>
 +
<p>Supposedly we should meet to kick off our experiments on our project, yet it was cancelled due to the bad weather. </p>
 +
 +
<span class="cd-date">Aug 10</span>
 +
</div> <!-- cd-timeline-content -->
 +
</div> <!-- cd-timeline-block -->
  
 +
<div class="cd-timeline-block">
 +
<div class="cd-timeline-img cd-location">
 +
<img src="https://static.igem.org/mediawiki/2016/d/d5/T--Hong_Kong_UCCKE--notebookicon1.png" alt="Location">
 +
</div> <!-- cd-timeline-img -->
  
 +
<div class="cd-timeline-content">
 +
<h2>Preperation for experiment</h2>
 +
<p>Meeting in the laboratory, we are briefed by our co-workers on the characteristics of C. elegans before doing and hands on experiment in the morning. Meanwhile we started on preparing for the presentation in the Giant Jamboree. We started having practices on the experiment before the real one. </p>
 +
 +
<span class="cd-date">Aug 11</span>
 +
</div> <!-- cd-timeline-content -->
 +
</div> <!-- cd-timeline-block -->
  
 +
<div class="cd-timeline-block">
 +
<div class="cd-timeline-img cd-location">
 +
<img src="https://static.igem.org/mediawiki/2016/d/d5/T--Hong_Kong_UCCKE--notebookicon1.png" alt="Location">
 +
</div> <!-- cd-timeline-img -->
  
 +
<div class="cd-timeline-content">
 +
<h2>Experiment, collect data</h2>
 +
<p>Laboratory work continues and the presentation preparation goes quite well. We started our real experiment today and a few chemicals were tested. The results are quite surprising as some of the results are completely different from our expectation. Data is being collected and inputted at the same time </p>
 +
 +
<span class="cd-date">Aug 12</span>
 +
</div> <!-- cd-timeline-content -->
 +
</div> <!-- cd-timeline-block -->
  
 +
<div class="cd-timeline-block">
 +
<div class="cd-timeline-img cd-location">
 +
<img src="https://static.igem.org/mediawiki/2016/d/d5/T--Hong_Kong_UCCKE--notebookicon1.png" alt="Location">
 +
</div> <!-- cd-timeline-img -->
  
 +
<div class="cd-timeline-content">
 +
<h2>Experiment, collect data</h2>
 +
<p>This is the last day we planned to carry out our experiments. The presentation preparation is mostly done and the results of the experiment are all inputted.</p>
 +
 +
<span class="cd-date">Aug 15</span>
 +
</div> <!-- cd-timeline-content -->
 +
</div> <!-- cd-timeline-block -->
  
−
<div class="container">
+
<div class="cd-timeline-block">
−
<section class="main">
+
<div class="cd-timeline-img cd-picture">
−
<div class="custom-calendar-wrap">
+
<i class="fa fa-users timeline-icons" aria-hidden="true"></i>
−
<div id="custom-inner" class="custom-inner">
+
−
<div class="custom-header clearfix">
+
</div> <!-- cd-timeline-img -->
−
<nav>
+
−
<span id="custom-prev" class="custom-prev"></span>
+
−
<span id="custom-next" class="custom-next"></span>
+
−
</nav>
+
−
<h2 id="custom-month" class="custom-month"></h2>
+
−
<h3 id="custom-year" class="custom-year"></h3>
+
−
</div>
+
−
<div id="calendar" class="fc-calendar-container"></div>
+
−
</div>
+
−
</div>
+
−
</section>
+
−
</div><!-- /container -->
+
−
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+
−
<script type="text/javascript" src="https://2016.igem.org/Template:Hong_Kong_UCCKE/JS/calendario?action=raw"></script>
+
−
<script type="text/javascript" src="https://2016.igem.org/Template:Hong_Kong_UCCKE/JS/calendariodata?action=raw"></script>
+
−
<script type="text/javascript">
+
−
$(function() {
+
−
+
−
var transEndEventNames = {
+
−
'WebkitTransition' : 'webkitTransitionEnd',
+
−
'MozTransition' : 'transitionend',
+
−
'OTransition' : 'oTransitionEnd',
+
−
'msTransition' : 'MSTransitionEnd',
+
−
'transition' : 'transitionend'
+
−
},
+
−
transEndEventName = transEndEventNames[ Modernizr.prefixed( 'transition' ) ],
+
−
$wrapper = $( '#custom-inner' ),
+
−
$calendar = $( '#calendar' ),
+
−
cal = $calendar.calendario( {
+
−
onDayClick : function( $el, $contentEl, dateProperties ) {
+
  
−
if( $contentEl.length > 0 ) {
+
<div class="cd-timeline-content">
−
showEvents( $contentEl, dateProperties );
+
<h2>Meeting with Team:HKU</h2>
−
}
+
<p style="text-align:left !important;">We had our third meeting with the HKU iGem team to update each other with our progress thus to confirm some details of an extra collaborative activity. Simultaneously we have finished analyzing the data extracted from the experiment carried out previously. <br>
 +
<img src="https://static.igem.org/mediawiki/2016/5/59/T--Hong_Kong_UCCKE--collabhku5.jpeg" style="width:100%; max-width:400px;">
 +
</p>
 +
<span class="cd-date">Aug 19</span>
 +
</div> <!-- cd-timeline-content -->
 +
</div> <!-- cd-timeline-block -->
 +
</section> <!-- cd-timeline -->
 +
<script src="https://2016.igem.org/Template:Hong_Kong_UCCKE/NotebookTwoJS?action=raw&amp;ctype=text/javascript"></script>
 +
</div>
  
−
},
 
−
caldata : codropsEvents,
 
−
displayWeekAbbr : true
 
−
} ),
 
−
$month = $( '#custom-month' ).html( cal.getMonthName() ),
 
−
$year = $( '#custom-year' ).html( cal.getYear() );
 
  
−
$( '#custom-next' ).on( 'click', function() {
 
−
cal.gotoNextMonth( updateMonthYear );
 
−
} );
 
−
$( '#custom-prev' ).on( 'click', function() {
 
−
cal.gotoPreviousMonth( updateMonthYear );
 
−
} );
 
  
−
function updateMonthYear() {
 
−
$month.html( cal.getMonthName() );
 
−
$year.html( cal.getYear() );
 
−
}
 
  
−
// just an example..
 
−
function showEvents( $contentEl, dateProperties ) {
 
  
−
hideEvents();
 
−
 
−
var $events = $( '<div id="custom-content-reveal" class="custom-content-reveal"><h4>Events for ' + dateProperties.monthname + ' ' + dateProperties.day + ', ' + dateProperties.year + '</h4></div>' ),
 
−
$close = $( '<span class="custom-content-close"></span>' ).on( 'click', hideEvents );
 
  
−
$events.append( $contentEl.html() , $close ).insertAfter( $wrapper );
 
−
 
−
setTimeout( function() {
 
−
$events.css( 'top', '0%' );
 
−
}, 25 );
 
  
−
}
+
<style>
−
function hideEvents() {
+
.cd-timeline-content {
 +
    background-color: rgba(241, 241, 241, 0.7) !important;
 +
}
 +
.cd-timeline-content h2 {
 +
    font-size:25px !important;
 +
}
 +
.cd-timeline-content .cd-read-more, .cd-timeline-content .cd-date {
 +
    font-size:19px !important;
 +
}
 +
.timeline-icons {
 +
    font-size: 20px;
 +
    color: #fff;
 +
    margin-left: 10px;
 +
    margin-top: 10px;
 +
}
 +
@media only screen and (min-width: 1170px) {
 +
.timeline-icons {
 +
    font-size: 20px;
 +
    color: #fff;
 +
    margin-left: 20px;
 +
    margin-top: 20px;
 +
}
 +
}
 +
</style>
  
−
var $events = $( '#custom-content-reveal' );
 
−
if( $events.length > 0 ) {
 
−
 
−
$events.css( 'top', '100%' );
 
−
Modernizr.csstransitions ? $events.on( transEndEventName, function() { $( this ).remove(); } ) : $events.remove();
 
  
−
}
+
<style>
−
 
+
.wholehead, .teaminnumbercont, .mainfooter, .tourbefore {
−
}
+
    background-color: #d0b153 !important;
−
+
}
−
});
+
nav[data-toggle='toc'] .nav > .active > a, nav[data-toggle='toc'] .nav > .active:hover > a, nav[data-toggle='toc'] .nav > .active:focus > a {
−
</script>
+
    border-left: 1px solid #d0b153 !important;
 +
    color: #d0b153 !important;
 +
}
 +
nav[data-toggle='toc'] .nav > li > a:hover, nav[data-toggle='toc'] .nav > li > a:focus {
 +
    border-left: #d09153 !important;
 +
    color: #d0b153 !important;
 +
}
 +
.label-primary {
 +
    background-color: #b79634 !important;
 +
}
 +
.header-down:hover {
 +
    color: #7b6523 !important;
 +
}
 +
.copyrightfooter {
 +
    background-color: #a48b41 !important;
 +
}
 +
#return-to-top {
 +
    background: rgba(208, 177, 83, 0.8) !important;
 +
}
 +
#return-to-top:hover {
 +
    background: rgb(208, 177, 83) !important;
 +
}
 +
.mainfooter .fa:hover {
 +
    color: #cdbd8e !important;
 +
}
 +
.tourbefore:hover {
 +
    background-color: #a68d42 !important;
 +
}
 +
#normalsec a {
 +
    color: #d0b153 !important;
 +
}
 +
</style>
 +
<center style="margin-left:5px; margin-right:5px;">
 
</html>
 
</html>
 +
{{Hong_Kong_UCCKE/tourbefore|Results|Results|Parts|Parts}}
 +
<html>
 +
</center>
 +
</html>
 +
 
{{Hong_Kong_UCCKE/heyfooter}}
 
{{Hong_Kong_UCCKE/heyfooter}}
 
{{Hong_Kong_UCCKE/illbeback}}
 
{{Hong_Kong_UCCKE/illbeback}}

Latest revision as of 16:24, 19 October 2016

Meeting with Team:HKU

We have met the members from the Hong Kong University iGem team (known as the HKU iGem team), briefly introduce to them our interested area of study and the origin of the idea. By sharing our interested fields, we established a close bond in between. Thanks to the HKU iGem team, we can set our topic with more background knowledges provided.

Apr 20

Finalized project idea

We have finalized the area of investigation during our meeting after 3 weeks of researches and discussion subsequent to our meeting with HKU iGem team. We have eventually decided to investigate on C. elegans, a kind of well-studied roundworm which has a short life cycle and is easy to reproduce.

May 9

Meeting with Team:HKU

We have the second meeting with the HKU iGem team through video conference software to exchange our progress and discussed on the possibility of further development regarding our collaboration bond.

Jun 29
Location

Um....

Supposedly we should meet to kick off our experiments on our project, yet it was cancelled due to the bad weather.

Aug 10
Location

Preperation for experiment

Meeting in the laboratory, we are briefed by our co-workers on the characteristics of C. elegans before doing and hands on experiment in the morning. Meanwhile we started on preparing for the presentation in the Giant Jamboree. We started having practices on the experiment before the real one.

Aug 11
Location

Experiment, collect data

Laboratory work continues and the presentation preparation goes quite well. We started our real experiment today and a few chemicals were tested. The results are quite surprising as some of the results are completely different from our expectation. Data is being collected and inputted at the same time

Aug 12
Location

Experiment, collect data

This is the last day we planned to carry out our experiments. The presentation preparation is mostly done and the results of the experiment are all inputted.

Aug 15

Meeting with Team:HKU

We had our third meeting with the HKU iGem team to update each other with our progress thus to confirm some details of an extra collaborative activity. Simultaneously we have finished analyzing the data extracted from the experiment carried out previously.

Aug 19