Difference between revisions of "Team:Bielefeld-CeBiTec/Basic Navbar"

 
(109 intermediate revisions by the same user not shown)
Line 1: Line 1:
 
<html lang="en">
 
<html lang="en">
 
<head>
 
<head>
−
   <title>Bootstrap Example</title>
+
   <title></title>
 
   <meta charset="utf-8">
 
   <meta charset="utf-8">
 
   <meta name="viewport" content="width=device-width, initial-scale=1">
 
   <meta name="viewport" content="width=device-width, initial-scale=1">
−
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
+
 
−
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
+
<link rel="stylesheet" type="text/css"  
−
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
+
href="https://2018.igem.org/Team:Bielefeld-CeBiTec/CSS?action=raw&ctype=text/css" />
 
    
 
    
−
  <style>
+
<script>
−
+
(function($) {
−
.firstHeading {
+
  $(function() {  
−
display: none;
+
   
−
}
+
    $('nav ul li a:not(:only-child)').click(function(e) {
 +
      $(this).siblings('.nav-dropdown').toggle();
 +
      $('.nav-dropdown').not($(this).siblings()).hide();
 +
      e.stopPropagation();
 +
    });
 +
 
 +
    $('html').click(function() {
 +
      $('.nav-dropdown').hide();
 +
    });
 +
    $('#nav-toggle').click(function() {
 +
      $('nav ul').slideToggle();
 +
    });
 +
    $('#nav-toggle').on('click', function() {
 +
      this.classList.toggle('active');
 +
    });
 +
  });
 +
})(jQuery);
  
−
#content {
 
−
margin-left:0px;
 
−
margin-top:-7px;
 
−
padding:0px;
 
−
width:100%;
 
−
}
 
  
−
.mw-content-text {
 
−
display: none;
 
−
}
 
  
−
.logo_2018 {
 
−
display: none;
 
−
}
 
  
−
.content {
 
−
padding: 0px;
 
−
width: 100%;
 
−
margin: 0px;
 
−
border: none;
 
−
}
 
  
−
.globalWrapper {
 
−
padding: 0px;
 
−
}
 
  
 +
</script>
  
−
body {
 
−
font-family: "Lato", sans-serif;
 
−
}
 
−
 
−
 
−
/* navbar */
 
−
.navbar{
 
−
background-color: #000000;
 
−
border-color: #000000;
 
−
}
 
−
 
−
.navbar.center .navbar-inner {
 
−
    text-align: center;
 
−
}
 
−
 
−
.navbar.center .navbar-inner .nav {
 
−
float: none;
 
−
display:inline-block;
 
−
vertical-align: middle;
 
−
}
 
−
 
−
/* Title */
 
−
.navbar .navbar-brand {
 
−
color: #777;
 
−
}
 
−
.navbar .navbar-brand:hover,
 
−
.navbar .navbar-brand:focus {
 
−
color: #5E5E5E;
 
−
}
 
−
/* Link */
 
−
.navbar .navbar-nav > li > a {
 
−
color: #ffffff;
 
−
 
−
}
 
−
.navbar .navbar-nav > li > a:hover,
 
−
.navbar .navbar-nav > li > a:focus {
 
−
color: #0067e6;
 
−
}
 
−
.navbar .navbar-nav > .active > a,
 
−
.navbar .navbar-nav > .active > a:hover,
 
−
.navbar .navbar-nav > .active > a:focus {
 
−
color: #ffffff;
 
−
background-color:  #002a5c;
 
−
}
 
−
.navbar .navbar-nav > .open > a,
 
−
.navbar .navbar-nav > .open > a:hover,
 
−
.navbar .navbar-nav > .open > a:focus {
 
−
color: #ffffff;
 
−
background-color: #002a5c;
 
−
}
 
−
/* Caret */
 
−
.navbar .navbar-nav > .dropdown > a .caret {
 
−
border-top-color: #ffffff;
 
−
border-bottom-color: #ffffff;
 
−
}
 
−
.navbar .navbar-nav > .dropdown > a:hover .caret,
 
−
.navbar .navbar-nav > .dropdown > a:focus .caret {
 
−
border-top-color: #5E5E5E;
 
−
border-bottom-color: #5E5E5E;
 
−
}
 
−
.navbar .navbar-nav > .open > a .caret,
 
−
.navbar .navbar-nav > .open > a:hover .caret,
 
−
.navbar .navbar-nav > .open > a:focus .caret {
 
−
border-top-color: #ffffff;
 
−
border-bottom-color: #ffffff;
 
−
}
 
