Difference between revisions of "Template:Manchester/Navbar"

 
(75 intermediate revisions by 3 users not shown)
Line 1: Line 1:
 +
 
{{Manchester}}
 
{{Manchester}}
−
 
+
{{Manchester/mobilenav}}
 
<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="70%" 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/Parts">Parts Overview</a>
+
−
    <a href="https://2018.igem.org/Team:Manchester/Basic_Part">Basic Parts</a>
+
−
    <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>
+
−
    <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">WET LAB</button>
+
MathJax.Hub.Config({
−
  <div class="dropdown-content">
+
  TeX: { equationNumbers: { autoNumber: "AMS" } }
−
    <a href="https://2018.igem.org/Team:Manchester/InterLab">InterLab</a>
+
});
−
    <a href="https://2018.igem.org/Team:Manchester/Experiments">Lab Book</a>
+
</script>
−
    <a href="https://2018.igem.org/Team:Manchester/Safety">Safety</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">DRY LAB</button>
+
 
−
  <div class="dropdown-content">
+
<script type="text/javascript" src="https://2017.igem.org/Team:Manchester/Resources/JS:jquery-2.1.4?action=raw&ctype=text/javascript"></script>
−
    <a href="#">Promoter Quantification</a>
+
 
−
    <a href="https://2018.igem.org/Team:Manchester/Model">Experimental Model</a>
+
<script type="text/javascript" src="https://2017.igem.org/Team:Manchester/Resources/JS:bootstrap?action=raw&ctype=text/javascript"></script>
−
  </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  ********************************/
 +
nav .navbar {
 +
display: table !important;
 +
}
 +
 
 +
@media only screen and (max-width:980px) {
 +
  /* For tablets: */
 +
  .main {
 +
    width: 80%;
 +
    padding: 0;
 +
  }
 +
  .right {
 +
    width: 100%;
 +
  }
 +
}
 +
@media only screen and (max-width:500px) {
 +
  /* For mobile phones: */
 +
  .menu, .main, .right {
 +
    width: 100%;
 +
  }
 +
}
 +
 
 +
 
 +
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: 15vw!important;
 +
}
 +
 
 +
.dropdown13 {
 +
  display: block!important;
 +
  width: 16vw!important;
 +
}
 +
 
 +
.dropdown7 {
 +
  display: block!important;
 +
  width: 16vw!important;
 +
}
 +
 
 +
.dropdown8 {
 +
  display: block!important;
 +
  width: 15vw!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";
 +
}
 +
 +
nav .navbar {
 +
display: table !important;
 +
}
 +
 +
.navigation-bar {
 +
background-color: #000000;
 +
}
 +
@media (max-width: 980px) {
 +
.navigation-bar {
 +
background-color: #FFFFFF;
 +
}
 +
}
 +
/********************************* 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:Manchester">
 +
        <a class="navbar-logo" href="https://2018.igem.org/Team:Manchester">
 +
          <img style="float: left; display: block" src="https://static.igem.org/mediawiki/2018/c/c6/T--Manchester--NAVBARLOGOCLEAR.PNG" width="200%">
 +
        </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:Manchester/Description">Project<span class="caret"></span></a>
 +
            <ul class="dropdown-menu" style="left:0;">
 +
              <li><a href="https://2018.igem.org/Team:Manchester/Description">Project Description</a></li>
 +
              <li><a href="https://2018.igem.org/Team:Manchester/Results">Results</a></li>
 +
              <li><a href="https://2018.igem.org/Team:Manchester/Collaborations">Collaborations</a></li>
 +
<li><a href="https://2018.igem.org/Team:Manchester/Cheesemaking">Cheese Making</a><li>
 +
         
 +
            </ul>
 +
          </li>
 +
 +
         
 +
 +
          <li class="dropdown dropdown5">
 +
            <a class="dropdown-toggle active dropdowntextcenter" href="https://2018.igem.org/Team:Manchester/Experiments">WET LAB<span class="caret"></span></a>
 +
            <ul class="dropdown-menu" style="left:0;">
 +
              <li><a href="https://2018.igem.org/Team:Manchester/InterLab">InterLab</a></li>
 +
              <li><a href="https://2018.igem.org/Team:Manchester/Experiments">Experiments</a></li>
 +
              <li><a href="https://2018.igem.org/Team:Manchester/Protocols">Protocols</a><li>
 +
              <li><a href="https://2018.igem.org/Team:Manchester/LabBook">Lab Book</a><li>
 +
          <li><a href="https://2018.igem.org/Team:Manchester/Parts">Parts</a></li>
 +
 +
       
 +
             
 +
            </ul>
 +
          </li>
 +
 +
 +
          <li class="dropdown dropdown15">
 +
            <a class="dropdown-toggle active dropdowntextcenter" href="https://2018.igem.org/Team:Manchester/Model">DRY LAB<span class="caret"></span></a>
 +
            <ul class="dropdown-menu">
 +
                <li> <a href="https://2018.igem.org/Team:Manchester/PromoterModel">Promoter Tool</a></li>
 +
                <li> <a href="https://2018.igem.org/Team:Manchester/Model">Experimental Model</a><li>
 +
            </ul>
 +
          </li>
 +
 +
          <li class="dropdown dropdown5">
 +
            <a class="dropdown-toggle active dropdowntextcenter" href="">HUMAN PRACTICES<span class="caret"></span></a>
 +
            <ul class="dropdown-menu" style="text-align: right;"></li>
 +
            <li> <a href="https://2018.igem.org/Team:Manchester/Human_Practices">Integrated Human Practices</a></li>
 +
              <li><a href="https://2018.igem.org/Team:Manchester/Public_Engagement">Outreach</a></li>
 +
<li><a href="https://2018.igem.org/Team:Manchester/Burtscheese">Burt's cheese</a></li>
 +
 +
<li><a href="https://2018.igem.org/Team:Manchester/Rokiskiosuris">Rokiškio sūris</a></li>
 +
           
 +
              <li><a href="https://2018.igem.org/Team:Manchester/News">News Feed analysis</a></li>
 +
              <li><a href="https://2018.igem.org/Team:Manchester/Brexit">GMO's and Brexit</a></li>
 +
              <li><a href="https://2018.igem.org/Team:Manchester/EU">European Commission</a></li>
 +
             
 +
         
 +
          </ul>
 +
          </li>
 +
 +
          <li class="dropdown dropdown5">
 +
            <a class="dropdown-toggle active dropdowntextcenter" href="https://2018.igem.org/Team:Manchester/Team">TEAM<span class="caret"></span></a>
 +
            <ul class="dropdown-menu" style="left:0;">
 +
                <li><a href="https://2018.igem.org/Team:Manchester/Team">The Team</a></li>
 +
                <li><a href="https://2018.igem.org/Team:Manchester/Attributions">Attributions</a></li>
 +
 +
            </ul>
 +
          </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>

Latest revision as of 23:48, 17 October 2018

HOME
PROJECT
Project Description
Results
Collaborations
Cheese Making
WET LAB
InterLab
Experiments
Protocols
Lab Book
Parts
DRY LAB
Promoter Tool
Experimental Model
HUMAN PRACTICES
Intergrated Human Practices
Outreach
Burt's Cheese
Rokiškio sūris
News Feed Analysis
Gmo's and Brexit
European Commission
TEAM