Difference between revisions of "Template:Manchester/Navbar"

Line 1: Line 1:
−
{{Manchester}}
 
−
 
 
<html>
 
<html>
−
    <meta charset="utf-8">
+
<head>
−
  <meta name="viewport" content="width=device-width, initial-scale=1"/>
+
<link href="https://2017.igem.org/Team:Manchester/Resources/CSS:Bootstrap?action=raw&ctype=text/css" rel="stylesheet">
  
−
<body>
+
<link href="https://2017.igem.org/Team:Manchester/Resources/CSS:font?action=raw&ctype=text/css" rel="stylesheet">
  
−
<ul id="navcontainer">
+
<link href="https://2017.igem.org/Team:Manchester/Resources/CSS:NEStyle?action=raw&ctype=text/css" rel="stylesheet">
  
−
<div id="nav">
+
<script type="text/javascript" src="https://2017.igem.org/Team:Manchester/Resources/JS:fontawesome?action=raw&ctype=text/javascript"></script>
  
−
<a href="https://2018.igem.org/Team:Manchester"><img src="https://2018.igem.org/wiki/image/T--Manchester--NAVBARlogo.PNG" width="20%" height="auto"></a>
+
<script type="text/javascript" src="https://2017.igem.org/Team:Manchester/Resources/JS:NGL?action=raw&ctype=text/javascript"></script>
  
−
<div class="dropdown">
+
<meta name="viewport" content="width=device-width, initial-scale=1">
−
  <button class="dropbtn">PROJECT</button>
+
−
  <div class="dropdown-content">
+
−
    <a href="https://2018.igem.org/Team:Manchester/Description">Project Description</a>
+
−
    <a href="https://2018.igem.org/Team:Manchester/Results">Results</a>
+
−
    <a href="https://2018.igem.org/Team:Manchester/Collaborations">Collaborations</a>
+
−
    <a href="https://2018.igem.org/Team:Manchester/Improve">Improve</a>
+
−
    <a href="https://2018.igem.org/Team:Manchester/Demonstrate">Demonstrate</a>
+
−
  </div>
+
−
</div>
+
  
−
<div class="dropdown">
+
<script type="text/x-mathjax-config">
−
  <button class="dropbtn">PARTS</button>
+
MathJax.Hub.Config({
−
  <div class="dropdown-content">
+
  TeX: { equationNumbers: { autoNumber: "AMS" } }
−
    <a href="https://2018.igem.org/Team:Manchester/Parts">Parts Overview</a>
+
});
−
    <a href="https://2018.igem.org/Team:Manchester/Basic_Part">Basic Parts</a>
+
</script>
−
    <a href="https://2018.igem.org/Team:Manchester/Composite_Part">Composite parts</a>
+
−
    <a href="https://2018.igem.org/Team:Manchester/Part_Collection">Part collection</a>
+
−
</div>
+
−
</div>
+
  
−
<div class="dropdown">
+
<script src="https://2017.igem.org/common/MathJax-2.5-latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
−
  <button class="dropbtn">WET LAB</button>
+
−
  <div class="dropdown-content">
+
−
    <a href="https://2018.igem.org/Team:Manchester/InterLab">InterLab</a>
+
−
    <a href="https://2018.igem.org/Team:Manchester/Experiments">Lab Book</a>
+
−
    <a href="https://2018.igem.org/Team:Manchester/Safety">Safety</a>
+
−
  </div>
+
−
</div>
+
  
−
<div class="dropdown">
+
<script type="text/javascript" src="https://2017.igem.org/Team:Manchester/Resources/JS:jquery-2.1.4?action=raw&ctype=text/javascript"></script>
−
  <button class="dropbtn">DRY LAB</button>
+
 
−
  <div class="dropdown-content">
+
<script type="text/javascript" src="https://2017.igem.org/Team:Manchester/Resources/JS:bootstrap?action=raw&ctype=text/javascript"></script>
−
    <a href="#">Promoter Quantification</a>