−
 
−
.navbar .navbar-nav .dropdown-toggle{
 
−
color: #ffffff;
 
−
background-color: #000000;
 
−
}
 
−
 
−
.navbar .navbar-nav .dropdown-menu {
 
−
color: #ffffff;
 
−
background-color: #000000;
 
−
}
 
−
 
−
.navbar .navbar-nav .dropdown-menu > li > a{
 
−
color: #ffffff;
 
−
background-color: #000000;
 
−
}
 
−
 
−
/* Mobile version */
 
−
.navbar .navbar-toggle {
 
−
border-color: #DDD;
 
−
}
 
−
.navbar .navbar-toggle:hover,
 
−
.navbar .navbar-toggle:focus {
 
−
background-color: #DDD;
 
−
}
 
−
.navbar .navbar-toggle .icon-bar {
 
−
background-color: #CCC;
 
−
}
 
−
@media (max-width: 767px) {
 
−
.navbar .navbar-nav .open .dropdown-menu > li > a {
 
−
color: #777;
 
−
}
 
−
.navbar .navbar-nav .open .dropdown-menu > li > a:hover,
 
−
.navbar .navbar-nav .open .dropdown-menu > li > a:focus {
 
−
  color: #333;
 
−
}
 
−
}
 
−
 
−
.logo-img{
 
−
width: 65px;
 
−
}
 
−
  </style>
 
−
 
 
 
</head>
 
</head>
 
<body>
 
<body>
  
−
<nav class="navbar navbar-inverse center">
+
<section class="navigation" style="z-index:100">
−
   <div class="container-fluid">
+
   <div class="nav-container">
−
     <div class="navbar-header">
+
     <div class="brand">
−
<img class="logo-img" src="https://static.igem.org/mediawiki/2018/a/ad/T--Bielefeld-CeBiTec--Logo_invertiert.jpg" width="180">
+
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec"><img class="logo-img" src="https://static.igem.org/mediawiki/2018/1/1b/T--Bielefeld-CeBiTec--nanofactory_navbar_vk.png"></a>
 
     </div>
 
     </div>
−
<div class="navbar-inner">
+
    <nav>
−
<ul class="nav navbar-nav">
+
      <div class="nav-mobile"><a id="nav-toggle" href="#!"><span></span></a></div>
−
<li class="active">
+
      <ul class="nav-list">
−
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec">Home</a>
+
        <li>
−
</li>
+
          <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec">Home</a>
 +
        </li>
 +
        <li>
 +
          <a href="#!">Project</a>
 +
          <ul class="nav-dropdown">
 +
            <li>
 +
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Motivation">Motivation</a>
 +
            </li>
 +
            <li>
 +
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Description">Overview</a>
 +
            </li>
 +
            <li>
 +
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Toxicity_Theory">Toxicity</a>
 +
            </li>
 +
<li>
 +
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Accumulation">Accumulation</a>
 +
            </li>
 +
<li>
 +
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/siRNA">Silencing</a>
 +
            </li>
  
−
<li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#">Project <span class="caret"></span></a>
+
           
−
<ul class="dropdown-menu">
+
<li>
−
<li>
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Ferritin">Nanoparticles</a>
−
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Description">Overview</a>
+
            </li>
−
</li>
+
          </ul>
−
<li>
+
        </li><li>
−
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Design">Design</a>
+
          <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Model">Modeling</a>
−
</li>
+
        </li><li>
−
<li>
+
          <a href="#!">Results</a>
−
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Experiments">Experiments</a>
+
          <ul class="nav-dropdown">
−
</li>
+
<li>
−
<li>
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Results">Results Overview</a>
−
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/InterLab">InterLab</a>
+
            </li>
−
</li>
+
<li>
−
<li>
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Toxicity_Results">Toxicity Results</a>
−
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Demonstrate">Demonstrate</a>
+
            </li>
−
</li>
+
<li>
−
<li>
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Accumulation_Results">Accumulation Results</a>
−
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Improve">Improve</a>
+
            </li>
−
</li>
+
<li>
−
</ul>
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/siRNA_Results">Silencing Results</a>
−
</li>
+
            </li>
−
+
<li>
−
<li>
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Ferritin_Results">Nanoparticles Results</a>
−
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Model">Modeling</a>
+
            </li>
−
</li>  
+
<li>
−
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/InterLab">InterLab</a>
−
<li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#">Results <span class="caret"></span></a>
+
            </li><li>
−
<ul class="dropdown-menu">
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Demonstrate">Demonstrate</a>
−
<li>
+
            </li>
