User:Vinoo/2014Design6
From 2014.igem.org
(Difference between revisions)
m |
m |
||
Line 1: | Line 1: | ||
+ | {{CSS/Grid16}} | ||
<html> | <html> | ||
<head> | <head> | ||
<style type="text/css"> | <style type="text/css"> | ||
+ | |||
+ | #contentSub, .firstHeading, #footer-box, #catlinks, #search-controls, #p-logo, .printfooter, .visualClear {display: none;} /*-- hides default wiki settings --*/ | ||
+ | |||
+ | #menubar a:link, #menubar a:active, #menubar a:visited, #menubar a:hover, #menubar:hover {color: #ccc; background-color: transparent;} /*-- styling for default menu bar links (edit, page, history, etc.) --*/ | ||
+ | |||
+ | |||
+ | #top-section { /*-- styling for default menu bar (edit, page, history, etc.) --*/ | ||
+ | background-color: #f0f0f0; | ||
+ | border: 0 none; | ||
+ | display: block; | ||
+ | height: 14px; | ||
+ | position: fixed; | ||
+ | top: 0; | ||
+ | width: 100%; | ||
+ | z-index: 10; | ||
+ | } | ||
+ | |||
+ | body { background-color: #fff;} | ||
+ | |||
+ | #globalWrapper, #content { /*-- changes default wiki settings --*/ | ||
+ | width: 100%; | ||
+ | height: 100%; | ||
+ | border: 0px; | ||
+ | background-color: transparent; | ||
+ | margin: 0px; | ||
+ | padding: 0px; | ||
+ | } | ||
+ | |||
+ | html, body, .wrapper { /*-- changes default wiki settings --*/ | ||
+ | width: 100%; | ||
+ | height: 100%; | ||
+ | background-color: transparent; | ||
+ | } | ||
+ | |||
+ | #contentcontainer { /*-- creates container for all content on page --*/ | ||
+ | font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; | ||
+ | font-weight: 200; | ||
+ | font-size: 16px; | ||
+ | color: #000; | ||
+ | width: 960px; | ||
+ | margin-left: auto; | ||
+ | margin-right: auto; | ||
+ | background-color: #transparent; | ||
+ | margin-top: 70px; | ||
+ | padding-bottom: 100px; | ||
+ | } | ||
+ | |||
#loginBar { | #loginBar { | ||
width: 100%; | width: 100%; | ||
height: 18px; | height: 18px; | ||
- | background-color: # | + | background-color: #383838; |
color: #f0f0f0; | color: #f0f0f0; | ||
- | border-bottom: 2px solid # | + | border-bottom: 2px solid #000; |
+ | position: fixed; | ||
} | } | ||
- | # | + | #loginBarContainer { |
+ | width: 960px; | ||
+ | height: 100%; | ||
+ | margin: 0px auto; | ||
+ | position: relative; | ||
+ | } | ||
+ | #leftLinks, #rightLinks { | ||
display: inline-block; | display: inline-block; | ||
margin: 0px; | margin: 0px; | ||
} | } | ||
- | # | + | #rightLinks { |
float: right; | float: right; | ||
} | } | ||
- | # | + | #leftLinks li { |
display: table-cell; | display: table-cell; | ||
padding: 0px 30px; | padding: 0px 30px; | ||
+ | } | ||
+ | #rightLinks li { | ||
+ | display: table-cell; | ||
+ | padding: 0px 10px; | ||
+ | } | ||
+ | #notify { | ||
+ | background-color: #bbb; | ||
+ | border-radius: 8px; | ||
+ | display: block; | ||
+ | } | ||
+ | #notifyNumber { | ||
+ | color: #fff; | ||
+ | display: block; | ||
+ | height: 15px; | ||
+ | width: 15px; | ||
+ | font-size: 11px; | ||
+ | padding: 0px 5px; | ||
+ | text-align: center; | ||
} | } | ||
.dropMenu { | .dropMenu { | ||
Line 27: | Line 100: | ||
height: 100px; | height: 100px; | ||
background-color: #333; | background-color: #333; | ||
- | } | + | } |
+ | |||
</style> | </style> | ||
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> | <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> | ||
Line 33: | Line 107: | ||
<header> | <header> | ||
<nav id="loginBar"> | <nav id="loginBar"> | ||
- | <ul id=" | + | <div id="loginBarContainer"> |
+ | <ul id="leftLinks"> | ||
<li class="dropToggle">iGEM | <li class="dropToggle">iGEM | ||
- | <div class="dropMenu"></div> | + | <div class="dropMenu"> |
+ | </div> | ||
+ | </li> | ||
+ | <li class="dropToggle">wiki tools | ||
+ | <div class="dropMenu">hello</div> | ||
</li> | </li> | ||
- | |||
<li>search</li> | <li>search</li> | ||
<li>team info</li> | <li>team info</li> | ||
</ul> | </ul> | ||
- | <ul id=" | + | <ul id="rightLinks"> |
<li>login</li> | <li>login</li> | ||
- | <li> | + | <li> |
- | <li> | + | <div id="notify"> |
+ | <div id="notifyNumber">0</div> | ||
+ | </div> | ||
+ | </li> | ||
+ | <li> | ||
+ | <img style="display: block; height:14px;" src="http://parts.igem.org/images/website/folder_gray_20.png" /> | ||
+ | </li> | ||
</ul> | </ul> | ||
+ | </div> | ||
</nav> | </nav> | ||
</header> | </header> | ||
Line 51: | Line 136: | ||
<script> | <script> | ||
$(document).ready(function() { | $(document).ready(function() { | ||
- | |||
- | |||
- | |||
}); | }); | ||
</script> | </script> | ||
</body> | </body> | ||
</html> | </html> |
Revision as of 21:40, 27 January 2014