+
−
    <a href="https://2018.igem.org/Team:Manchester/Model">Experimental Model</a>
+
−
  </div>
+
−
</div>
+
  
−
<div class="dropdown">
 
−
  <button class="dropbtn">HUMAN PRACTICES</button>
 
−
  <div class="dropdown-content">
 
−
    <a href="https://2018.igem.org/Team:Manchester/Human_Practices">Integrated Human Practices</a>
 
−
    <a href="#">The Cost of Listeria</a>
 
−
    <a href="#">GMO's and Brexit</a>
 
−
    <a href="https://2018.igem.org/Team:Manchester/Public_Engagement">Outreach</a>
 
−
  </div>
 
−
</div>
 
  
−
<div class="dropdown">
 
−
  <button class="dropbtn">TEAM</button>
 
−
  <div class="dropdown-content">
 
−
    <a href="https://2018.igem.org/Team:Manchester/Team">The Team</a>
 
−
    <a href="https://2018.igem.org/Team:Manchester/Attributions">Attributions</a>
 
−
    <a href="https://2018.igem.org/Team:Manchester/Notebook">Calendar</a>
 
−
    <a href="#">Gallery</a>
 
−
  </div>
 
−
</div>
 
−
</div>
 
−
</ul>
 
  
 
<style>
 
<style>
−
#navcontainer {
+
 
−
   list-style-type: none;
+
/********************************* DEFAULT WIKI SETTINGS  ********************************/
 +
 
 +
body, html {
 +
 
 +
  margin: 0!important;
 +
  padding: 0!important;
 +
}
 +
 
 +
.projectlink img:hover {
 +
  opacity: 0.7;
 +
}
 +
 
 +
.floatleft1 {
 +
  float: right!important;
 +
}
 +
 
 +
.floatright1 {
 +
  float: left!important;
 +
}
 +
 
 +
 
 +
 
 +
#sideMenu,
 +
#top_title {
 +
   display: none;
 +
}
 +
 
 +
#content {
 +
  padding: 0px;
 +
  width: 100%;
 +
}
 +
 
 +
#bodyContent h1,
 +
#bodyContent h2,
 +
#bodyContent h3,
 +
#bodyContent h4,
 +
#bodyContent h5 {
 +
  margin-bottom: 0px;
 +
}
 +
 
 +
#bodyContent {
 +
  padding-right: 0px;
 +
}
 +
 
 +
#globalWrapper {
 +
  font-size: 100%;
 +
  padding: 0px;
 +
  margin:0;
 +
}
 +
 
 +
.logo-center {
 +
  display: block;
 
   margin: 0;
 
   margin: 0;
−
   padding- bottom: 2%;
+
   width: 18vw;
−
  overflow: hidden;
+
−
  background-color: #ffffff;
+
−
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.1);
+
−
 
+
 
}
 
}
  
−
#nav {
+
.navbar-collapse {
−
  float: right;
+
   padding-left: 0px;
−
  padding-top: 2%;
+
−
  padding-bottom: 0%;
+
−
   padding-right: 3%;
+
 
}
 
}
  
−
#logo {
+
#banner {
 +
  margin-top: 50px;
 +
}
 +
 
 +
#sideMenu {
 +
  margin-top: 10px;
 +
}
 +
 
 +
.dropdown-menu li:hover .sub-menu {
 +
  visibility: visible;
 +
}
 +
 
 +
.dropdown:hover .dropdown-menu {
 +
  display: block;
 +
}
 +
 
 +
.navbar-nav .dropdown-menu,
 +
.navbar .dropdown-menu {
 +
  margin-top: 0;
 +
}
 +
 
 +
.navbar-right {
 +
  display: block!important;
 +
  width: 60vw;
 +
}
 +
 
 +
.dropdowntextcenter {
 +
  text-align: center
 +
}
 +
 
 +