−
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Results">Results Overview</a>
+
          </ul>
−
</li>
+
        </li>
−
<li>
+
 
−
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Parts">Parts Overview</a>
+
<li>
−
</li>
+
          <a href="#!">Parts</a>
−
<li>
+
          <ul class="nav-dropdown">
−
  <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Basic_Part">Basic Parts</a>
+
            <li>
−
</li>
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Parts">Parts Overview</a>
−
<li>
+
            </li><li>
−
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Composite_Part">Composite Parts</a>
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Basic_Part">Basic Parts</a>
−
</li>
+
            </li>
−
<li>
+
<li>
−
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Part_Collection">Part Collection</a>
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Composite_Part">Composite Parts</a>
−
</li>
+
            </li>
−
</ul>
+
<li>
−
</li>
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Part_Collection">Parts Collection</a>
−
+
            </li>
−
<li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#">Human Practices <span class="caret"></span></a>
+
<li>
−
<ul class="dropdown-menu">
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Improve">Parts Improvement</a>
−
<li>
+
            </li>
−
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Human_Practices">Human Practices</a>
+
          </ul>
−
</li>
+
        </li>
−
<li>
+
 
−
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Public_Engagement">Education and Engagement</a>
+
<li>
−
</li>
+
          <a href="#!">Human Practices</a>
−
</ul>
+
          <ul class="nav-dropdown">
−
</li>
+
            <li>
−
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Human_Practices">Human Practices</a>
−
<li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#">Awards <span class="caret"></span></a>
+
            </li><li>
−
<ul class="dropdown-menu">
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Public_Engagement">Outreach</a>
−
<li>
+
            </li>
−
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Applied_Design">Applied Design</a>
+
          </ul>
−
</li>
+
        </li><li>
−
<li>
+
          <a href="#!">Awards</a>
−
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Entrepreneurship">Entrepreneurship</a>
+
          <ul class="nav-dropdown">
−
</li>
+
            <li>
−
<li>
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Hardware">Hardware</a>
−
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Hardware">Hardware</a>
+
            </li><li>
−
</li>
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Software">Software</a>
−
<li>
+
            </li><li>
−
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Measurement">Measurement</a>
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Measurement">Measurement</a>
−
</li>
+
            </li>
−
<li>
+
<li>
−
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Model">Model</a>
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Design">Product Design</a>
−
</li>
+
            </li>
−
<li>
+
          </ul>
−
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Plant">Plant</a>
+
        </li><li>
−
</li>
+
          <a href="#!">Notebook</a>
−
<li>
+
          <ul class="nav-dropdown">
−
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Software">Software</a>
+
            <li>
−
</li>
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Notebook">Notebook</a>
−
</ul>
+
            </li><li>
−
</li>
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Experiments">Experiments</a>
−
+
            </li>
−
<li>
+
          </ul>
−
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Notebook">Notebook</a>
+
        </li><li>
−
</li>
+
          <a href="#!">Team</a>
−
+
          <ul class="nav-dropdown">
−
<li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#">Team <span class="caret"></span></a>
+
            <li>
−
<ul class="dropdown-menu">
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Team">Members</a>
−
<li>
+
            </li><li>
−
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Team">Team Members</a>
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Bielefeld">Bielefeld</a>
−
</li>
+
            </li><li>
−
<li>
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/CeBiTec">CeBiTec</a>
−
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Collaborations">Collaborations</a>
+
            </li><li>
−
</li>
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Bielefeld-University">Bielefeld University</a>
−
<li>
+
            </li><li>
−
<a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Attributions">Attributions</a>
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Collaborations">Collaborations</a>
−
</li>
+
            </li><li>
−
</ul>
+
              <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Attributions">Attributions</a>
−
</li>
+
            </li>
−
+
          </ul>
−
<li>
+
        </li><li>
−
<a href="https://igem.org/2018_Judging_Form?team=Bielefeld-CeBiTec">Judging Form ⇗</a>
+
          <a href="https://2018.igem.org/Team:Bielefeld-CeBiTec/Partners">Partners</a>
−
</li>
+
        </li><li>
−
+
          <a href="https://igem.org/2018_Judging_Form?team=Bielefeld-CeBiTec">Judging Form ⇗</a>
−
</ul>
+
        </li>
−
</div>
+
      </ul>
 +
    </nav>
 
   </div>
 
   </div>
−
</nav>
+
</section>
 +
 
  
 
</body>
 
</body>
 
</html>
 
</html>

Latest revision as of 03:20, 18 October 2018