(Prototype team page) |
|||
Line 1: | Line 1: | ||
− | {{TUDelft}} | + | {{:Team:TUDelft/Header}} |
+ | {{:Team:TUDelft/Banner}} | ||
+ | {{:Team:TUDelft/Head}} | ||
+ | |||
<html> | <html> | ||
+ | <style> | ||
+ | @import url('https://fonts.googleapis.com/css?family=Pacifico|Open+Sans:300,400,600'); | ||
− | + | a { | |
− | + | text-decoration: none; | |
− | + | color: inherit; | |
− | + | } | |
− | + | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | + | div .protocols { | |
− | + | width: 100%; | |
− | + | min-width: 300px; | |
+ | max-width: 800px; | ||
+ | margin: 1.5em auto; | ||
+ | color: #333; | ||
+ | box-sizing: border-box; | ||
+ | } | ||
+ | ul { | ||
+ | list-style: none; | ||
+ | padding: 0; | ||
+ | } | ||
+ | ul .inner { | ||
+ | padding-left: 50px; | ||
+ | padding-top: 10px; | ||
+ | overflow: hidden; | ||
+ | display: none; | ||
+ | } | ||
+ | ul li { | ||
+ | margin: .5em 0; | ||
+ | font-weight: 300; | ||
+ | } | ||
− | + | ul li a.toggle { | |
− | + | ||
− | + | display: block; | |
− | + | background: rgba(0, 166, 214, 1); | |
+ | color: #fefefe; | ||
+ | padding: .75em; | ||
+ | padding-left: 50px; | ||
+ | border-radius: 0.5em; | ||
+ | transition: background .3s ease; | ||
+ | text-decoration: none; | ||
+ | } | ||
− | + | ul li a.toggle:hover { | |
− | + | background: rgba(0, 166, 214, 0.65); | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | } | |
− | + | ||
− | + | </style> | |
− | + | <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> | |
− | + | ||
− | < | + | |
− | < | + | <body> |
+ | <br> | ||
+ | <div class="Banner container-fluid text-center mb-0 align-items-center "> | ||
+ | |||
+ | <div class="display-2 mb-0"> | ||
+ | <br> | ||
+ | <br> | ||
+ | <img src = "https://static.igem.org/mediawiki/2019/0/03/T--TUDelft--Modeling_logo.png" alt="Protocol Experiments" style="width:60%"; > | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class= "protocol centerjustify"> | ||
+ | |||
+ | </p> | ||
+ | |||
+ | <h2>Controllable expression</h2> | ||
<ul> | <ul> | ||
− | <li><a href=" | + | <li> |
− | + | <a class="toggle" href="javascript:void(0);" ><b>Promoters</b></a> | |
− | < | + | <div class="inner"> |
− | < | + | <p> |
− | </ | + | |
+ | </p> | ||
</div> | </div> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a class="toggle" href="javascript:void(0);" ><b>Ribosome Binding Site</b></a> | ||
+ | <div class="inner"> | ||
+ | <p> | ||
− | < | + | </p> |
+ | </div> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a class="toggle" href="javascript:void(0);" ><b>Coding Sequence</b></a> | ||
+ | <div class="inner"> | ||
+ | <p> | ||
+ | </p> | ||
+ | </div> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a class="toggle" href="javascript:void(0);" ><b>Terminators?</b></a> | ||
+ | <div class="inner"> | ||
+ | <h2>Orthogonal Transcription</h2> | ||
+ | <ul> | ||
+ | <li> | ||
+ | <a class="toggle" href="javascript:void(0);" ><b>Promoters</b></a> | ||
+ | <div class="inner"> | ||
+ | <p> | ||
− | <div | + | </p> |
+ | </div> | ||
+ | </li> | ||
− | < | + | <li> |
− | < | + | <a class="toggle" href="javascript:void(0);" ><b>Ribosome Binding Site</b></a> |
− | < | + | <div class="inner"> |
− | + | <p> | |
− | + | ||
− | < | + | </p> |
− | < | + | </div> |
− | + | </li> | |
− | + | ||
− | + | ||
− | + | ||
− | < | + | <li> |
− | + | <a class="toggle" href="javascript:void(0);" ><b>Coding Sequence</b></a> | |
+ | <div class="inner"> | ||
+ | <p> | ||
+ | </p> | ||
</div> | </div> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a class="toggle" href="javascript:void(0);" ><b>Terminators?</b></a> | ||
+ | <div class="inner"> | ||
− | + | </div> | |
− | + | </li> | |
− | + | </ul> | |
− | |||
− | |||
− | |||
− | < | + | <script> $('.toggle').click(function(e) { |
− | + | e.preventDefault(); | |
− | + | ||
− | + | ||
+ | var $this = $(this); | ||
+ | if ($this.next().hasClass('show')) { | ||
+ | $this.next().removeClass('show'); | ||
+ | $this.next().slideUp(350); | ||
+ | } else { | ||
+ | $this.parent().parent().find('li .inner').removeClass('show'); | ||
+ | $this.parent().parent().find('li .inner').slideUp(350); | ||
+ | $this.next().toggleClass('show'); | ||
+ | $this.next().slideToggle(350); | ||
+ | } | ||
+ | }); | ||
+ | </script> | ||
+ | </div> | ||
+ | </body> | ||
</html> | </html> | ||
+ | |||
+ | |||
+ | {{:Team:TUDelft/Footer}} |
Revision as of 08:00, 9 September 2019
![Protocol Experiments](https://static.igem.org/mediawiki/2019/0/03/T--TUDelft--Modeling_logo.png)
Controllable expression
-
Promoters
-
Ribosome Binding Site
-
Coding Sequence
-
Terminators?
Orthogonal Transcription