.navbar-logo {
 +
  display: block;
 +
  padding-left: ;
 +
}
 +
 
 +
.nologoheader {
 +
  width: 0vw;
 +
}
 +
 
 +
.logoheader {
 +
  width: 16vw;
 +
}
 +
 
 +
.dropdown10 {
 +
  display: block!important;
 +
  width: 10vw!important;
 +
}
 +
 
 +
.dropdown13 {
 +
  display: block!important;
 +
  width: 13vw!important;
 +
}
 +
 
 +
.dropdown7 {
 +
  display: block!important;
 +
  width: 7vw!important;
 +
}
 +
 
 +
.gradient {
 +
  background-color: rgba(255, 255, 255, 0.8)!important;
 +
  border: none!important;
 +
  font-size: 1em;
 +
}
 +
 
 +
 
 +
 
 +
/********************************* CONTENT OF THE PAGE ********************************/
 +
 
 +
 
 +
/* Wrapper for the content */
 +
 
 +
.content_wrapper {
 +
  width: 85%;
 +
  margin-left: 150px;
 +
  padding: 0px;
 
   float: left;
 
   float: left;
−
   width: 30%;
+
   background-color: transparent;
−
  height: auto;
+
 
}
 
}
  
 +
.bgcontent_wrapper {
 +
  width: 85%;
 +
  margin-left: 100px;
 +
  padding: 0px;
 +
  float: left;
 +
  background-color: transparent;
 +
}
  
 +
/*LAYOUT */
  
−
/* Style The Dropdown Button */
+
.column {
−
.dropbtn {
+
  padding: 10px 0px;
−
    background-color: #ffffff;
+
  float: left;
−
    color: Black;
+
  background-color: transparent;
−
    padding-top: 15px;
+
−
    padding-bottom: 15px;
+
−
    padding-right:20px;
+
−
    padding-left: 20px;
+
−
    font-size: 140%;
+
−
    font-weight: bold;
+
−
    border: none;
+
−
    cursor: pointer;
+
−
    min-width: 210px;
+
 
}
 
}
  
−
/* The container <div> - needed to position the dropdown content */
+
.column.full_size {
−
.dropdown {
+
  width: 100%;
−
    position: center;
+
background-color: transparent;
−
    display: inline-block;
+
 
}
 
}
  
−
/* Dropdown Content (Hidden by Default) */
+
.full_size img {
−
.dropdown-content {
+
  padding: 10px 15px;
−
    display: none;
+
  width: 96.5%;
−
    position: absolute;
+
−
    background-color: #f2f2f2;
+
−
    min-width: 210px;
+
−
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+
−
    z-index: 100;
+
 
}
 
}
  
−
/* Links inside the dropdown */
+
.column.half_size {
−
.dropdown-content a {
+
  width: 50%;
−
    color: black;
+
background-color: transparent;
−
    padding: 5%;
+
−
    text-decoration: none;
+
−
    display: block;
+
−
    font-size: 140%;
+
 
}
 
}
  
