|
|
(9 intermediate revisions by 3 users not shown) |
Line 1: |
Line 1: |
| <html> | | <html> |
− | <style> | + | <head> |
| | | |
− | /********************************* MENU ********************************/
| + | </head> |
− | /* Wrapper for the menu */
| + | |
| | | |
− | /* Remove margins and padding from the list, and add a black background color */
| + | <body> |
| | | |
− | .clearfix:after { | + | |
− | display:block;
| + | |
− | clear:both;
| + | |
− | }
| + | |
| | | |
− | /*----- Menu Outline -----*/
| |
− | .menu-wrap {
| |
− | /* width:100%;*/
| |
− | /* box-shadow:0px 1px 3px rgba(255, 197, 0, 0.2);*/
| |
− | color: #3e0a11;
| |
− | }
| |
| | | |
− | .menu {
| + | <p style="text-align: center;"> |
− | /*width:1500px;*/
| + | |
− | padding:10px 16px;
| + | |
− | margin-left:20%;
| + | |
− | }
| + | |
− | | + | |
− | .menu li {
| + | |
− | margin:20x;
| + | |
− | list-style:none;
| + | |
− | padding:4px 4px;
| + | |
− | | + | |
− | }
| + | |
− | | + | |
− | .menu a {
| + | |
− | font-size:20px;
| + | |
− | font-family: 'Bad Script', cursive;
| + | |
− | font-weight: bold;
| + | |
− | letter-spacing: 3px;
| + | |
− | transition:all linear 0.15s;
| + | |
− | color:white;
| + | |
− | background-color: #bca8ab;
| + | |
− | text-decoration:none;
| + | |
− | /* -webkit-border-radius: 10px 10px 10px 10px;*/
| + | |
− | border-radius: 15px 15px 15px 15px;
| + | |
− | }
| + | |
− | | + | |
− | .menu li:hover > a, .menu .current-item > a {
| + | |
− | text-decoration:none;
| + | |
− | color: #be740d;
| + | |
− | }
| + | |
− | | + | |
− | .menu .arrow {
| + | |
− | font-size:10px;
| + | |
− | line-height:0%;
| + | |
− | }
| + | |
− | | + | |
− | /*----- Top Level -----*/
| + | |
− | .menu > ul > li {
| + | |
− | float:left;
| + | |
− | display:inline-block;
| + | |
− | position:relative;
| + | |
− | font-size:12px;
| + | |
− | /* color: black;*/
| + | |
− |
| + | |
− | }
| + | |
− | | + | |
− | .menu > ul > li > a {
| + | |
− | padding:12px 22px;
| + | |
− | display:inline-block;
| + | |
− | /* text-shadow:0px 1px 0px rgba(0,0,0,0.4);*/
| + | |
− | | + | |
− |
| + | |
− | | + | |
− | }
| + | |
− | | + | |
− | .menu > ul > li:hover > a, .menu > ul > .current-item > a {
| + | |
− | /* background:#2e2728;*/
| + | |
− | margin-bottom:-5px;
| + | |
− | }
| + | |
− | | + | |
− | /*----- Bottom Level -----*/
| + | |
− | .menu li:hover .sub-menu {
| + | |
− | z-index:1;
| + | |
− | opacity:1;
| + | |
− | }
| + | |
− | | + | |
− | .sub-menu {
| + | |
− | width:600px;
| + | |
− | font-size:20px;
| + | |
− | position:absolute;
| + | |
− | top:30px;
| + | |
− | left:-150px;
| + | |
− | z-index:-1;
| + | |
− | opacity:0;
| + | |
− | transition:opacity linear 0.15s;
| + | |
− | /* box-shadow:0px 2px 3px rgba(0,0,0,0.2);*/
| + | |
− | /* background:#2e2728;*/
| + | |
− | }
| + | |
− | | + | |
− | .sub-menu li {
| + | |
− | display:inline-block;
| + | |
− | padding:20px 2px;
| + | |
− | | + | |
− | }
| + | |
− | | + | |
− | .sub-menu li a {
| + | |
− | padding:6px 15px;
| + | |
− | display:inline-block;
| + | |
− | background: #a08488;
| + | |
− | | + | |
− | /*padding:12px 22px;*/
| + | |
− | }
| + | |
− | | + | |
− | .sub-menu li a:hover, .sub-menu .current-item a {
| + | |
− | /* background:#3e3436;*/
| + | |
− | }
| + | |
− | | + | |
− | | + | |
− | | + | |
− | </style>
| + | |
− | | + | |
− | | + | |
− | | + | |
− | | + | |
− | <!--- THIS IS WHERE THE HTML BEGINS --->
| + | |
− | | + | |
− | | + | |
− | <!-- This tells the browser that your page is responsive -->
| + | |
− | | + | |
− | <head>
| + | |
− | <meta name="viewport" content="width=device-width, initial-scale=1">
| + | |
− | <link href="https://fonts.googleapis.com/css?family=Bad+Script" rel="stylesheet">
| + | |
− | </head>
| + | |
− | | + | |
− | <body>
| + | |
− | <p style="text-align: center"> | + | |
| <a href="https://2016.igem.org/Team:Freiburg"> | | <a href="https://2016.igem.org/Team:Freiburg"> |
| <img src="https://static.igem.org/mediawiki/2016/8/84/T--Freiburg--Logo.png" style="width:300px"/> | | <img src="https://static.igem.org/mediawiki/2016/8/84/T--Freiburg--Logo.png" style="width:300px"/> |
Line 141: |
Line 16: |
| | | |
| | | |
− | <p style="text-align: center"> | + | </div> |
| | | |
| | | |
− | <div class="menu-wrap" >
| |
− | <nav class="menu">
| |
− |
| |
− |
| |
− | <ul class="clearfix">
| |
− |
| |
− | <li class="menu_item" >
| |
− | <a href=" https://2016.igem.org/Team:Freiburg/Team"> Team </a>
| |
− | <ul class="sub-menu">
| |
− | <li> <a href="https://2016.igem.org/Team:Freiburg/Team"> Team </a> </li>
| |
− | <li> <a href="https://2016.igem.org/Team:Freiburg/Attributions"> Attributions </a> </li>
| |
− | <li> <a href="https://2016.igem.org/Team:Freiburg/Achievements"> Achievements </a> </li>
| |
− | <li> <a href="https://2016.igem.org/Team:Freiburg/Pictures"> Pictures </a> </li>
| |
− |
| |
− | </ul>
| |
− | </li>
| |
− |
| |
− | <li class="menu_item">
| |
− | <a href="https://2016.igem.org/Team:Freiburg/Description"> Project <span class="arrow"></span></a>
| |
− | <ul class="sub-menu">
| |
− | <li> <a href="https://2016.igem.org/Team:Freiburg/Description"> Project </a></li>
| |
− | <li> <a href="https://2016.igem.org/Team:Freiburg/Motivation"> Motivation </a></li>
| |
− | <li> <a href="https://2016.igem.org/Team:Freiburg/Goals"> Goals </a></li>
| |
− | <li> <a href="https://2016.igem.org/Team:Freiburg/Outreach"> Outreach </a></li>
| |
− | </ul>
| |
− | </li>
| |
− |
| |
− | <li class="menu_item">
| |
− | <a href="https://2016.igem.org/Team:Freiburg/Methods"> Methods <span class="arrow"></span></a>
| |
− | <ul class="sub-menu">
| |
− |
| |
− | <li> <a href="https://2016.igem.org/Team:Freiburg/Methods"> Methods </a></li>
| |
− | <li> <a href="https://2016.igem.org/Team:Freiburg/B_subtilis"> Bacillus subtilis </a></li>
| |
− | <li> <a href="https://2016.igem.org/Team:Freiburg/Experiments"> Protocols </a></li>
| |
− | <li> <a href="https://2016.igem.org/Team:Freiburg/Notebook"> Journal </a></li>
| |
− |
| |
− |
| |
− | </ul>
| |
− | </li>
| |
− |
| |
− | <li class="menu_item">
| |
− | <a href="https://2016.igem.org/Team:Freiburg/Results"> Results <span class="arrow"></span></a>
| |
− | <ul class="sub-menu">
| |
− | <li> <a href="https://2016.igem.org/Team:Freiburg/Results"> Results </a></li>
| |
− | <li> <a href="https://2016.igem.org/Team:Freiburg/Proof"> Proof of Concept </a></li>
| |
− | <li> <a href="https://2016.igem.org/Team:Freiburg/Data"> Data </a></li>
| |
− | <li> <a href="https://2016.igem.org/Team:Freiburg/Biobricks"> Biobricks </a></li>
| |
− |
| |
− | </ul>
| |
− | </li>
| |
− |
| |
− |
| |
− | <li class="menu_item">
| |
− | <a href="https://2016.igem.org/Team:Freiburg/Safety"> Safety <span class="arrow"></span></a>
| |
− | <ul class="sub-menu">
| |
− | <li> <a href="https://2016.igem.org/Team:Freiburg/Safety"> General </a></li>
| |
− | <li> <a href="https://2016.igem.org/Team:Freiburg/Knockouts"> Knock Outs </a></li>
| |
− | <li> <a href="https://2016.igem.org/Team:Freiburg/Killswitch"> Kill Switch </a></li>
| |
− |
| |
− | </ul>
| |
− | </li>
| |
− |
| |
− |
| |
− | <li class="menu_item">
| |
− | <a href="https://2016.igem.org/Team:Freiburg/Human_Practices"> Human Practices <span class="arrow"></span> </a>
| |
− | <ul class="sub-menu">
| |
− | <li> <a href="https://2016.igem.org/Team:Freiburg/Human_Practices"> General </a></li>
| |
− | <li> <a href="https://2016.igem.org/Team:Freiburg/Integrated_Practices"> Integrated </a></li>
| |
− | <li> <a href="https://2016.igem.org/Team:Freiburg/Collaborations"> Collaborations </a></li>
| |
− | </ul>
| |
− | </li>
| |
− |
| |
− | </ul>
| |
− | </nav>
| |
− | </div>
| |
− | </p>
| |
| | | |
| </body> | | </body> |
− |
| |
− |
| |
− | <script>
| |
− |
| |
− | // This is the jquery part of your template. Try not modify any of this code since it makes your menu work.
| |
− |
| |
− |
| |
− |
| |
− |
| |
− | </script>
| |
| | | |
| </html> | | </html> |