|
|
(7 intermediate revisions by 2 users not shown) |
Line 1: |
Line 1: |
| {{Template:Vanderbilt_Header}} | | {{Template:Vanderbilt_Header}} |
| {{Template:Vanderbilt_Navbar}} | | {{Template:Vanderbilt_Navbar}} |
| + | {{Template:Vanderbilt_Style}} |
| + | |
| <html> | | <html> |
| | | |
− | <style> | + | <div id="breadcrumb_container" class="container" style="position:fixed; top:88px; z-index:2;"> |
− | | + | <div class="row"> |
− | html, body {
| + | <div class="btn-group btn-breadcrumb"> |
− | height: 100%;
| + | <a href="#" class="btn btn-default"><i class="glyphicon glyphicon-cd"></i></a> |
− | background-color: #3e0812;
| + | <a href="https://2015.igem.org/Team:Vanderbilt/Software/Development" class="btn btn-default">Development</a> |
− | }
| + | <a href="https://2015.igem.org/Team:Vanderbilt/Software/User_Guide" class="btn btn-default chosen">User Guide</a> |
− | | + | <a href="https://2015.igem.org/Team:Vanderbilt/Software/Stats" class="btn btn-default">Statistics</a> |
− | body {
| + | </div> |
− | position: relative;
| + | </div> |
− | height: 100%;
| + | |
− | }
| + | |
− | | + | |
− | .footer {
| + | |
− | position: absolute;
| + | |
− | bottom: 0;
| + | |
− | width: 100%;
| + | |
− | /* Set the fixed height of the footer here */
| + | |
− | background-color: #3e0812;
| + | |
− | left: 0;
| + | |
− | }
| + | |
− | | + | |
− | .row-height {
| + | |
− | display: table;
| + | |
− | table-layout: fixed;
| + | |
− | height: 100%;
| + | |
− | width: 100%;
| + | |
− | }
| + | |
− | | + | |
− | @keyframes dnaFadeInOut {
| + | |
− | 0% {opacity:1;}
| + | |
− | 17% {opacity:1;}
| + | |
− | 25% {opacity:0;}
| + | |
− | 92% {opacity:0;}
| + | |
− | 100% {opacity:1;}
| + | |
− | }
| + | |
− | | + | |
− | @-o-keyframes dnaFadeInOut {
| + | |
− | 0% {opacity:1;}
| + | |
− | 17% {opacity:1;}
| + | |
− | 25% {opacity:0;}
| + | |
− | 92% {opacity:0;}
| + | |
− | 100% {opacity:1;}
| + | |
− | }
| + | |
− | @-moz-keyframes dnaFadeInOut {
| + | |
− | 0% {opacity:1;}
| + | |
− | 17% {opacity:1;}
| + | |
− | 25% {opacity:0;}
| + | |
− | 92% {opacity:0;}
| + | |
− | 100% {opacity:1;}
| + | |
− | }
| + | |
− | @-webkit-keyframes dnaFadeInOut {
| + | |
− | 0% {opacity:1;}
| + | |
− | 17% {opacity:1;}
| + | |
− | 25% {opacity:0;}
| + | |
− | 92% {opacity:0;}
| + | |
− | 100% {opacity:1;}
| + | |
− | }
| + | |
− | | + | |
− | .dnaStrand img:nth-of-type(1) {
| + | |
− | -webkit-animation-delay: 6s;
| + | |
− | -moz-animation-delay: 6s;
| + | |
− | -o-animation-delay: 6s;
| + | |
− | animation-delay: 6s;
| + | |
− | }
| + | |
− | .dnaStrand img:nth-of-type(2) {
| + | |
− | -webkit-animation-delay: 4s;
| + | |
− | -moz-animation-delay: 4s;
| + | |
− | -o-animation-delay: 4s;
| + | |
− | animation-delay: 4s;
| + | |
− | }
| + | |
− | .dnaStrand img:nth-of-type(3) {
| + | |
− | -webkit-animation-delay: 2s;
| + | |
− | -moz-animation-delay: 2s;
| + | |
− | -o-animation-delay: 2s;
| + | |
− | animation-delay: 2s;
| + | |
− | }
| + | |
− | .dnaStrand img:nth-of-type(4) {
| + | |
− | -webkit-animation-delay: 0;
| + | |
− | -moz-animation-delay: 0;
| + | |
− | -o-animation-delay: 0;
| + | |
− | animation-delay: 0;
| + | |
− | }
| + | |
− | | + | |
− | .dnaStrand {
| + | |
− | position: relative;
| + | |
− | width: 100%;
| + | |
− | height: 100%;
| + | |
− | }
| + | |
− | | + | |
− | .dnaStrand img {
| + | |
− | position: absolute;
| + | |
− | height: 95%;
| + | |
− | width: 95%;
| + | |
− | vertical-align: top;
| + | |
− | }
| + | |
− |
| + | |
− | .dnaStrand img {
| + | |
− | -webkit-animation-name: dnaFadeInOut;
| + | |
− | -webkit-animation-timing-function: ease-in-out;
| + | |
− | -webkit-animation-iteration-count: infinite;
| + | |
− | -webkit-animation-duration: 8s;
| + | |
− | | + | |
− | -moz-animation-name: dnaFadeInOut;
| + | |
− | -moz-animation-timing-function: ease-in-out;
| + | |
− | -moz-animation-iteration-count: infinite;
| + | |
− | -moz-animation-duration: 8s;
| + | |
− | | + | |
− | -o-animation-name: dnaFadeInOut;
| + | |
− | -o-animation-timing-function: ease-in-out;
| + | |
− | -o-animation-iteration-count: infinite;
| + | |
− | -o-animation-duration: 8s;
| + | |
− | | + | |
− | animation-name: dnaFadeInOut;
| + | |
− | animation-timing-function: ease-in-out;
| + | |
− | animation-iteration-count: infinite;
| + | |
− | animation-duration: 8s;
| + | |
− | }
| + | |
− | | + | |
− | | + | |
− | .grid {
| + | |
− | background-color: #5f212c;
| + | |
− | }
| + | |
− | | + | |
− | /* clear fix */
| + | |
− | .grid:after {
| + | |
− | content: '';
| + | |
− | display: block;
| + | |
− | clear: both;
| + | |
− | }
| + | |
− | | + | |
− | /* ---- .element-item ---- */
| + | |
− | | + | |
− | /* 6 columns, percentage width */
| + | |
− | .grid-item,
| + | |
− | .grid-sizer {
| + | |
− | width: 16.666%;
| + | |
− | margin: 0px;
| + | |
− | }
| + | |
− | | + | |
− | .grid-item {
| + | |
− | float: left;
| + | |
− | background: #0D8;
| + | |
− | border: 10px solid #44111a;
| + | |
− | width: 33.333%;
| + | |
− | margin: 0px;
| + | |
− | text-align: center;
| + | |
− | }
| + | |
− | | + | |
− | .grid-item--widthFull { width:100%; }
| + | |
− | | + | |
− | .grid-item img {
| + | |
− | display: block;
| + | |
− | max-width: 100%;
| + | |
− | margin: 0px;
| + | |
− | }
| + | |
− | | + | |
− | .grid-textbox-top {
| + | |
− | border-left: 0px;
| + | |
− | border-top: 0px;
| + | |
− | border-right: 0px;
| + | |
− | border-bottom: 5px solid #44111a;
| + | |
− | line-height: 100%;
| + | |
− | vertical-align: middle;
| + | |
− | }
| + | |
− | | + | |
− | .grid-textbox-mid {
| + | |
− | border-right: 0px;
| + | |
− | border-left: 0px;
| + | |
− | border-top: 5px solid #44111a;
| + | |
− | border-bottom: 5px solid #44111a;
| + | |
− | line-height: 100%;
| + | |
− | vertical-align: middle;
| + | |
− | }
| + | |
− | | + | |
− | .grid-textbox-bot {
| + | |
− | border-right: 0px;
| + | |
− | border-left: 0px;
| + | |
− | border-top: 5px solid #44111a;
| + | |
− | border-bottom: 0px;
| + | |
− | line-height: 100%;
| + | |
− | vertical-align: middle;
| + | |
− | }
| + | |
− | | + | |
− | .carousel-inner > .item > img,
| + | |
− | .carousel-inner > .item > a > img {
| + | |
− | width: 100%;
| + | |
− | margin: auto;
| + | |
− | }
| + | |
− | | + | |
− | </style>
| + | |
− | | + | |
− | <div class="row" style="height: 100%; min-height: 100%;"> | + | |
− | <div class="row-height"> | + | |
− | <div class="col-lg-1 hidden-sm" style="height:100%"> | + | |
− | <br>
| + | |
− | <div class="dnaStrand" alt="dna strand">
| + | |
− | <img src="https://static.igem.org/mediawiki/2015/a/a6/Vanderbilt_2015_dna_strand_1.png"/>
| + | |
− | <img src="https://static.igem.org/mediawiki/2015/d/d1/Vanderbilt_2015_dna_strand_2.png"/>
| + | |
− | <img src="https://static.igem.org/mediawiki/2015/2/2a/Vanderbilt_2015_dna_strand_3.png"/>
| + | |
− | <img src="https://static.igem.org/mediawiki/2015/f/f4/Vanderbilt_2015_dna_strand_4.png"/>
| + | |
− | </div>
| + | |
| </div> | | </div> |
| | | |
− | <div class="col-md-10" style="background-color: #44111a; height: 100%;"> | + | <script> |
− | <p>Put content here</p>
| + | document.getElementById("header_text").innerHTML = "User Guide"; |
| + | </script> |
| | | |
− | <!-- footer -->
| + | <div class="row"> |
− | <div class="row" style="margin:0; border: 0; width: 100%;"> | + | <div class="col-md-10 col-md-offset-1" style="background-color: #44111a; height: 100%;"> |
− | <div class="col-lg-2" style="height:100%">
| + | <h2>User Guide</h2> |
− | <h3><font color="#7e1d2e">Team</font></h3>
| + | <p>A sequence to be optimized is input into the text field on the left hand pane of the GUI. Under the two panes there are a number of knobs, sliders, and text input fields. Those user interfaces are used to change the weighting factors, mutability factors, and types of DNA hotspots to optimize for. Then a “GO!” button is pressed to initiate the algorithm. After the algorithms are finished running, an optimized sequence is presented in the right hand pane. This optimized sequence will have the hotspots to changed highlighted. When a hotspot is selected, additional information about why it was flagged by the algorithms will be displayed. </p> |
− | <a href="https://2015.igem.org/Team:Vanderbilt/Team/About"><font color="#9e515e">About</font></a>
| + | |
− | <br>
| + | |
− | <a href="https://2015.igem.org/Team:Vanderbilt/Team/Members"><font color="#9e515e">Members</font></a>
| + | |
− | <br>
| + | |
− | <a href="https://2015.igem.org/Team:Vanderbilt/Team/Attributes"><font color="#9e515e">Attributes</font></a>
| + | |
− | <br>
| + | |
− | <a href="https://2015.igem.org/Team:Vanderbilt/Team/Sponsors"><font color="#9e515e">Sponsors</font></a>
| + | |
− | <br>
| + | |
− | </div>
| + | |
− | <div class="col-lg-2" style="height:100%">
| + | |
− | <h3><font color="#7e1d2e">Project</font></h3>
| + | |
− | <a href="https://2015.igem.org/Team:Vanderbilt/Project/Background"><font color="#9e515e">Background</font></a>
| + | |
− | <br>
| + | |
− | <a href="https://2015.igem.org/Team:Vanderbilt/Project/Sequence"><font color="#9e515e">Sequence</font></a>
| + | |
− | <br>
| + | |
− | <a href="https://2015.igem.org/Team:Vanderbilt/Project/Circuit"><font color="#9e515e">Circuit</font></a>
| + | |
− | <br>
| + | |
− | <a href="https://2015.igem.org/Team:Vanderbilt/Project/Organism"><font color="#9e515e">Organism</font></a>
| + | |
− | <br>
| + | |
− | <a href="https://2015.igem.org/Team:Vanderbilt/Project/Nanopore"><font color="#9e515e">Nanopore</font></a>
| + | |
− | <br>
| + | |
− | <a href="https://2015.igem.org/Team:Vanderbilt/Project/Achievements"><font color="#9e515e">Achievements</font></a>
| + | |
− | <br>
| + | |
− | </div>
| + | |
− | <div class="col-lg-2" style="height:100%">
| + | |
− | <h3><font color="#7e1d2e">Parts</font></h3>
| + | |
− | | + | |
− | <a href="https://2015.igem.org/Team:Vanderbilt/Parts/Part_Collection"><font color="#9e515e">Part Collection</font></a>
| + | |
− | <br>
| + | |
− | <a href="https://2015.igem.org/Team:Vanderbilt/Parts/Optimized_RFPs"><font color="#9e515e">Optimized RFPs</font></a>
| + | |
− | <br>
| + | |
− | <a href="https://2015.igem.org/Team:Vanderbilt/Parts/Visualizing_Evolution"><font color="#9e515e">Visualizing Evolution</font></a>
| + | |
− | <br>
| + | |
− | <a href="https://2015.igem.org/Team:Vanderbilt/Parts/Repair Enzymes"><font color="#9e515e">Repair Enzymes</font></a>
| + | |
− | <br>
| + | |
− | </div>
| + | |
− | <div class="col-lg-2" style="height:100%">
| + | |
− | <h3><font color="#7e1d2e">Notebook</font></h3>
| + | |
− | <a href="https://2015.igem.org/Team:Vanderbilt/Notebook/May"><font color="#9e515e">May</font></a>
| + | |
− | <br>
| + | |
− | <a href="https://2015.igem.org/Team:Vanderbilt/Notebook/June"><font color="#9e515e">June</font></a>
| + | |
− | <br>
| + | |
− | <a href="https://2015.igem.org/Team:Vanderbilt/Notebook/July"><font color="#9e515e">July</font></a>
| + | |
− | <br>
| + | |
− | <a href="https://2015.igem.org/Team:Vanderbilt/Notebook/August"><font color="#9e515e">August</font></a>
| + | |
− | <br>
| + | |
− | <a href="https://2015.igem.org/Team:Vanderbilt/Notebook/September"><font color="#9e515e">September</font></a>
| + | |
− | <br>
| + | |
− | </div> | + | |
− | <div class="col-lg-2" style="height:100%">
| + | |
− | <h3><font color="#7e1d2e">Practices</font></h3>
| + | |
− | <a href="https://2015.igem.org/Team:Vanderbilt/Practices/Safety"><font color="#9e515e">Safety</font></a>
| + | |
− | <br>
| + | |
− | <a href="https://2015.igem.org/Team:Vanderbilt/Practices/Collaborations"><font color="#9e515e">Collaborations</font></a>
| + | |
− | <br>
| + | |
− | <a href="https://2015.igem.org/Team:Vanderbilt/Practices/Real_World_Applications"><font color="#9e515e">Applications</font></a>
| + | |
− | <br>
| + | |
− | <a href="https://2015.igem.org/Team:Vanderbilt/Practices/Interlab"><font color="#9e515e">Interlab</font></a>
| + | |
− | <br>
| + | |
− | </div>
| + | |
− | <div class="col-lg-2" style="height:100%">
| + | |
− | <h3><font color="#7e1d2e">Software</font></h3>
| + | |
− | <a href="https://2015.igem.org/Team:Vanderbilt/Software/Development"><font color="#9e515e">Development</font></a>
| + | |
− | <br>
| + | |
− | <a href="https://2015.igem.org/Team:Vanderbilt/Software/User_Guide"><font color="#9e515e">User Guide</font></a>
| + | |
− | <br>
| + | |
− | <a href="https://2015.igem.org/Team:Vanderbilt/Software/Stats"><font color="#9e515e">Statistics</font></a>
| + | |
− | <br>
| + | |
− | </div>
| + | |
| </div> | | </div> |
− | <br>
| |
− | <!-- /footer -->
| |
− |
| |
| </div> | | </div> |
| | | |
− | <div class="col-lg-1 hidden-sm" style="height:100%;"> | + | </html> |
− | <br>
| + | {{Template:Vanderbilt_Footer}} |
− | <div class="dnaStrand" alt="dna strand">
| + | <html> |
− | <img src="https://static.igem.org/mediawiki/2015/a/a6/Vanderbilt_2015_dna_strand_1.png"/>
| + | |
− | <img src="https://static.igem.org/mediawiki/2015/d/d1/Vanderbilt_2015_dna_strand_2.png"/>
| + | |
− | <img src="https://static.igem.org/mediawiki/2015/2/2a/Vanderbilt_2015_dna_strand_3.png"/>
| + | |
− | <img src="https://static.igem.org/mediawiki/2015/f/f4/Vanderbilt_2015_dna_strand_4.png"/>
| + | |
− | </div>
| + | |
− | </div>
| + | |
− | | + | |
− | </div>
| + | |
− | </div>
| + | |
| | | |
| </html> | | </html> |