Line 8: | Line 8: | ||
</html> | </html> | ||
− | + | <html> | |
<style> | <style> | ||
− | + | h1{ | |
+ | text-align: center; | ||
+ | color:#4DC39C | ||
+ | } | ||
+ | h2{color:#B2DF83} | ||
+ | h3{color:#EFEFEF} | ||
+ | h4 {color:#E7E87E} | ||
+ | p{color:#EFEFEF} | ||
.parts{ | .parts{ | ||
background-color:#383838; | background-color:#383838; | ||
Line 75: | Line 82: | ||
} | } | ||
</style> | </style> | ||
− | + | {{Waterloo/head}} | |
− | + | ||
<nav class="navbar navbar-toggleable-md navbar-inverse bg-primary fixed-top"><a class="navbar-brand" href="https://2017.igem.org/Team:Waterloo">Waterloo</a><button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation"> | <nav class="navbar navbar-toggleable-md navbar-inverse bg-primary fixed-top"><a class="navbar-brand" href="https://2017.igem.org/Team:Waterloo">Waterloo</a><button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation"> | ||
<span class="navbar-toggler-icon"></span> | <span class="navbar-toggler-icon"></span> | ||
Line 143: | Line 150: | ||
</div></nav> | </div></nav> | ||
<div class="content"> | <div class="content"> | ||
− | <div class=" | + | |
− | < | + | <div class="parts"> |
− | < | + | |
− | < | + | <h1> Parts Page</h1> |
− | < | + | <hr> |
− | < | + | <div class="plasmid-group"> |
− | < | + | <h2>Vectors</h2> |
− | < | + | <br> |
− | < | + | <br> |
− | + | <button v-on:click="show=1" class="plasmid plasmid1" > | |
− | + | PSB1C3 | |
− | + | </button> | |
− | + | <button v-on:click="show=2" class="plasmid plasmid2"> | |
− | + | PXP218 | |
− | + | </button> | |
− | < | + | <button v-on:click="show=3"class="plasmid plasmid3" href="216"> |
− | < | + | PXP216 |
− | + | </button> | |
− | < | + | </div> |
− | < | + | <p>^^show$$</p> |
− | < | + | |
− | + | <div id="inserts"> | |
− | + | ||
− | < | + | <div class="parts-group-wrapper"> |
− | < | + | <div class="btn-group btn-group-lg" role="group" aria-label="PSB1C3 Parts"> |
− | < | + | <button class="btn btn-secondary">Parts</button> |
− | + | <span class="btn-group btn-group-lg" v-for="item in psb1c3.items"> | |
− | + | <button class="btn btn-primary" v-on:click="psb1c3.showing=item.id"> ^^item.title$$ </button> | |
− | + | </span> | |
− | + | </div> | |
+ | </div> | ||
+ | |||
+ | <div class="row" v-for="item in psb1c3.items" v-if="psb1c3.showing==item.id"> | ||
+ | <div class="col-md-2"></div> | ||
+ | |||
+ | <div class="col-md-3"> | ||
+ | <div class="part-img"> | ||
+ | <img v-bind:src="item.image" alt=""> | ||
+ | |||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <div class="col-md-5"> | ||
+ | <br> | ||
+ | <br> | ||
+ | <p>^^item.text$$</p> | ||
+ | <button v-if="item.biobrick" class="btn btn-primary btn-block">^^item.biobrick$$</button> | ||
+ | </div> | ||
+ | |||
+ | </div> | ||
</div> | </div> | ||
− | </ | + | |
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | </div> | ||
+ | |||
{{Waterloo/footer}} | {{Waterloo/footer}} | ||
+ | |||
<script> | <script> | ||
var partsPage = new Vue({ | var partsPage = new Vue({ | ||
Line 229: | Line 264: | ||
</script> | </script> | ||
+ | </html> |
Revision as of 18:50, 29 October 2017
{{Waterloo/head}}
Parts Page
Vectors
^^show$$
^^item.text$$