|
|
| (3 intermediate revisions by 2 users not shown) |
| Line 1: |
Line 1: |
| | {{Template:Vanderbilt_Header}} | | {{Template:Vanderbilt_Header}} |
| | + | {{Template:Vanderbilt_Navbar}} |
| | + | {{Template:Vanderbilt_Style}} |
| | + | |
| | <html> | | <html> |
| − | <style>
| |
| − | .btn {
| |
| − | -webkit-border-radius: 0 !important;
| |
| − | -moz-border-radius: 0 !important;
| |
| − | border-radius: 0 !important;
| |
| − | background-color: #3e0812;
| |
| − | color: #9e515e;
| |
| − | }
| |
| − | a:link {
| |
| − | text-decoration: none;
| |
| − | color: #9e515e;
| |
| − | }
| |
| − | a:visited {
| |
| − | text-decoration: none;
| |
| − | color: #9e515e;
| |
| − | }
| |
| − |
| |
| − | .chosen {
| |
| − | background-color: #220006;
| |
| − | color: #3e0812;
| |
| − | }
| |
| − |
| |
| − |
| |
| − | </style>
| |
| | | | |
| | <div id="breadcrumb_container" class="container" style="position:fixed; top:88px; z-index:2;"> | | <div id="breadcrumb_container" class="container" style="position:fixed; top:88px; z-index:2;"> |
| Line 32: |
Line 11: |
| | <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/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/User_Guide" class="btn btn-default chosen">User Guide</a> |
| − | <a href="https://2015.igem.org/Team:Vanderbilt/Software/Statistics" class="btn btn-default">Statistics</a> | + | <a href="https://2015.igem.org/Team:Vanderbilt/Software/Stats" class="btn btn-default">Statistics</a> |
| | </div> | | </div> |
| | </div> | | </div> |
| | </div> | | </div> |
| − |
| |
| − | </html>
| |
| − | {{Template:Vanderbilt_Navbar}}
| |
| − | <html>
| |
| | | | |
| | <script> | | <script> |
| Line 45: |
Line 20: |
| | </script> | | </script> |
| | | | |
| − | | + | <div class="row"> |
| − | <style>
| + | <div class="col-md-10 col-md-offset-1" style="background-color: #44111a; height: 100%;"> |
| − | | + | <h2>User Guide</h2> |
| − | html, body {
| + | <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> |
| − | height: 100%;
| + | |
| − | background-color: #3e0812;
| + | |
| − | }
| + | |
| − | | + | |
| − | body {
| + | |
| − | position: relative;
| + | |
| − | 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%" id="dnaStrand1">
| + | |
| − | <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%;">
| |
| − | <p>Put content here</p>
| |
| − |
| |
| − | <!-- footer -->
| |
| − | <div class="row" style="margin:0; border: 0; width: 100%;">
| |
| − | <div class="col-lg-2" style="height:100%">
| |
| − | <h3><font color="#7e1d2e">Team</font></h3>
| |
| − | <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> | + | </html> |
| − | | + | {{Template:Vanderbilt_Footer}} |
| − | <div class="col-lg-1 hidden-sm" style="height:100%;" id="dnaStrand2">
| + | <html> |
| − | <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> | + | |
| | | | |
| | </html> | | </html> |
