Difference between revisions of "Template:Lethbridge HS/navbar"

 
(66 intermediate revisions by 3 users not shown)
Line 1: Line 1:
 +
{{Lethbridge_HS/bootsrapcss}}
 +
{{Team:Lethbridge_HS/bootstrap_js}}
 +
 +
 +
 
<html>
 
<html>
 
   <head>
 
   <head>
    <link href="css/bootstrap.min.css" rel="stylesheet">
+
</head>
 
+
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
 
     <style>
 
     <style>
    .navbar {
+
.navbar{
      font-family: Arial;
+
margin-top: 9px;
      color: white;
+
opacity: .9;
      margin-top: 9px;
+
      position: fixed;
+
      width: 100%;
+
      background-color: black;
+
      opacity:;
+
 
+
 
+
     
+
    }
+
 
+
   
+
 
+
    .navbar ul {
+
      margin: 0px;
+
      padding: 0px;
+
      list-style-type: none;
+
    }
+
 
+
    .navbar ul li {
+
      float: right;
+
      width: 130px;
+
      height: 45px;
+
      opacity: .8;
+
      background-color: #d99ebc;
+
      line-height: 45px;
+
      text-align: center;
+
      font-size: 18px
+
 
+
 
   
 
   
   
+
}
    }
+
  
    .navbar ul li a {
+
.navbar-brand{
      text-decoration: none;
+
      color: black;
+
      display: block;
+
  
    }
 
  
    .navbar ul li a:hover {
 
      text-decoration: none;
 
  
    }
+
}
  
 +
.navbar-collapse collapse{
 +
display:block;
 +
}
  
  
    .navbar ul li ul li {
 
      display: none;
 
  
    }
 
  
    .navbar ul li:hover ul li {
 
      display: block;
 
  
    }
+
</style>
  
   
 
  #logo{
 
  
 
 
margin-left:5%;}
 
 
 
 
 
 
    </style>
 
 
  </head>
 
  
 
<body>
 
<body>
 
  <nav style="z-index: 1000;"class="navbar navbar-inverse navbar-fixed-top">
 
<div class="container-fluid">
 
  <div class="navbar-header">
 
    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
 
      <span class="icon-bar"></span>
 
      <span class="icon-bar"></span>
 
      <span class="icon-bar"></span>
 
    </button>
 
    <a class="navbar-brand" href="#">Lethbridge HS</a>
 
  </div>
 
  <div class="collapse navbar-collapse" id="myNavbar">
 
    <ul class="nav navbar-nav navbar-right">
 
      <li class="active"><a href="#">Home</a></li>
 
      <li><a href="#">Page 1</a></li>
 
      <li><a href="#">Page 2</a></li>
 
      <li><a href="#">Page 3</a></li>
 
    </ul>
 
   
 
  </div>
 
</div>
 
</nav>
 
  
  
 +
  <nav class="navbar navbar-inverse navbar-fixed-top">
 +
    <div class="container-fluid">
 +
      <div class="navbar-header">
 +
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#myNavbar" aria-expanded="false">
 +
          <span class="icon-bar"></span>
 +
          <span class="icon-bar"></span>
 +
          <span class="icon-bar"></span>
 +
        </button>
 +
        <a class="navbar-brand" href="https://2017.igem.org/Team:Lethbridge_HS "> Lethbridge HS  </a>
 +
      </div>
 +
      <div class="collapse navbar-collapse" id="myNavbar">
 +
        <ul class="nav navbar-nav navbar-right">
  
 +
          <li class="dropdown">
 +
        <a class="dropdown-toggle" data-toggle="dropdown" href="#">Project
 +
        <span class="caret"></span></a>
 +
        <ul class="dropdown-menu navbar-right">
 +
          <li><a href="https://2017.igem.org/Team:Lethbridge_HS/Description">Project Description</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Lethbridge_HS/Design">Design</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Lethbridge_HS/Applied_Design">Applied Design</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Lethbridge_HS/Demonstrate ">Demonstrate</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Lethbridge_HS/Model ">Model</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Lethbridge_HS/Results ">Results</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Lethbridge_HS/Achievements ">Achievements</a></li>
 +
        </ul>
 +
      </li>
 +
      <li class="dropdown">
 +
    <a class="dropdown-toggle" data-toggle="dropdown" href="#">Parts
 +
    <span class="caret"></span></a>
 +
    <ul class="dropdown-menu navbar-right">
 +
      <li><a href="https://2017.igem.org/Team:Lethbridge_HS/Basic_Part ">Basic Parts</a></li>
 +
      <li><a href="https://2017.igem.org/Team:Lethbridge_HS/Composite_Part ">Composite Parts</a></li>
 +
      <li><a href="https://2017.igem.org/Team:Lethbridge_HS/Improve ">Improved Parts</a></li>
 +
      <li><a href="https://2017.igem.org/Team:Lethbridge_HS/Contribution ">Part Contributions</a></li>
 +
      <li><a href="https://2017.igem.org/Team:Lethbridge_HS/Part_Collection ">Part Collection</a></li>
 +
    </ul>
 +
  </li>
 +
  <li class="dropdown">
 +
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Human Practices
 +
<span class="caret"></span></a>
 +
<ul class="dropdown-menu navbar-right">
 +
  <li><a href="https://2017.igem.org/Team:Lethbridge_HS/Human_Practices ">Human Practices</a></li>
 +
  <li><a href="https://2017.igem.org/Team:Lethbridge_HS/HP/Silver ">Silver</a></li>
 +
  <li><a href="https://2017.igem.org/Team:Lethbridge_HS/HP/Gold_Integrated ">Gold</a></li>
 +
  <li><a href="https://2017.igem.org/Team:Lethbridge_HS/Engagement ">Engagement</a></li>
 +
</ul>
 +
</li>
 +
<li class="dropdown">
 +
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Lab
 +
<span class="caret"></span></a>
 +
<ul class="dropdown-menu navbar-right">
 +
<li><a href="https://2017.igem.org/Team:Lethbridge_HS/Notebook">Notebook</a></li>
 +
<li><a href="https://2017.igem.org/Team:Lethbridge_HS/Experiments ">Experiments</a></li>
 +
</ul>
 +
</li>
 +
<li><a href="https://2017.igem.org/Team:Lethbridge_HS/Safety ">Safety</a></li>
 +
<li class="dropdown">
 +
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Team
 +
<span class="caret"></span></a>
 +
<ul class="dropdown-menu navbar-right">
 +
<li><a href="https://2017.igem.org/Team:Lethbridge_HS/Team ">Team</a></li>
 +
<li><a href="https://2017.igem.org/Team:Lethbridge_HS/Collaborations ">Collaborations</a></li>
 +
<li><a href="https://2017.igem.org/Team:Lethbridge_HS/Attributions ">Attributions</a></li>
 +
</ul>
 +
</li>
 +
<li><a href="https://igem.org/Main_Page ">iGEM</a></li>
 +
        </ul>
  
 +
      </div>
 +
    </div>
 +
  </nav>
  
  

Latest revision as of 23:56, 30 October 2017