−
/* Change color of dropdown links on hover */
+
.half_size img {
−
.dropdown-content a:hover {background-color: #e8e8e8}
+
  padding: 10px 15px;
 +
  width: 93%;
 +
}
  
−
/* Show the dropdown menu on hover */
+
.img:hover {
−
.dropdown:hover .dropdown-content {
+
  opacity: 1.0 !important;
−
    display: block;
+
 
}
 
}
  
−
/* Change the background color of the dropdown button when the dropdown content is shown */
+
.clear {
−
.dropdown:hover .dropbtn {
+
  clear: both;
−
    background-color: #d9d9d9;
+
 
}
 
}
 +
 +
.gonna-go-fast-to-the-top {
 +
  position: fixed;
 +
  bottom: 3vh;
 +
  right: 3vw;
 +
  z-index: 999999;
 +
  background-color: transparent;
 +
  opacity: 0.4;
 +
  width: 3em;
 +
  overflow: visible;
 +
  text-align: right
 +
}
 +
 +
.gonna-go-fast-to-the-top:hover {
 +
  opacity: 0.8
 +
}
 +
 +
a[href="#verytop"] {
 +
  color: #5bc7d8!important
 +
}
 +
 +
.highlight {
 +
  width: 90%;
 +
  margin: auto;
 +
  padding: 15px 5px;
 +
  background-color: #f2f2f2;
 +
}
 +
 +
.judges-will-not-evaluate {
 +
  border: 4px solid #72c9b6;
 +
  display: block;
 +
  margin: 5px 15px;
 +
  width: 95%;
 +
  font-weight: bold;
 +
}
 +
 +
 +
/*STYLING */
 +
 +
 +
/* styling for the titles */
 +
 +
.content_wrapper h1,
 +
.content_wrapper h2 {
 +
  padding: 5px 15px;
 +
  border-bottom: 0px;
 +
  color: #72C489;
 +
}
 +
 +
.content_wrapper h3,
 +
.content_wrapper h4,
 +
.content_wrapper h5,
 +
.content_wrapper h6 {
 +
  padding: 5px 15px;
 +
  border-bottom: 0px;
 +
  color: #000000;
 +
}
 +
 +
 +
/* font and text */
 +
 +
.content_wrapper p {
 +
  padding: 0px 15px;
 +
  font-size: 13px;
 +
  font-family: 'Proxima-nova', sans-serif;
 +
}
 +
 +
 +
/* Links */
 +
 +
.content_wrapper a {
 +
  font-weight: bold;
 +
  text-decoration: underline;
 +
  text-decoration-color: #72C489;
 +
  color: #72c9b6;
 +
  -webkit-transition: all 0.4s ease;
 +
  -moz-transition: all 0.4s ease;
 +
  -ms-transition: all 0.4s ease;
 +
  -o-transition: all 0.4s ease;
 +
  transition: all 0.4s ease;
 +
}
 +
 +
 +
/* hover for the links */
 +
 +
.content_wrapper a:hover {
 +
  text-decoration: none;
 +
  color: #000000;
 +
}
 +
 +
 +
/* non numbered lists */
 +
 +
.content_wrapper ul {
 +
  padding: 0px 20px;
 +
  font-size: 13px;
 +
}
 +
 +
 +
/* numbered lists */
 +
 +
.content_wrapper ol {
 +
  padding: 0px;
 +
  font-size: 13px;
 +
}
 +
 +
 +
/* Table */
 +
 +
.content_wrapper table {
 +
  width: 97%;
 +
  margin: 15px 10px;
 +
  border: 1px solid #d3d3d3;
 +
  border-collapse: collapse;
 +
}
 +
 +
 +
/* table cells */
 +
 +
.content_wrapper td {
 +
  padding: 10px;
 +
  vertical-align: text-top;
 +
  border: 1px solid #d3d3d3;
 +
  border-collapse: collapse;
 +
}
 +
 +
 +
/* table headers */
 +
 +
.content_wrapper th {
 +
  padding: 10px;
 +
  vertical-align: text-top;
 +
  border: 1px solid #d3d3d3;
 +
  border-collapse: collapse;
 +
  background-color: #f2f2f2;
 +
}
 +
 +
 +
/* Button class */
 +
 +
.button_click {
 +
  margin: 10px auto;
 +
  padding: 15px;
 +
  width: 12%;
 +
  text-align: center;
 +
  font-weight: bold;
 +
  background-color: #72C489;
 +
  cursor: url(https://static.igem.org/mediawiki/2018/0/04/T--MichiganState--Endophyte2.png), auto;
 +
  -webkit-transition: all 0.4s ease;
 +
  -moz-transition: all 0.4s ease;
 +
  -ms-transition: all 0.4s ease;
 +
  -o-transition: all 0.4s ease;
 +
  transition: all 0.4s ease;
 +
}
 +
 +
 +
/* button class on hover */
 +
 +
.button_click:hover {
 +
  background-color: #000000;
 +
  color: #5bc7d8;
 +
}
 +
 +
.top-pad {
 +
  padding: 35px;
 +
}
 +
 +
.panel-default>.panel-heading> .panel-title > .collapsed div:nth-of-type(2) ::after {
 +
    content:"\25b2";
 +
}
 +
 +
.panel-default>.panel-heading >.panel-title > :not(.collapsed) div:nth-of-type(2) ::after {
 +
    content:"\25bc";
 +
}
 +
 +
/********************************* RESPONSIVE STYLING ********************************/
 +
 +
  
 
</style>
 
</style>
 +
 +
</head>
 +
 +
<body>
 +
 +
<div id="verytop">
 +
 +
  <nav class="navbar navbar-default navbar-fixed-top visible-md visible-lg gradient bmc-bg" style=" padding-top: 20px; padding-left: 8vw; padding-right: 8vw">
 +
    <div class="container-fluid">
 +
 +
 +
<div class="logo-center logoheader">
 +
      <a class="navbar-left" href="https://2018.igem.org/Team:MichiganState">
 +
        <a class="navbar-logo" href="https://2018.igem.org/Team:MichiganState">
 +
          <img style="float: left; display: block" src="https://static.igem.org/mediawiki/2018/a/ac/T--MichiganState--LogoWhiteBackground.jpeg" width="50%">
 +
        </a>
 +
      </a>
 +
</div>
 +
 +
      <div id="navbar" class="navbar-collapse collapse">
 +
        <ul class="nav navbar-nav navbar-right" style="margin-top: 10px;">
 +
 +
          <li class="dropdown dropdown8">
 +
            <a class="dropdown-toggle active dropdowntextcenter" href="https://2018.igem.org/Team:MichiganState/Description">Project<span class="caret"></span></a>
 +
            <ul class="dropdown-menu" style="left:0;">
 +
              <li><a href="https://2018.igem.org/Team:MichiganState/Description">Overview</a></li>
 +
              <li><a href="https://2018.igem.org/Team:MichiganState/Design">Design</a></li>
 +
              <li><a href="https://2018.igem.org/Team:MichiganState/Experiments">Experiments</a></li>
 +
              <li><a href="https://2018.igem.org/Team:MichiganState/Results">Results</a></li>
 +
              <li><a href="https://2018.igem.org/Team:MichiganState/Demonstrate">Demonstrate</a></li>
 +
              <li><a href="https://2018.igem.org/Team:MichiganState/Improve">Improve</a></li>
 +
              <li><a href="https://2018.igem.org/Team:MichiganState/InterLab">InterLab Study</a></li>
 +
 +
 +
 +
      <li><a href="https://igem.org/2018_Judging_Form?team=MichiganState">JUDGING FORM</a></li>
 +
            </ul>
 +
          </li>
 +
 +
          <li class="dropdown dropdown1">
 +
            <a class="dropdown-toggle active dropdowntextcenter" href="https://2018.igem.org/Team:MichiganState/Model">Modeling<span class="caret"></span></a>
 +
            <ul class="dropdown-menu" style="left:0;">
 +
              <li><a href="https://2018.igem.org/Team:MichiganState/Model">Overview</a></li>
 +
            </ul>
 +
          </li>
 +
 +
          <li class="dropdown dropdown5">
 +
            <a class="dropdown-toggle active dropdowntextcenter" href="https://2018.igem.org/Team:MichiganState/Parts">Parts<span class="caret"></span></a>
 +
            <ul class="dropdown-menu" style="left:0;">
 +
              <li><a href="https://2018.igem.org/Team:MichiganState/Parts">Overview</a></li>
 +
              <li><a href="https://2018.igem.org/Team:MichiganState/Basic_Part">Basic Parts</a></li>
 +
              <li><a href="https://2018.igem.org/Team:MichiganState/Composite_Part">Composite Parts</a></li>
 +
              <li><a href="https://2018.igem.org/Team:MichiganState/Part_Collection">Part Collection</a></li>
 +
            </ul>
 +
          </li>
 +
 +
 +
          <li class="dropdown dropdown13">
 +
            <a class="dropdown-toggle active dropdowntextcenter" href="https://2018.igem.org/Team:MichiganState/HP_Summary">Human Practices<span class="caret"></span></a>
 +
            <ul class="dropdown-menu">
 +
              <li><a href="https://2018.igem.org/Team:MichiganState/HP_Summary">Summary</a></li>
 +
              <li><a href="https://2018.igem.org/Team:MichiganState/Human_Practices">Human Practices</a></li>
 +
              <li><a href="https://2018.igem.org/Team:MichiganState/Public_Engagement">Public Engagement</a></li>
 +
              <li><a href="https://2018.igem.org/Team:MichiganState/Silver_Medal_Criterion">Silver Medal Criteria</a></li>
 +
              <li><a href="https://2018.igem.org/Team:MichiganState/Gold_Medal_Criterion">Gold Medal Criteria</a></li>
 +
            </ul>
 +
          </li>
 +
 +
          <li class="dropdown dropdown5">
 +
            <a class="dropdown-toggle active dropdowntextcenter" href="https://2018.igem.org/Team:MichiganState/Team">Team<span class="caret"></span></a>
 +
            <ul class="dropdown-menu" style="text-align: right;">
 +
              <li><a href="https://2018.igem.org/Team:MichiganState/Team">Team</a></li>
 +
              <li><a href="https://2018.igem.org/Team:MichiganState/Collaborations">Collaborations</a></li>
 +
              <li><a href="https://2018.igem.org/Team:MichiganState/Attributions">Attributions</a></li>
 +
            </ul>
 +
          </li>
 +
 +
          <li class="dropdown dropdown10">
 +
            <a class="dropdown-toggle active dropdowntextcenter" href="https://2018.igem.org/Team:MichiganState/Notebook">Notebook<span class="caret"></span></a>
 +
            <ul class="dropdown-menu" style="left:0;">
 +
              <li><a href="https://2018.igem.org/Team:MichiganState/Notebook">Notebook</a></li>
 +
            </ul>
 +
          </li>
 +
 +
 +
 +
<li class="dropdown dropdown7">
 +
            <a class="dropdown-toggle active dropdowntextcenter" href="https://2018.igem.org/Team:MichiganState/Awards">Awards<span class="caret"></span></a>
 +
            <ul class="dropdown-menu" style="text-align: right;">
 +
              <li><a href="https://2018.igem.org/Team:MichiganState/Applied_Design">Applied Design</a></li>
 +
              <li><a href="https://2018.igem.org/Team:MichiganState/Entrepreneurship">Entrepreneurship</a></li>
 +
              <li><a href="https://2018.igem.org/Team:MichiganState/Hardware">Hardware</a></li>
 +
              <li><a href="https://2018.igem.org/Team:MichiganState/Measurement">Measurement</a></li>
 +
              <li><a href="https://2018.igem.org/Team:MichiganState/Model">Model</a></li>
 +
              <li><a href="https://2018.igem.org/Team:MichiganState/Plant">Plant</a></li>
 +
 +
 +
            </ul>
 +
          </li>
 +
 +
        </ul>
 +
      </div>
 +
      <!-- /.navbar-collapse -->
 +
    </div>
 +
    <!-- /.container-fluid -->
 +
  <div class="clear"></div>
 +
  </nav>
 +
 +
</div>
 +
 +
<div class="gonna-go-fast-to-the-top"><a href="#verytop">
 +
<p><i class="fa fa-3x fa-arrow-circle-o-up"></i></p>
 +
</a></div>
 +
 +
</body>
 +
 
</html>
 
</html>

Revision as of 10:36, 5 September 2018