Team:Alberta/Parts

From 2013.igem.org

(Difference between revisions)
Line 1: Line 1:
<html>
<html>
 +
  <head>
 +
  <style type="text/css">
 +
    .titlebar {
 +
      height:130px;
 +
      width:100%;
 +
    }
 +
    .bin {
 +
      background:url('/wiki/images/thumb/2/26/Background.png/541px-Background.png');
 +
      background-size:100% auto;
 +
      padding-top:20px;
 +
    }
 +
    .nav-icon {
 +
      background-image:url('/wiki/images/6/69/Nav-icon.png');
 +
      display:inline-block;
 +
      position:fixed;
 +
      width:23px;
 +
      height:37px;
 +
      margin-top:-17px;
 +
    }
 +
    .block {
 +
      background-color:white;
 +
      border:1px grey solid;
 +
      padding:10px;
 +
      margin:10px;
 +
      border-radius:5px;
 +
      box-shadow: 0px 0px 30px #444444;
 +
    }
 +
    .titlebar {
 +
      position:fixed;
 +
      top:0px;
 +
      height:130px;
 +
      margin-left:-5px;
 +
      width:975px;
 +
      z-index:2;
 +
      background-color:#FFF;
 +
    }
 +
    .titlebar h3, h4 {
 +
      text-align:center;
 +
    }
 +
    .sidebar {
 +
      position:fixed;
 +
      top:190px;
 +
      float:left;
 +
      z-index:3;
 +
      padding: 0 0px 0px 40px;
 +
    }
 +
    .main {
 +
      position:relative;
 +
      float:right;
 +
      width:720px;
 +
    }
 +
    .clear {
 +
      clear:both;
 +
    }
 +
  .ualberta-logo {
 +
      position:fixed;
 +
      margin-left:70px;
 +
      margin-top:-60px;
 +
      width:180px;
 +
    }
 +
    .igem-logo {
 +
      position:fixed;
 +
      margin-left:650px;
 +
      margin-top:-90px;
 +
      width: 150px;
 +
    }
 +
    .igem-bar {
 +
      position:relative;
 +
      left:340px;
 +
    }
 +
    .igem-bar a {
 +
      padding:0 !important;
 +
    }
 +
    .igem-bar img {
 +
      height:38px;
 +
    }
 +
    .tooltip {
 +
      width:100%;
 +
    }
 +
    .tooltip .saying {
 +
      background: #EEE;
 +
      color: #444;
 +
      left: 100px;
 +
      margin-bottom: 15px;
 +
      opacity: 0;
 +
      padding: 20px;
 +
      position: absolute;
 +
      visibility: hidden;
 +
      min-width:200px;
 +
      max-width:500px;
 +
      -webkit-transform: translateX(10px);
 +
        -moz-transform: translateX(10px);
 +
          -ms-transform: translateX(10px);
 +
          -o-transform: translateX(10px);
 +
              transform: translateX(10px);
 +
      -webkit-transition: all .25s ease-out;
 +
        -moz-transition: all .25s ease-out;
 +
          -ms-transition: all .25s ease-out;
 +
            -o-transition: all .25s ease-out;
 +
              transition: all .25s ease-out;
 +
      -webkit-border-radius:6px;
 +
        -moz-border-radius:6px;
 +
          -ms-border-radius:6px;
 +
            -o-border-radius:6px;
 +
              border-radius:6px;
 +
      -webkit-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
 +
        -moz-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
 +
          -ms-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
 +
            -o-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
 +
              box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
 +
    }
 +
    .tooltip .saying {
 +
      content: " ";
 +
      top:100px;
 +
      display:block;
 +
      left: 200px;
 +
      max-height:1000px;
 +
      position: absolute;
 +
    } 
 +
    .tooltip .saying:after {
 +
      border-bottom: solid transparent 10px;
 +
      border-top: solid transparent 10px;
 +
      border-right: solid #EEE 10px;
 +
      left: 10px;
 +
      top:10px;
 +
      content: "";
 +
      margin-left:-16px;
 +
      position: absolute;
 +
      width: 0;
 +
      max-height:1000px;
 +
      display:block;
 +
    }
 +
    .tooltip:hover .saying {
 +
      opacity: 1;
 +
      visibility: visible;
 +
      -webkit-transform: translateX(0px);
 +
        -moz-transform: translateX(0px);
 +
          -ms-transform: translateX(0px);
 +
            -o-transform: translateX(0px);
 +
              transform: translateX(0px);
 +
    }
 +
    .active {
 +
      color:#04acec !important;
 +
    }
 +
    .navbar, .navbar ul {
 +
      margin:0;
 +
      padding:0;
 +
      list-style:none;
 +
    }
 +
    .navbar {
 +
      width:963px;
 +
      margin:60px auto;
 +
      position:fixed;
 +
      top:70px;
 +
      z-index:4;
 +
      border: 1px solid #DDD;
 +
      background-color:#FFF;
 +
      background-image: -moz-linear-gradient(#FFF, #DDD);
 +
      background-image: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#DDD));
 +
      background-image: -webkit-linear-gradient(#FFF, #DDD);
 +
      background-image: -ms-linear-gradient(#FFF, #DDD);
 +
      background-image: linear-gradient(#FFF, #DDD);
 +
      -moz-box-shadow: 0 1px 1px #444, 0 1px 0 #444;
 +
      -webkit-box-shadow: 0 1px 1px #444, 0 1px 0 #444;
 +
      box-shadow: 0 1px 1px #444, 0 1px 0 #444;
 +
      zoom:1;
 +
    }
 +
    .navbar:before, .navbar:after {
 +
      content: "";
 +
      display: table;
 +
    }
 +
    .navbar:after {
 +
      clear:both;
 +
    }
 +
    .navbar li {
 +
      float:left;
 +
      border-right:1px solid #CCC;
 +
      -moz-box-shadow:1px 0 0 #EEE;
 +
      -webkit-box-shadow: 1px 0 0 #EEE;
 +
      box-shadow: 1px 0 0 #EEE;
 +
      position: relative;
 +
    }
 +
    .navbar a {
 +
      float: left;
 +
      padding: 12px 30px;
 +
      color: #444;
 +
      font: bold 12px Arial, Helvetica;
 +
      text-decoration:none;
 +
      /*text-shadow: 0 1px 0 #333;*/
 +
    }
 +
    .navbar li:hover > a {
 +
      color:#BBB;
 +
    }
 +
    .navbar li a:hover { /* IE6 only */
 +
      color:#BBB;
 +
    }
 +
    .navbar ul {
 +
      margin:20px 0 0 0;
 +
      _margin: 0; /* IE6 only */
 +
      opacity: 0;
 +
      visibility: hidden;
 +
      position:absolute;
 +
      top:38px;
 +
      left:0;
 +
      z-index:1;
 +
      background:#FFF;
 +
      background: -moz-linear-gradient(#FFF, #CCC);
 +
      background-image: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#CCC));
 +
      background: -webkit-linear-gradient(#FFF, #CCC);
 +
      background: -o-linear-gradient(#FFF, #CCC);
 +
      background: -ms-linear-gradient(#FFF, #CCC);
 +
      background: linear-gradient(#FFF, #CCC);
 +
      -moz-box-shadow: 0 -1px rgba(255,255,255,.3);
 +
      -webkit-box-shadow: 0 -1px rgba(255,255,255,.3);
 +
      -box-shadow:0 -1px 0 rgba(255,255,255,.3);
 +
      -moz-border-radius: 3px;
 +
      -webkit-border-radius: 3px;
 +
      border-radius: 3px;
 +
      -webkit-transition: all .2s ease-in-out;
 +
      -moz-transition: all .2s ease-in-out;
 +
      -ms-transition: all .2s ease-in-out;
 +
      -o-transition: all .2s ease-in-out;
 +
      transition: all .2s ease-in-out;
 +
    }
 +
    .navbar li:hover > ul {
 +
      opacity: 1;
 +
      visibility: visible;
 +
      margin:0;
 +
    }
 +
    .navbar ul ul {
 +
      top:0;
 +
      left:150px;
 +
      margin:0 0 0 20px;
 +
      _margin:0;/*IE6 only*/
 +
      -moz-box-shadow:-1px 0 0 rgba(255,255,255,.3);
 +
      -webkit-box-shadow:-1px 0 0 rgba(255,255,255,.3);
 +
      box-shadow:-1px 0 0 rgba(255,255,255,.3);
 +
    }
 +
    .navbar ul li {
 +
      float:none;
 +
      display:block;
 +
      border:0;
 +
      _line-height:0; /*IE6 only*/
 +
      -moz-box-shadow: 0 1px 0 #AAA, 0 2px 0 #FFF;
 +
      -webkit-box-shadow: 0 1px 0 #AAA, 0 2px 0 #FFF;
 +
      box-shadow: 0 1px 0 #AAA, 0 2px 0 #FFF;
 +
    }
 +
    .navbar ul li:last-child {
 +
      -moz-box-shadow:none;
 +
      -webkit-box-shadow:none;
 +
      box-shadow:none;
 +
    }
 +
    .navbar ul a {
 +
      padding:10px;
 +
      width:130px;
 +
      _height:10px;/*IE6 only*/
 +
      display:block;
 +
      white-space:nowrap;
 +
      float:none;
 +
      text-transform:none;
 +
    }
 +
    .navbar ul a:hover {
 +
      background-color:#0186ba;
 +
      background-image: -moz-linear-gradient(#04acec, #0186ba);
 +
      background-image: -webkit-gradient(linear, left top, left bottom, from(#04acec), to(#0186ba));
 +
      background-image: -webkit-linear-gradient(#04acec, #0186ba);
 +
      background-image: -ms-linear-gradient(#04acec, #0186ba);
 +
      background-image: linear-gradient(#04acec, #0186ba);
 +
    }
 +
    .navbar ul li:first-child > a {
 +
      -moz-border-radius: 3px 3px 0 0;
 +
      -webkit-border-radius: 3px 3px 0 0;
 +
      border-radius: 3px 3px 0 0;
 +
    }
 +
    .navbar ul li:first-child > a:after {
 +
      content:'';
 +
      position:absolute;
 +
      left:40px;
 +
      top:-6px;
 +
      border-left:6px solid transparent;
 +
      border-right:6px solid transparent;
 +
      border-bottom:6px solid #FFF;
 +
    }
 +
    .navbar ul ul li:first-child a:after {
 +
      left:-6px;
 +
      top:50%;
 +
      margin-top:-6px;
 +
      border-left:0;
 +
      border-bottom:6px solid transparent;
 +
      border-top: 6px solid transparent;
 +
      border-right:6px solid #3b3b3b;
 +
    }
 +
    .navbar ul li:first-child a:hover:after {
 +
      border-bottom-color: #04acec;
 +
    }
 +
    .navbar ul ul li:first-child a:hover:after {
 +
      border-right-color: #0299d3;
 +
      border-bottom-color:transparent;
 +
    }
 +
    .navbar ul li:last-child > a {
 +
      -moz-border-radius: 0 0 3px 3px;
 +
      -webkit-border-radius: 0 0 3px 3px;
 +
      border-radius: 0 0 3px 3px;
 +
    }
 +
    .centered {
 +
      text-align:center;
 +
    }
 +
    .centered-well {
 +
      text-align:center;
 +
      width:80%;
 +
      margin:0 auto;
 +
      padding:5px;
 +
      background-color:#CCC;
 +
      border-radius:6px;
 +
      -moz-border-radius:6px;
 +
      -o-border-radius:6px;
 +
      -webkit-border-radius:6px;
 +
    }
 +
    .thumbnails {
 +
      padding: 35px;
 +
      width:700px;
 +
      margin:0 auto;
 +
    }
 +
    .thumbnail {
 +
      position:relative;
 +
      display:inline-block;
 +
      left:180px;
 +
    }
 +
    .thumbnail img{
 +
      /* ... */
 +
      height:100px;
 +
      position:relative;
 +
      -webkit-transition: all .25s ease-out;
 +
        -moz-transition: all .25s ease-out;
 +
          -ms-transition: all .25s ease-out;
 +
            -o-transition: all .25s ease-out;
 +
              transition: all .25s ease-out;
 +
    }   
 +
    .thumbnail img:hover {
 +
      transform:scale(4,4);
 +
      -webkit-transform:scale(4,4);
 +
        -moz-transform:scale(4,4);
 +
        -ms-transform:scale(4,4);
 +
          -o-transform:scale(4,4);
 +
      z-index:999;
 +
      background-color:white;
 +
      border:solid 2px #CCC;
 +
      border-radius:1px;
 +
      -moz-border-radius:1px;
 +
      -o-border-radius:1px;
 +
      -webkit-border-radius:1px;
 +
      -moz-box-shadow: 0px 0px 30px #000;
 +
      -o-box-shadow: 0px 0px 30px #000;
 +
      -webkit-box-shadow: 0px 0px 30px #000;
 +
      box-shadow: 0px 0px 30px #000;
 +
     
 +
    }
 +
  </style>
 +
  </head>
 +
  <body>
 +
    <div class="titlebar">
 +
      <h3>The Littlest Mapmaker</h3>
 +
      <h4>"Exploration into the world of <a href="#">DNA Computing</a>"<br/>
 +
        Team Alberta: University of Alberta</h4>
 +
      <a href="http://www.ualberta.ca" class="ualberta-logo"><img src="/wiki/images/b/b3/Ualberta-logo.png" alt="University of Alberta"></img></a>
 +
      <a href="https://2013.igem.org" class="igem-logo"><img src="/wiki/images/a/ad/IGem-logo.png" alt="iGem Main Page"></img></a>
 +
    </div>
 +
    <div class="bin">
 +
      <ul class="navbar">
 +
        <li><a  href="/Team:Alberta">Home</a></li>
 +
        <li><a id="project" href="#">Project</a>
 +
          <ul>
 +
            <li><a href="/Team:Alberta/Project">Overview</a></li>
 +
            <li><a href="/Team:Alberta/Methodology">Methodology</a></li>
 +
            <li><a href="/Team:Alberta/Applications">Applications</a></li>
 +
          </ul>
 +
        </li>
 +
        <li><i class="nav-icon"></i><a id="notebook" href="#" class="active">Notebook</a>
 +
          <ul>
 +
            <li><a href="/Team:Alberta/Notebook">Timeline</a></li>
 +
            <li><a href="/Team:Alberta/Parts" class="active">BioBricks</a></li>
 +
          </ul>
 +
        </li>
 +
        <li><a id="team" href="#">Team</a>
 +
          <ul>
 +
            <li><a href="/Team:Alberta/Team">Roster</a></li>
 +
            <li><a href="https://igem.org/Team.cgi?year=2013&team_name=Alberta">Official Profile</a></li>
 +
            <li><a href="/Team:Alberta/Attributions">Sponsers</a></li>
 +
          </ul>
 +
        </li>
 +
        <li><a id="humanpractices" href="#">Human Practices</a>
 +
          <ul>
 +
            <li><a href="/Team:Alberta/Safety">Safety</a></li>
 +
            <li><a href="/Team:Alberta/Community">Community</a></li>
 +
          </ul>
 +
        </li>
 +
      <div class="igem-bar"><a href="https://2013.igem.org"><img src="/wiki/images/a/ad/IGem-logo.png"></img></a></div>
 +
      </ul>
 +
      <div class="sidebar">
 +
        <div href class="tooltip"><img src="/wiki/images/7/7d/SideChar.png"></img>
 +
          <span class="saying">Welcome to the Team Alberta Wiki!
 +
            <div id="box" style="width: 450px; padding: 5px; border: 3px solid #000; background-color: #000000;">
 +
            <div id="template" style="text-align: center; font-weight: bold; font-size: large; color: #f6f6f6; padding: 5px;">
 +
              For visitors: this site is currently under construction. Please contact our Student Liason, Dawson at                  daocun@ualberta.ca, for more information on our current project and how to support us!
 +
            </div>
 +
            </div>
 +
          </span>
 +
        </div>
 +
      </div>
 +
      <div class="main">
 +
      <div class="block">
 +
        <img src="/wiki/images/e/e8/Mapmaker-banner.jpg"></img>
 +
      </div>
 +
      <div class="block">
 +
      <p> An important aspect of the iGEM competition is the use and creation of standard  biological parts. Each team will make new parts during iGEM and will place them in the [http://partsregistry.org Registry of Standard Biological Parts]. The iGEM software provides an easy way to present the parts your team has created . The "groupparts" tag will generate a table with all of the parts that your team adds to your team sandbox.  Note that if you want to document a part you need to document it on the [http://partsregistry.org Registry], not on your team wiki.
 +
 +
Remember that the goal of proper part documentation is to describe and define a part such that it can be used without a need to refer to the primary literature. The next iGEM team should be able to read your documentation and be able to use the part successfully. Also, you should provide proper references to acknowledge previous authors and to provide for  users who wish to know more.</p>
 +
 +
 +
<groupparts>iGEM013 Alberta</groupparts>
 +
      </div>
 +
      </div>
 +
      <div class="clear"></div>
 +
    </div>
 +
  </body>
 +
</html>
 +
 +
 +
<!-- <html>
<div id="box" style="width: 700px; margin-left: 137px; padding: 5px; border: 3px solid #000; background-color: #000000;">
<div id="box" style="width: 700px; margin-left: 137px; padding: 5px; border: 3px solid #000; background-color: #000000;">
<div id="template" style="text-align: center; font-weight: bold; font-size: large; color: #f6f6f6; padding: 5px;">
<div id="template" style="text-align: center; font-weight: bold; font-size: large; color: #f6f6f6; padding: 5px;">
Line 28: Line 457:
<groupparts>iGEM013 Alberta</groupparts>
<groupparts>iGEM013 Alberta</groupparts>
 +
 +
-->

Revision as of 19:57, 2 September 2013

The Littlest Mapmaker

"Exploration into the world of DNA Computing"
Team Alberta: University of Alberta

An important aspect of the iGEM competition is the use and creation of standard biological parts. Each team will make new parts during iGEM and will place them in the [http://partsregistry.org Registry of Standard Biological Parts]. The iGEM software provides an easy way to present the parts your team has created . The "groupparts" tag will generate a table with all of the parts that your team adds to your team sandbox. Note that if you want to document a part you need to document it on the [http://partsregistry.org Registry], not on your team wiki. Remember that the goal of proper part documentation is to describe and define a part such that it can be used without a need to refer to the primary literature. The next iGEM team should be able to read your documentation and be able to use the part successfully. Also, you should provide proper references to acknowledge previous authors and to provide for users who wish to know more.

iGEM013 Alberta