|
|
| Line 6: |
Line 6: |
| | <!--CSS--> | | <!--CSS--> |
| | <link href="https://2013.igem.org/Team:Dundee/bootstrap?action=raw&ctype=text/css" rel="stylesheet"> | | <link href="https://2013.igem.org/Team:Dundee/bootstrap?action=raw&ctype=text/css" rel="stylesheet"> |
| - | <!====test===>
| + | |
| - | <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
| + | |
| - | <link href='http://fonts.googleapis.com/css?family=Open+Sans:400;300' rel='stylesheet' type='text/css'>
| + | |
| - | | + | |
| | <style> | | <style> |
| | #slider { | | #slider { |
| Line 40: |
Line 37: |
| | width: 285px; | | width: 285px; |
| | } | | } |
| - | <!=====test====>
| |
| - | /* Basic styling */
| |
| | | | |
| - | .jumbotron {
| |
| - | background-image: url('http://s3.amazonaws.com/codecademy-content/courses/ltp2/img/uber/bg.png');
| |
| - | height: 100%;
| |
| - | -webkit-background-size: cover;
| |
| - | -moz-background-size: cover;
| |
| - | -o-background-size: cover;
| |
| - | background-size: cover;
| |
| - | }
| |
| - |
| |
| - | .menu ul {
| |
| - | border-top: 1px solid #636366;
| |
| - | list-style: none;
| |
| - | margin: 0;
| |
| - | padding: 0;
| |
| - | }
| |
| - |
| |
| - | .menu li {
| |
| - | border-bottom: 1px solid #636366;
| |
| - | font-family: 'Open Sans', sans-serif;
| |
| - | line-height: 45px;
| |
| - | padding-bottom: 3px;
| |
| - | padding-left: 20px;
| |
| - | padding-top: 3px;
| |
| - | }
| |
| - |
| |
| - | .menu a {
| |
| - | color: #fff;
| |
| - | font-size: 15px;
| |
| - | text-decoration: none;
| |
| - | text-transform: uppercase;
| |
| - | }
| |
| - |
| |
| - | .icon-close {
| |
| - | cursor: pointer;
| |
| - | padding-left: 10px;
| |
| - | padding-top: 10px;
| |
| - | }
| |
| - |
| |
| - | .icon-menu {
| |
| - | color: #fff;
| |
| - | cursor: pointer;
| |
| - | font-family: 'Open Sans', sans-serif;
| |
| - | font-size: 16px;
| |
| - | padding-bottom: 25px;
| |
| - | padding-left: 25px;
| |
| - | padding-top: 25px;
| |
| - | text-decoration: none;
| |
| - | text-transform: uppercase;
| |
| - | }
| |
| - |
| |
| - | .icon-menu i {
| |
| - | margin-right: 5px;
| |
| - | }
| |
| | </style> | | </style> |
| | </head> | | </head> |
| Line 110: |
Line 52: |
| | <div class="igemlogo"> <a href="https://2014.igem.org/Main_Page" target="_blank"><img src="https://static.igem.org/mediawiki/2014/9/9e/IGEMLogo_bu14.gif" width="147" height="120"></a></div> | | <div class="igemlogo"> <a href="https://2014.igem.org/Main_Page" target="_blank"><img src="https://static.igem.org/mediawiki/2014/9/9e/IGEMLogo_bu14.gif" width="147" height="120"></a></div> |
| | </div> | | </div> |
| - |
| |
| | | | |
| | | | |
| Line 194: |
Line 135: |
| | <div class="span8" style="background-color:grey">span 8</div> | | <div class="span8" style="background-color:grey">span 8</div> |
| | </div> | | </div> |
| - |
| |
| - | <!======testing=====>
| |
| - | <!--slidebar menu-->
| |
| - | <div class="menu">
| |
| - |
| |
| - | <!-- Menu icon -->
| |
| - | <div class="icon-close">
| |
| - | <img src="http://s3.amazonaws.com/codecademy-content/courses/ltp2/img/uber/close.png">
| |
| - | </div>
| |
| - |
| |
| - | <!-- Menu -->
| |
| - | <ul>
| |
| - | <li><a href="#">About</a></li>
| |
| - | <li><a href="#">Blog</a></li>
| |
| - | <li><a href="#">Help</a></li>
| |
| - | <li><a href="#">Contact</a></li>
| |
| - | </ul>
| |
| - | </div>
| |
| - |
| |
| - | <!-- Main body -->
| |
| - | <div class="jumbotron">
| |
| - |
| |
| - | <div class="icon-menu">
| |
| - | <i class="fa fa-bars"></i>
| |
| - | Menu
| |
| - | </div>
| |
| - |
| |
| - | <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
| |
| - | <======test end=====>
| |
| | | | |
| | | | |
| Line 229: |
Line 141: |
| | <script src="http://www.kyleharrison.co.uk/igem/js/bootstrap.min.js"></script> | | <script src="http://www.kyleharrison.co.uk/igem/js/bootstrap.min.js"></script> |
| | | | |
| - | <!--testing slidebar menu js-->
| |
| - | <script>
| |
| - | var main = function() {
| |
| - | $('.icon-menu').click(function() {
| |
| - | $('.menu').animate({
| |
| - | left:'0px'
| |
| - | }, 200);
| |
| - |
| |
| - | $('body').animate({
| |
| - | left: '285px'
| |
| - | }, 200);
| |
| - | });
| |
| | | | |
| - | $('.icon-close').click(function() {
| |
| - | $('.menu').animate({
| |
| - | left: '-285px'
| |
| - | }, 200);
| |
| - | $('body').animate({
| |
| - | left: '0px'
| |
| - | }, 200);
| |
| - | });
| |
| - | };
| |
| - | $(document).ready(main);
| |
| - | </script>
| |
| | | | |
| | </body> | | </body> |
| | </html> | | </html> |
"
