Difference between revisions of "Team:NUS Singapore-A/Part Collection"

(Prototype team page)
 
Line 1: Line 1:
 
{{NUS_Singapore-A}}
 
{{NUS_Singapore-A}}
 
<html>
 
<html>
 +
   
 +
    <head>
 +
        <link href="https://fonts.googleapis.com/css?family=Montserrat:300,400,600" rel="stylesheet">
 +
        <link href="https://fonts.googleapis.com/css?family=Lora:400,400i" rel="stylesheet">
 +
    </head>
  
 +
<!-- <script type="text/javascript" src="https://2018.igem.org/common/MathJax-2.5-latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>  -->
  
 +
<script src="https://2018.igem.org/common/MathJax-2.5-latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
 +
<script type="text/x-mathjax-config">
 +
  MathJax.Hub.Config({tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]}});
 +
</script>
  
−
<div class="column full_size judges-will-not-evaluate">
+
<style>
−
<h3>★  ALERT! </h3>
+
    /***************************************************CSS STARTS HERE*********************************************************/
−
<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>
+
    /* The accordion is the class given to the drop-down menu thingy */
−
<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>
+
    .accordion {
−
</div>
+
        background-color: #f2f2f2;
 +
        color: black;
 +
        cursor: pointer;
 +
        padding: 15px;
 +
        width: 90%;
 +
        text-align: left;
 +
        margin-left: 5%;
 +
        margin-right: 5%;
 +
        border: none;
 +
        outline: none;
 +
        /* I wanted to give a gradual change, but it's having some trouble reading the 'transition' property. I'll look into having it javascripted instead. */
 +
        /*transition: 0.4s ease;*/
 +
        font-family: "Montserrat", sans-serif;
 +
        font-weight: 300;
 +
        font-size: 20px;
 +
    }
 +
   
 +
    /* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
 +
    .active, .accordion:hover {
 +
        font: bold 20px "Montserrat", sans-serif;
 +
        background-color: #e6e6e6;
 +
    }
 +
   
 +
    /* Style the accordion panel. Note: hidden by default */
 +
    .panel {
 +
        background-color: white;
 +
        text-align: left;
 +
        margin-top: 10px;
 +
        max-height: 0;
 +
        overflow: hidden;
 +
        transition: max-height 0.2s ease-out;
 +
    }
 +
    .accordion:after {
 +
        content: '+';
 +
        font-size: 13px;
 +
        color: #777;
 +
        float: right;
 +
        margin-left: 5px;
 +
    }
 +
   
 +
    /* Not sure why this function does not work. Need to check */
 +
    .active:after {
 +
        content: "-";
 +
    }
  
 +
    table, th, td {
 +
        border: none;
 +
        border-collapse: collapse;
 +
    }
 +
    table {
 +
        font-family: "Lora";
 +
        font-size: 13px;
 +
        word-spacing: 0.5em;
 +
    }
  
−
<div class="clear"></div>
+
    th, td {
 +
        text-align: left;
 +
        padding: 3px;
 +
    }
  
 +
    table caption {
  
 +
    }
  
 +
    h1 {
 +
        font-family: "MONTSERRAT", sans-serif;
 +
        font-weight: bold;
 +
        font-size: 22px;
 +
        text-align: left;
 +
        color: black;
 +
        padding-left: 5%;
 +
        padding-top: 1.5%;
 +
        padding-bottom: 1%;
 +
        border: none;
 +
    }
 +
   
 +
    h2 {
 +
        font-family: "Lora", sans;
 +
        font-weight: 300;
 +
        text-align: left;
 +
        color: black;
 +
        margin-left: 5%;
 +
        margin-bottom: 15px; 
 +
    }
  
−
<div class="column full_size">
+
    h3 {
 +
        font-family: "Lora", sans;
 +
        font-weight: 300;
 +
        text-align: left;
 +
        color: black;
 +
    }
  
−
<h1> Part Collection </h1>
 
−
<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>
 
  
−
<p>
+
    p, ol li, ul li  {
 +
        font-family: "Lora", serif;
 +
        font-size: 14px;
 +
        word-spacing: 0.5em;
 +
        text-align:justify;
 +
    }
 +
 
 +
    img {
 +
        display: block;
 +
        margin-left: auto;
 +
        margin-right: auto;
 +
    }
 +
 
 +
    .discussion_graph, .measurement_table{
 +
        width: 70%;
 +
        height: auto;
 +
        margin: auto;
 +
    }
 +
 
 +
 
 +
 
 +
    .modelling-header{
 +
        width: 47.5%;
 +
        height: auto;
 +
        margin: auto;
 +
    }
 +
    .center-justified{
 +
      text-align: justify;
 +
      margin: 0 auto;
 +
      width: 70%;
 +
    }
 +
 
 +
    /**********************
 +
    Start of two columns */
 +
    * {
 +
    box-sizing: border-box;
 +
    }
 +
 
 +
    /* Create two columns that floats next to each other */
 +
    .column {
 +
        float: left;
 +
        text-align: left;
 +
    }
 +
   
 +
    .left {
 +
        width: 50%;
 +
        padding-left: 5%;
 +
        padding-right: 2.5%;
 +
    }
 +
 
 +
    .right {
 +
        width: 50%;
 +
        padding-left: 2.5%;
 +
        padding-right: 5%;
 +
    }
 +
 
 +
    /* Clear floats after the columns */
 +
    .row:after {
 +
        content: "";
 +
        display: table;
 +
        clear: both;
 +
    }
 +
 
 +
    /********************
 +
    End of two columns */
 +
   
 +
    /***************************************************CSS ENDS HERE**********************************************************/
 +
