|
|
(31 intermediate revisions not shown) |
Line 1: |
Line 1: |
- | <html xmlns="http://www.w3.org/1999/xhtml">
| + | {{Template:Queens_Canada/qgemheader}} |
- | <head>
| + | |
- | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
| + | |
- | <title>Untitled Document</title>
| + | |
- | <link rel="stylesheet" href="https://dl.dropboxusercontent.com/u/125588631/bootstrap.min.css" media="screen" />
| + | |
- | <script src="http://code.jquery.com/jquery.js"></script>
| + | |
- | <script src="https://dl.dropboxusercontent.com/u/125588631/bootstrap.min.js"></script>
| + | |
- | <style>
| + | |
- | *{
| + | |
- | margin:0;
| + | |
- | padding:0;
| + | |
- | }
| + | |
- | html{
| + | |
- | padding:0;
| + | |
- | margin:0;
| + | |
- | }
| + | |
- | header,footer,section,article,aside,nav,hgroup,details,menu,figure,figcaption{
| + | |
- | display: block;
| + | |
- | }
| + | |
- | /* ----------------Display:none---------------- */ | + | |
- | #p-logo {
| + | |
- | display: none;
| + | |
- | } | + | |
- | | + | |
- | #search-controls {
| + | |
- | display: none;
| + | |
- | } | + | |
- | | + | |
- | .firstHeading {
| + | |
- | display: none;
| + | |
- | }
| + | |
- | | + | |
- | #catlinks {
| + | |
- | display: none;
| + | |
- | }
| + | |
- | | + | |
- | #footer-box {
| + | |
- | display: none;
| + | |
- | }
| + | |
- | | + | |
- | #contentSub {
| + | |
- | display: none;
| + | |
- | }
| + | |
- | | + | |
- | #globalWrapper{
| + | |
- | margin:0;
| + | |
- | padding:0;
| + | |
- | background-color:#999999
| + | |
- | }
| + | |
- | | + | |
- | #content{
| + | |
- | margin:0;
| + | |
- | padding:0;
| + | |
- | width:100%;
| + | |
- | }
| + | |
- | | + | |
- | #bodyContent{
| + | |
- | margin:0;
| + | |
- | padding:0;
| + | |
- | width:100%;
| + | |
- | }
| + | |
- | | + | |
- | /**---------TOP-SECTION----**/
| + | |
- | #top-section {
| + | |
- | height: 30px;
| + | |
- | width: 100%;
| + | |
- | background-color:#343838; /*per Page*/
| + | |
- | margin:0;
| + | |
- | padding:0;
| + | |
- | }
| + | |
- | | + | |
- | #menubar {
| + | |
- | top: 2px;
| + | |
- | font-family: 'Droid Sans', sans-serif;
| + | |
- | }
| + | |
- | /* ----------------TopSection_left-menu---------------- */
| + | |
- | .left-menu,.left-menu a {
| + | |
- | color: white;
| + | |
- | left: 0px;
| + | |
- | text-transform: capitalize;
| + | |
- | }
| + | |
- | | + | |
- | .left-menu:hover {
| + | |
- | background-color: transparent;
| + | |
- | }
| + | |
- | | + | |
- | .left-menu:hover a {
| + | |
- | color: white;
| + | |
- | text-decoration: none !important;
| + | |
- | }
| + | |
- | | + | |
- | .left-menu li a:hover {
| + | |
- | color: #ff6669;
| + | |
- | }
| + | |
- | | + | |
- | /* ----------------TopSection_right-menu---------------- */
| + | |
- | .right-menu li {
| + | |
- | background-color: transparent;
| + | |
- | }
| + | |
- | | + | |
- | .right-menu,.right-menu a {
| + | |
- | color: white;
| + | |
- | right: 0;
| + | |
- | text-align: right;
| + | |
- | }
| + | |
- | | + | |
- | .right-menu:hover {
| + | |
- | background-color: transparent;
| + | |
- | }
| + | |
- | | + | |
- | .right-menu:hover a {
| + | |
- | color: white;
| + | |
- | }
| + | |
- | | + | |
- | .right-menu li a {
| + | |
- | background-color: transparent;
| + | |
- | color: white;
| + | |
- | }
| + | |
- | | + | |
- | .right-menu li a:hover {
| + | |
- | text-decoration:none;
| + | |
- | color: #ff6669;
| + | |
- | }
| + | |
- | | + | |
- | /**---------PAGE------------**/
| + | |
- | #fullpage{
| + | |
- | color:white;
| + | |
- | margin:0;
| + | |
- | padding:0;
| + | |
- | width:100%;
| + | |
- | height:100%;
| + | |
- | position:fixed;
| + | |
- | }
| + | |
- | body{
| + | |
- | background:white;
| + | |
- | background-size:cover;
| + | |
- | z-index:-999;
| + | |
- | }
| + | |
- | /**---------HEADER----------**/
| + | |
- | .top-photo{
| + | |
- | background:url(https://dl.dropboxusercontent.com/u/125588631/header_template.png) no-repeat center center;
| + | |
- | position:relative;
| + | |
- | overflow:hidden;
| + | |
- | width:auto;
| + | |
- | padding-top:40px;
| + | |
- | }
| + | |
- | | + | |
- | .header-text{
| + | |
- | font-family:bebasN;
| + | |
- | font-size:3em;
| + | |
- | color:#ffb297;
| + | |
- | position:relative;
| + | |
- | margin:5px;
| + | |
- | }
| + | |
- | | + | |
- | .year{
| + | |
- | font-family:Arial, Helvetica, sans-serif;
| + | |
- | color:#320a00;
| + | |
- | font-size:9em;
| + | |
- | position:relative;
| + | |
- | margin:5px;
| + | |
- | margin-bottom:60px;
| + | |
- | }
| + | |
- | | + | |
- | #menu{
| + | |
- | margin-top:10%;
| + | |
- | margin-left:5%;
| + | |
- | }
| + | |
- | | + | |
- | #menu li{
| + | |
- | margin: 0 5px;
| + | |
- | padding: 0 9px;
| + | |
- | display:inline-block;
| + | |
- | color:white;
| + | |
- | font-size:1.5em;
| + | |
- | }
| + | |
- | | + | |
- | #menu li a:link{
| + | |
- | color:white;
| + | |
- | text-decoration:none;
| + | |
- | }
| + | |
- | | + | |
- | #menu li a:hover{
| + | |
- | border-bottom:5px solid #ffb297;
| + | |
- | }
| + | |
- | | + | |
- | #menu li a:visited{
| + | |
- | color:white;
| + | |
- | text-decoration:none;
| + | |
- | }
| + | |
- | /**--------General Style Elements------------**/
| + | |
- | .center-align{
| + | |
- | text-align:center;
| + | |
- | }
| + | |
- | .container{
| + | |
- | margin:0px;
| + | |
- | padding:0px;
| + | |
- | width:100%;
| + | |
- | z-index:0;
| + | |
- | position:relative;
| + | |
- | }
| + | |
- | /**---------Fonts---------**/
| + | |
- | @font-face{
| + | |
- | font-family:bebasN;
| + | |
- | src:url(https://dl.dropboxusercontent.com/u/125588631/BebasNeue.otf);
| + | |
- | }
| + | |
- | .menu-font{
| + | |
- | font-family:bebasN;
| + | |
- | font-size:2em;
| + | |
- | }
| + | |
- | | + | |
- | .regular{
| + | |
- | font-family:bebasN;
| + | |
- | color:black;
| + | |
- | font-size:15px;
| + | |
- | }
| + | |
- | | + | |
- | <!------- Toolbar ---------->
| + | |
- | .toolbar{
| + | |
- | height:50px;
| + | |
- | opacity:0.9;
| + | |
- | margin-top:500px;
| + | |
- | position:fixed;
| + | |
- | }
| + | |
- | | + | |
- | .toolbar-links ul{
| + | |
- | font-family:bebasN;
| + | |
- | font-size:1.2em;
| + | |
- | padding:15px;
| + | |
- | }
| + | |
- | | + | |
- | .toolbar-links ul li{
| + | |
- | display: inline-block;
| + | |
- | margin:0 4px;
| + | |
- | padding: 0 5px;
| + | |
- | }
| + | |
- | | + | |
- | .toolbar-links li a:link{
| + | |
- | text-decoration:none;
| + | |
- | color:white;
| + | |
- | }
| + | |
- | | + | |
- | .toolbar-links li a:visited{
| + | |
- | color:white;
| + | |
- | }
| + | |
- | | + | |
- | .toolbar-links li a:hover{
| + | |
- | color:#e88587;
| + | |
- | text-decoration:none;
| + | |
- | }
| + | |
- | </style>
| + | |
- | </head>
| + | |
- | | + | |
- | <body>
| + | |
- | <div class="row-fluid toolbar" style="background-color:#83282a;bottom:0;">
| + | |
- | <div class="span2 offset1">
| + | |
- | <img src="../toolbar-logo.png" style="height:50px;">
| + | |
- | </div>
| + | |
- | <div class="span6 toolbar-links">
| + | |
- | <ul>
| + | |
- | <li><a href="#">HOME</a></li>
| + | |
- | <li><a href="#">TEAM</a></li>
| + | |
- | <li><a href="#">PROJECT</a></li>
| + | |
- | <li><a href="#">OUTREACH</a></li>
| + | |
- | <li><a href="#">PARTS</a></li>
| + | |
- | <li><a href="#">SAFETY</a></li>
| + | |
- | <li><a href="#">JUDGING</a></li>
| + | |
- | <li><a href="#">NOTEBOOK</a></li>
| + | |
- | </ul>
| + | |
- | </div>
| + | |
- | </div>
| + | |
- | | + | |
- | <div class="top-photo">
| + | |
- | <div class="header-text row"><div class="span4 offset1">WE ARE TEAM</div></div>
| + | |
- | <div class="row"><div class="span8 offset1"><img src="https://dl.dropboxusercontent.com/u/125588631/qgem-logo.png" style="height:120px;margin-bottom:40px;margin-top:10px;" /></div></div>
| + | |
- | <div class="year row"><div class="span4 offset1">2013</div></div>
| + | |
- | <div class="header-text row"><div class="span4 offset1">iGEM | QUEEN'S</div></div>
| + | |
- | <div>
| + | |
- | <div id="menu">
| + | |
- | <ul>
| + | |
- | <li><a href="#">HOME</a></li>
| + | |
- | <li><a href="#">TEAM</a></li>
| + | |
- | <li><a href="#">PROJECT</a></li>
| + | |
- | <li><a href="#">OUTREACH</a></li>
| + | |
- | <li><a href="#">PARTS</a></li>
| + | |
- | <li><a href="#">SAFETY</a></li>
| + | |
- | <li><a href="#">JUDGING</a></li>
| + | |
- | <li><a href="#">NOTEBOOK</a></li>
| + | |
- | </ul>
| + | |
- | </div>
| + | |
- | </div>
| + | |
- | </div>
| + | |
- | | + | |
- | <script type="text/javascript">
| + | |
- | | + | |
- | $(document).ready(function(){
| + | |
- | var height = $(window).height()-40;
| + | |
- | var val = (height.toString())+"px";
| + | |
- | $(".top-photo").css("height",val);
| + | |
- | var toolbarHeight=(height.toString()-50)+"px";
| + | |
- | $(".toolbar").hide();
| + | |
- |
| + | |
- | $(window).resize(function(){
| + | |
- | var height = $(window).height();
| + | |
- | var val = (height.toString())+"px";
| + | |
- | $(".top-photo").css("height",val);
| + | |
- | });
| + | |
- | | + | |
- | $('.top-photo').waypoint(function(direction) {
| + | |
- | if (direction=="down"){
| + | |
- | $('.toolbar').fadeIn('fast');
| + | |
- | }
| + | |
- | else{
| + | |
- | $('.toolbar').fadeOut('fast');
| + | |
- | }
| + | |
- | }, {
| + | |
- | offset: function() {
| + | |
- | return -$(this).height();
| + | |
- | }
| + | |
- | });
| + | |
- | });
| + | |
- | </script>
| + | |
- | | + | |
- | </body>
| + | |
- | </html>
| + | |