Difference between revisions of "Template:ATOMS-Turkiye"
Line 1: | Line 1: | ||
− | |||
− | |||
− | |||
<html> | <html> | ||
+ | <head> | ||
+ | <style type="text/css"> | ||
+ | #top-section{ | ||
+ | height: 25px; | ||
+ | margin-bottom: 0; | ||
+ | border: none; | ||
+ | background: #737373; | ||
+ | width: 100%; | ||
+ | position: fixed; | ||
+ | top: 0; | ||
+ | z-index: 10; | ||
+ | } | ||
− | + | #header { | |
− | + | width: 975px; | |
+ | text-align: left; | ||
+ | margin-left: auto; | ||
+ | margin-right: auto; | ||
+ | margin-bottom: 0; | ||
+ | } | ||
− | + | #p-logo { | |
− | # | + | display: none; |
− | + | } | |
− | + | ||
− | + | #search-controls { | |
− | + | overflow:hidden; | |
− | + | display:none; | |
− | + | background: none; | |
+ | position: absolute; | ||
+ | top: 170px; | ||
+ | right: 40px; | ||
+ | } | ||
− | + | #searchform { | |
− | + | display: none; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | .left-menu, .right-menu{ | |
− | + | position: absolute; | |
− | + | background: none; | |
− | + | color: black; | |
− | + | margin-top: 4px; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | .left-menu a, .left-menu li { | |
− | + | color: #000000; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | .left-menu ul:hover a { | |
− | + | color: #000000; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | .left-menu ul li, .right-menu ul li a { | |
+ | background: none; | ||
+ | color: #000000; | ||
+ | } | ||
− | + | .left-menu li a:hover, .right-menu li a:hover, .left-menu li:hover, .right-menu li:hover { | |
− | + | color: #000000; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | #top-section div#menubar.left-menu ul li:nth-child(7) { | |
− | + | display: none; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | .left-menu ul:hover, .right-menu ul:hover { | |
− | + | background: #737373; | |
− | + | color: #000000; | |
− | + | } | |
− | + | #content{ | |
− | + | margin-top: -13px; | |
− | + | padding: 0; | |
− | + | border: 0; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | .firstHeading { | |
− | + | visibility:hidden; | |
− | + | display:none; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | #catlinks{ | |
− | + | display:none; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
+ | #menubar ul:hover { | ||
+ | color: transparent; | ||
+ | } | ||
+ | /*important for background colours*/ | ||
+ | .mediawiki{ | ||
+ | background: #ffffff; | ||
+ | } | ||
+ | #footer-box { | ||
+ | display: none; | ||
+ | } | ||
+ | /*End minimal header*/ | ||
− | + | /* reset browser styles */ | |
+ | html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, | ||
+ | address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, | ||
+ | tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, | ||
+ | thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, | ||
+ | nav, output, ruby, section, summary, time, mark, audio, video { | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | border: 0; | ||
+ | font-size: 16px; | ||
+ | vertical-align: baseline; | ||
+ | } | ||
− | + | article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { | |
− | + | display: block; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | body { | |
− | + | line-height: 1.2; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | table { | |
− | + | border-collapse: collapse; | |
− | + | border-spacing: 0; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ol { | |
− | + | padding-left: 1.4em; | |
− | + | list-style: decimal; | |
− | + | } | |
− | + | ||
− | + | ul { | |
− | + | padding-left: 1.4em; | |
− | + | list-style: square; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | blockquote, q { | |
− | + | quotes: none; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | blockquote:before, blockquote:after, q:before, q:after { | |
− | + | content: ''; | |
− | + | content: none; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | /* | + | * { |
+ | box-sizing: border-box; | ||
+ | -moz-box-sizing: border-box; | ||
+ | } | ||
+ | /* end reset browser styles */ | ||
− | + | </style> | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
+ | <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> | ||
− | + | <script src="http://cdn.jsdelivr.net/jquery.sticky/1.0.0/jquery.sticky.js"></script> | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
+ | <script> | ||
− | + | $(document).ready(function(){ | |
− | + | $("div#content").css("width","100%"); | |
+ | $("nav").sticky({topSpacing:0}); | ||
+ | $("#top-section").fadeTo("fast", 0.2); | ||
+ | $("#top-section").mouseenter(function(e){ | ||
+ | var x= e.pageX; | ||
+ | var y= e.pageY; | ||
+ | $("#top-section").fadeTo("fast", 1); | ||
+ | }); | ||
− | + | $("#top-section").mouseleave(function(){ | |
− | + | $("#top-section").fadeTo("fast", 0.2); | |
+ | }); | ||
+ | }); | ||
+ | </script> | ||
+ | <style> | ||
− | + | #undefined-sticky-wrapper { | |
− | + | margin: 0 auto; | |
− | + | width: 1000px !important; | |
+ | } | ||
− | |||
− | |||
− | + | div#top-section { | |
− | + | position: relative; | |
− | + | background: #155364; | |
+ | } | ||
− | + | div#menubar ul{ | |
+ | background: #155364; | ||
+ | color: #ffffff !important; | ||
+ | } | ||
+ | div#menubar li{ | ||
+ | background: #155364; | ||
+ | color: #ffffff !important; | ||
+ | } | ||
+ | div#menubar a{ | ||
+ | background: #155364; | ||
+ | color: #ffffff !important; | ||
+ | } | ||
− | + | nav.menuNav { | |
− | + | width: 1000px; | |
− | + | font-family: "Khmer UI", sans-serif; | |
− | + | position: relative; | |
− | + | padding: 0px 0px; | |
− | + | margin: auto; | |
− | + | /*position: fixed; | |
− | + | top: 0px; | |
+ | left: 15%; | ||
+ | right: 0px;*/ | ||
+ | background: rgb(164,0,0); | ||
+ | z-index: 99999; | ||
+ | text-align: left; | ||
+ | height: 40px; | ||
+ | border-top: groove #fff 0px; | ||
+ | } | ||
− | + | nav.menuNav ul li { | |
− | + | border-style: solid; | |
− | + | border-width: 2px; | |
− | + | -moz-border-image: url(https://static.igem.org/mediawiki/2014/3/33/ATOMS-Turkiye_separator_top.png) 7 8 8 repeat stretch; | |
− | + | -webkit-border-image: url(https://static.igem.org/mediawiki/2014/3/33/ATOMS-Turkiye_separator_top.png) 7 8 8 repeat stretch; | |
− | + | -o-border-image: url(https://static.igem.org/mediawiki/2014/3/33/ATOMS-Turkiye_separator_top.png) 7 8 8 repeat stretch; | |
− | + | border-image: url(https://static.igem.org/mediawiki/2014/3/33/ATOMS-Turkiye_separator_top.png) 7 8 8 fill repeat stretch; | |
− | + | border-right: 0; | |
+ | border-bottom: 0; | ||
+ | border-top: 0; | ||
+ | } | ||
− | + | nav.menuNav ul li:first-child { | |
− | + | border-left: 0; | |
− | + | } | |
− | + | nav.menuNav ul li:nth-child(2) { | |
+ | border-left: 0; | ||
+ | } | ||
− | + | nav.menuNav a:visited { | |
+ | color: #fff; | ||
+ | } | ||
− | + | nav.menuNav ul ul { | |
+ | display: none; | ||
+ | } | ||
− | + | nav.menuNav ul li:hover > ul { | |
+ | display: block; | ||
+ | } | ||
− | |||
− | + | nav.menuNav ul { | |
+ | background: rgb(164,0,0); | ||
+ | list-style: none; | ||
+ | position: relative; | ||
+ | display: inline-block; | ||
+ | margin-top: 0; | ||
+ | margin-bottom: 0; | ||
+ | } | ||
+ | nav.menuNav ul:after { | ||
+ | content: ""; clear: both; display: block; | ||
+ | } | ||
− | + | nav.menuNav ul li { | |
+ | float: left; | ||
+ | line-height : 40px; | ||
+ | width: 180px; | ||
+ | display: inline-block; | ||
+ | } | ||
+ | nav.menuNav ul li:hover { | ||
+ | background: rgb(162,40,40); | ||
+ | } | ||
+ | nav.menuNav ul li:hover a { | ||
+ | color: #fff; | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | |||
+ | nav.menuNav ul li a { | ||
+ | display: block; | ||
+ | text-align: center; | ||
+ | color: #fff; text-decoration: none; | ||
+ | font-size: 16px; | ||
+ | height: 40px; | ||
+ | line-height: 40px; | ||
+ | width: 180px; | ||
+ | font-weight: bold; | ||
+ | } | ||
− | |||
− | |||
− | |||
− | < | + | |
− | < | + | nav.menuNav ul ul { |
+ | background: rgba(196,101,96,0.9); | ||
+ | border-radius: 0px; | ||
+ | padding: 0; | ||
+ | width: 180px; | ||
+ | position: absolute; | ||
+ | line-height: 40px; | ||
+ | top: 100%; | ||
+ | |||
+ | } | ||
+ | nav.menuNav ul ul li { | ||
+ | float: none; | ||
+ | border-top: 1px solid rgba(255,255,255,0.3); | ||
+ | position: relative; | ||
+ | line-height : 40px !important; | ||
+ | height: 40px; | ||
+ | border-left: 0; | ||
+ | } | ||
+ | |||
+ | nav.menuNav ul ul li:hover { | ||
+ | background-color: rgba(227,123,119,0.9); | ||
+ | } | ||
+ | |||
+ | |||
+ | nav.menuNav ul ul li a { | ||
+ | font-size: 14px; | ||
+ | color: #fff; | ||
+ | height: 40px; | ||
+ | line-height: 40px; | ||
+ | } | ||
+ | /*nav.menuNav ul ul li a:hover { | ||
+ | background: rgba(227,123,119,0.9); | ||
+ | }*/ | ||
+ | |||
+ | |||
+ | nav.menuNav ul ul ul { | ||
+ | position: absolute; left: 100%; top:0; | ||
+ | } | ||
+ | |||
+ | li#heartedLi { | ||
+ | width: 50px; | ||
+ | } | ||
+ | |||
+ | li#heartedLi a{ | ||
+ | width: 50px; | ||
+ | } | ||
+ | |||
+ | |||
+ | #menuContent { | ||
+ | margin-left: auto; | ||
+ | margin-right: auto; | ||
+ | margin-bottom: -12px; | ||
+ | -webkit-box-shadow: 0px 0px 12px 2px rgba(0,0,0,0.75); | ||
+ | -moz-box-shadow: 0px 0px 12px 2px rgba(0,0,0,0.75); | ||
+ | box-shadow: 0px 0px 12px 2px rgba(30,123,148,0.75); | ||
+ | width: 1000px; | ||
+ | } | ||
+ | |||
+ | |||
+ | #logoBar { | ||
+ | width: 1000px; | ||
+ | position: relative; | ||
+ | margin-left: auto; | ||
+ | margin-right: auto; | ||
+ | background-color: #ffffff; | ||
+ | height: 180px; | ||
+ | text-align: center; | ||
+ | white-space: nowrap; | ||
+ | } | ||
+ | |||
+ | #changeOfHeart { | ||
+ | position: relative; | ||
+ | width: auto; | ||
+ | height: 150px; | ||
+ | z-index: 1; | ||
+ | margin-bottom: 4px; | ||
+ | margin-top: 4px; | ||
+ | margin-left: auto; | ||
+ | margin-right: auto; | ||
+ | |||
+ | } | ||
+ | |||
+ | |||
+ | #logoBack { | ||
+ | position: absolute; | ||
+ | left: 0; | ||
+ | top: 0; | ||
+ | width: 100%; | ||
+ | height: 181px; | ||
+ | z-index: 0; | ||
+ | } | ||
+ | |||
+ | #teamlogo { | ||
+ | position: absolute; | ||
+ | top: 30px; | ||
+ | left: 40px; | ||
+ | z-index: 3; | ||
+ | width: 100px; | ||
+ | } | ||
+ | #igemLogo { | ||
+ | position: absolute; | ||
+ | top: 40px; | ||
+ | right: 110px; | ||
+ | z-index: 2; | ||
+ | width: 100px; | ||
+ | } | ||
+ | |||
+ | #fbIcon { | ||
+ | position: absolute; | ||
+ | top: 65px; | ||
+ | right: 90px; | ||
+ | z-index: 3; | ||
+ | width: 26px; | ||
+ | } | ||
+ | |||
+ | #twtIcon { | ||
+ | position: absolute; | ||
+ | top: 65px; | ||
+ | right: 50px; | ||
+ | z-index: 4; | ||
+ | width: 26px; | ||
+ | } | ||
+ | |||
+ | #teamText { | ||
+ | position: absolute; | ||
+ | top: 100px; | ||
+ | left: 40px; | ||
+ | z-index: 5; | ||
+ | width: 10px; | ||
+ | font-size: 20px; | ||
+ | color: rgb(211,0,0); | ||
+ | text-shadow: 1px 1px 5px #000000; | ||
+ | } | ||
+ | |||
+ | </style> | ||
+ | </head> | ||
+ | |||
+ | <body> | ||
+ | |||
+ | |||
+ | <div id = "menuContent" style=""> | ||
+ | <div id = "logoBar"> | ||
+ | <img id="logoBack" src="https://static.igem.org/mediawiki/2014/f/f8/Atoms_turkiye_banner_.jpg" usemap="#logomap"/> | ||
+ | <map name="logomap"> | ||
+ | <area shape="rect" coords="716, 50, 800, 120" alt="iGEM" href="https://2014.igem.org/Main_Page"> | ||
+ | <area shape="rect" coords="911, 68, 951, 107" alt="Facebook" href="http://www.facebook.com/AtomsTurkiye"> | ||
+ | <area shape="rect" coords="954, 68, 994, 107" alt="Twitter" href="http://twitter.com/Atoms_Turkiye"> | ||
+ | </map> | ||
+ | |||
+ | </div> | ||
+ | |||
+ | <nav class = "menuNav"><center> | ||
+ | <ul> | ||
+ | <li id="heartedLi"><a href="https://2014.igem.org/Team:ATOMS-Turkiye"><img src="https://static.igem.org/mediawiki/2014/d/d7/Homelogob.png" height="36px" style="margin: auto;" /></a></li> | ||
+ | |||
+ | <li><a href="#center">Project</a> | ||
+ | <ul> | ||
+ | <li><a href="https://2014.igem.org/Team:ATOMS-Turkiye/At-a-Glance">At A Glance</a></li> | ||
+ | <li><a href="https://2014.igem.org/Team:ATOMS-Turkiye/Background-Problem">Background/Problem</a></li> | ||
+ | <li><a href="https://2014.igem.org/Team:ATOMS-Turkiye/Project-Approach">Approach</a></li> | ||
+ | <li><a href="https://2014.igem.org/Team:ATOMS-Turkiye/Design">Design</a></li> | ||
+ | <li><a href="https://2014.igem.org/Team:ATOMS-Turkiye/BioBricks">BioBricks</a></li> | ||
+ | <li><a href="https://2014.igem.org/Team:ATOMS-Turkiye/Modeling">Modeling</a></li> | ||
+ | <li><a href="https://2014.igem.org/Team:ATOMS-Turkiye/Results">Results</a></li> | ||
+ | <li><a href="https://2014.igem.org/Team:ATOMS-Turkiye/Data">Data</a></li> | ||
+ | <li><a href="https://2014.igem.org/Team:ATOMS-Turkiye/Future-Plan">Future Plan</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li><a href="#center">P&P</a> | ||
+ | <ul> | ||
+ | <li><a href="https://2014.igem.org/wiki/index.php?title=Team:ATOMS-Turkiye/Practices-Approach">Approach</a></li> | ||
+ | <li><a href="https://2014.igem.org/Team:ATOMS-Turkiye/M1-Identification">M1-Identification</a></li> | ||
+ | <li><a href="https://2014.igem.org/Team:ATOMS-Turkiye/M2-Clarification">M2-Clarification</a></li> | ||
+ | <li><a href="https://2014.igem.org/Team:ATOMS-Turkiye/M3-Specialization">M3-Specialization</a></li> | ||
+ | <li><a href="https://2014.igem.org/Team:ATOMS-Turkiye/M4-Application">M4-Application</a></li> | ||
+ | <li><a href="https://2014.igem.org/Team:ATOMS-Turkiye/Outreach">Outreach</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li><a href="#center">Safety</a> | ||
+ | <ul> | ||
+ | <li><a href="https://2014.igem.org/Team:ATOMS-Turkiye/Safety-Approach">Safety Approach</a></li> | ||
+ | <li><a href="https://2014.igem.org/Team:ATOMS-Turkiye/Form">Safety Form</a></li> | ||
+ | <li><a href="https://2014.igem.org/Team:ATOMS-Turkiye/Safety-Modeling">Safety Modeling</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li><a href="#center">Team</a> | ||
+ | <ul> | ||
+ | <li><a href="https://2014.igem.org/Team:ATOMS-Turkiye/Who-We-Are">Who We Are</a></li> | ||
+ | <li><a href="https://2014.igem.org/Team:ATOMS-Turkiye/Attributions">Attributions</a></li> | ||
+ | <li><a href="https://2014.igem.org/Team:ATOMS-Turkiye/Acknowledgements">Acknowledgements</a></li> | ||
+ | <li><a href="https://2014.igem.org/Team:ATOMS-Turkiye/Collaboration">Collaboration</a></li> | ||
+ | <li><a href="https://igem.org/Team.cgi?id=1456">Official Team Profile</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li><a href="#center">Extras</a> | ||
+ | <ul> | ||
+ | <li><a href="https://2014.igem.org/Team:ATOMS-Turkiye/Notebook">Notebook</a></li> | ||
+ | <li><a href="https://2014.igem.org/Team:ATOMS-Turkiye/Protocols">Protocols</a></li> | ||
+ | <li><a href="https://2014.igem.org/Team:ATOMS-Turkiye/Achievements">Achievements</a></li> | ||
+ | <li><a href="https://2014.igem.org/Team:ATOMS-Turkiye/Interlab-Study">Interlab Study</a></li> | ||
+ | <li><a href="http://parts.igem.org/cgi/partsdb/pgroup.cgi?pgroup=iGEM2014&group=ATOMS-Turkiye">Official Parts Page</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </center></nav> | ||
+ | </div> | ||
+ | </body> | ||
+ | |||
</html> | </html> |
Revision as of 14:38, 15 August 2015