</style>
 +
 
 +
 
 +
<body>
 +
<div class="inner-border" style="border-top: none;">
 +
 
 +
  <img src="https://static.igem.org/mediawiki/2018/a/ac/T--NUS_Singapore-A--Part_Collection_header.png" class="modelling-header">
 +
 
 +
  <h1>OVERVIEW</h1>
 +
  <div class="row">
 +
    <div class="column left" style="background-color:white;">
 +
      <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>
 +
      <br>
 +
      <p>
 
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.  
 
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.  
−
</p>
+
    </p>
−
</div>
+
  
 +
    </div>
 +
    <div class="column right" style="background-color:white;">
 +
      <p><i>Note</i>
 +
      </p>
  
−
<div class="column full_size">
+
      <br>
−
<div class="highlight decoration_background">
+
 
−
<h3>Note</h3>
+
      <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>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>
+
      </p>
−
</div>
+
      <br>
−
</div>
+
      <p> <i>Best Part Collection Special Prize</i></p>
 +
      <br>
 +
      <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>
 +
    <br>
 +
  </div>
 +
  <br>
 +
  <hr>
 +
  <br>
 +
 
 +
  <h1> ALL TITLES IN CAPS </h1>
 +
  <button class="accordion">An ACCORDION</button>
 +
  <div class="panel" style="line-height: 17em;">
 +
    <div class="row">
 +
      <div class="column left" style="background-color:white;">
 +
        <p>So stuff should go right in here.</p>
 +
      </div>
 +
      <div class="column right" style="background-color:white;">
 +
        <p> And more stuff on this side too.</p>
 +
      </div>
 +
    </div>
 +
  </div>
 +
 
 +
  <button class="accordion">OPEN ME PLEASE</button>
 +
  <div class="panel" style="line-height: 17em;">
 +
    <div class="row">
 +
      <div class="column left" style="background-color:white;">
 +
        <p>Blah Blah Blah</p>
 +
      </div>
 +
      <div class="column right" style="background-color:white;">
 +
        <p>Blargh Blargh Blargh</p>
 +
      </div>
 +
    </div>
 +
  </div>
  
−
<div class="column full_size">
 
−
<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>
 
</div>
 +
</body>
  
 +
<script>
 +
        /***************************************************JAVASCRIPT STARTS HERE**************************************************/
 +
       
 +
               
 +
        var acc = document.getElementsByClassName("accordion");
 +
        var i;
 +
       
 +
        for (i = 0; i < acc.length; i++) {
 +
            acc[i].addEventListener("click", function() {
 +
                                   
 +
                                    /* Toggle between adding and removing the "active" class,
 +
                                    to highlight the button that controls the panel */
 +
                                   
 +
                                    this.classList.toggle("active");
 +
                                   
 +
                                    /* Toggle between hiding and showing the active panel */
 +
                                   
 +
                                    var panel = this.nextElementSibling;
 +
                                    if (panel.style.display === "block") {
 +
                                    panel.style.display = "none";
 +
                                    } else {
 +
                                    panel.style.display = "block";
 +
                                    }
 +
                                    });
 +
        }
 +
   
 +
    for (i = 0; i < acc.length; i++) {
 +
        acc[i].addEventListener("click", function() {
 +
                                this.classList.toggle("active");
 +
                                var panel = this.nextElementSibling;
 +
                                if (panel.style.maxHeight){
 +
                                panel.style.maxHeight = null;
 +
                                } else {
 +
                                panel.style.maxHeight = panel.scrollHeight + "px";
 +
                                }
 +
                                });
 +
    }
 +
    /***************************************************JAVASCRIPT ENDS HERE****************************************************/
 +
</script>
 +
   
 +
     
 
</html>
 
</html>
 +
 +
{{:Team:NUS_Singapore-A/Templates/Footer}}

Revision as of 09:39, 7 September 2018

CONNECT WITH US

OVERVIEW

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.


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.

Note


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.


Best Part Collection Special Prize


To be eligible for this award, these parts must adhere to Registry sample submission guidelines 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 special prize, make sure you add your part numbers to your judging form and delete the box at the top of this page.




ALL TITLES IN CAPS

So stuff should go right in here.

And more stuff on this side too.

Blah Blah Blah

Blargh Blargh Blargh



HEAR OUR STORY

We’re using synthetic biology to change the way the world thinks and functions.

We’re a little disruptive, dangerous and maybe a tad too bold. But the world needs some shaking up every now and then, and we think we’re just the right people for that.

Together we’re going to engineer biology and create something awesome.

CONTACT US

nusigem@gmail.com

21 Lower Kent Ridge Rd, Singapore 119077