Difference between revisions of "Template:Uppsala/Navbar"

 
(45 intermediate revisions by 3 users not shown)
Line 1: Line 1:
 
<html>
 
<html>
 
<head>   
 
<head>   
−
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
 
 
<link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">
 
<link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">
−
 
+
<link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">
−
 
+
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Roboto+Slab" >
 +
<link rel="stylesheet" type="text/css" href="https://2017.igem.org/Template:Uppsala/Bootstrap.css">
 
<style>
 
<style>
 +
html, body {
 +
    font-size: 1vh !important;
 +
}
 
.handsy li {cursor:pointer;}
 
.handsy li {cursor:pointer;}
−
.nav {
+
nav {
 
       font-family: "Raleway";
 
       font-family: "Raleway";
 +
      margin-top:10px;
 +
      font-size: 2em;
 
}
 
}
 +
 +
 +
 +
/* Fix top panel Bootstrap issues. Patch by iGEM Stockholm 2015. Include this stylesheet in your header, after Bootstrap, to restore the original style to the top menu.*/
 +
       
 +
        top_menu_14,
 +
        #top_menu_under,
 +
        #top_menu_inside {
 +
            box-sizing: initial;
 +
        }
 +
       
 +
        top_menu_inside {
 +
            margin-left: 20px;
 +
        }
 +
       
 +
        bars_box,
 +
        #menu_BarsBox,
 +
        h5 {
 +
            -webkit-box-sizing: initial;
 +
            box-sizing: initial;
 +
            line-height: normal;
 +
        }
 +
       
 +
        menu_BarsBox > h5 {
 +
            color: rgb(0, 0, 0);
 +
            font-family: arial, sans-serif;
 +
            font-size: 1em;
 +
            line-height: normal;
 +
            margin-bottom: 0px;
 +
            margin-top: 0px;
 +
            font-weight: bold;
 +
        }
 +
       
 +
        .accordion-content li {
 +
            -height: 18px;
 +
            -webkit-box-sizing: initial;
 +
            box-sizing: initial;
 +
        }
 +
       
 +
        .accordion-header,
 +
        .active-header,
 +
        .accordion-header_noaction {
 +
            -webkit-box-sizing: initial;
 +
            box-sizing: initial;
 +
            color: rgb(101, 100, 89);
 +
            font-family: Arial, Gadget, sans-serif;
 +
            font-size: 1.5em;
 +
            font-weight: bold;
 +
            line-height: normal;
 +
            margin: 0;
 +
        }
 +
 +
 +
#sideMenu, #top_title {
 +
  display:none;
 +
}
 +
 +
 +
#sideMenu {
 +
  width: 200px;
 +
  position: fixed;
 +
}
 +
 +
#content {
 +
width: 100% !important;
 +
padding:0px;
 +
margin-top:-7px;
 +
margin: auto;
 +
}
 +
     
 +
.expand_Submenus { height:30px |!important;}
 +
 +
.menuDisplay.MainPage_menu.main.expand_Submenu { height: 30px |!important;}
 +
{
 +
width: 170 |!important;
 +
}
 +

 +
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
 +
 +
<!-- Blog stuff -->
 +
.blog-header {
 +
  padding-top: 20px;
 +
  padding-bottom: 20px;
 +
}
 +
#blog_page .blog-title {
 +
  margin-top: 30px;
 +
  margin-bottom: 0;
 +
  font-size: 2em;
 +
  color: #34495e;
 +
  font-weight: normal;
 +
}
 +
.blog-description {
 +
  font-size: 1.8em;
 +
  color: #999;
 +
}
 +
 +
/* Sidebar modules for boxing content */
 +
.sidebar-module {
 +
  padding: 15px;
 +
  margin: 0 -15px 15px;
 +
}
 +
.sidebar-module-inset {
 +
  padding: 15px;
 +
  background-color: #f5f5f5;
 +
  border-radius: 4px;
 +
}
 +
.sidebar-module-inset p:last-child,
 +
.sidebar-module-inset ul:last-child,
 +
.sidebar-module-inset ol:last-child {
 +
  margin-bottom: 0;
 +
}
 +
 +
/*
 +
* Blog posts
 +
*/
 +
 +
.blog-post {
 +
  margin-bottom: 60px;
 +
}
 +
.blog-post-title {
 +
  margin-bottom: 5px;
 +
  font-size: 3em;
 +
}
 +
.blog-post-meta {
 +
  margin-bottom: 20px;
 +
  color: #999;
 +
}
 +
 +
 +
 
</style>
 
</style>
 +
<script>
 +
 +
 +
// This is the jquery part of your template. 
 +
// Try not modify any of this code too much since it makes your menu work.
 +
 +
$(document).ready(function() {
 +
 +
$("#HQ_page").attr('id','');
 +
 +
// call the functions that control the menu
 +
menu_functionality();
 +
hide_show_menu();
 +
 +
 +
 +
//this function controls the expand and collapse buttons of the menu and changes the +/- symbols
 +
function menu_functionality() {
 +
 +
//when clicking on a "menu_button", it will change the "+/-" accordingly and it will show/hide the corresponding submenu
 +
$(".menu_button").click(function(){
 +
 +
// add or remove the class "open" , this class holds the "-"
 +
$(this).children().toggleClass("open");
 +
// show or hide the submenu
 +
$(this).next('.submenu_wrapper').fadeToggle(400);
 +
});
 +
 +
// when the screen size is smaller than 800px, the display_menu_control button appears and will show/hide the whole menu
 +
$("#display_menu_control").click(function(){
 +
$('#menu_content').fadeToggle(400);
 +
});
 +
 +
// call the current page highlight function
 +
highlight_current_page();
 +
}
 +
 +
 +
// call the highlight current page function to show it on the menu with a different background color
 +
function highlight_current_page() {
 +
 +
// select a page from the menu based on the id assigned to it and the current page name and add the class "current page" to make it change background color
 +
$("#"+  wgPageName.substring(wgPageName.lastIndexOf("/")+1, wgPageName.length ) + "_page").addClass("current_page");
 +
 +
// now that the current_page class has been added to a menu item, make the submenu fade in
 +
$(".current_page").parents(".submenu_wrapper").fadeIn(400);
 +
// change the +/- symbol of the corresponding menu button
 +
$(".current_page").parents(".submenu_wrapper").prev().children().toggleClass("open");
 +
 +
}
 +
 +
 +
 +
// allow button on the black menu bar to show/hide the side menu
 +
function hide_show_menu() {
 +
 +
// in case you preview mode is selected, the menu is hidden for better visibility
 +
if (window.location.href.indexOf("submit") >= 0) {
 +
$(".igem_menu_wrapperr").hide();
 +
}
 +
 +
// if the black menu bar has been loaded
 +
  if (document.getElementById('bars_item')) {
 +
 +
// when the "bars_item" has been clicked
 +
$("#bars_item").click(function() {
 +
$("#sideMenu").hide();
 +
 +
// show/hide the menu wrapper
 +
$(".igem_menu_wrapper").fadeToggle("100");
 +
});
 +
  }
 +
 +
// because the black menu bars loads at a different time than the rest of the page, this function is set on a time out so it can run again in case it has not been loaded yet
 +
else {
 +
    setTimeout(hide_show_menu, 15);
 +
, }
 +
}
 +
 +
 +
});
 +
 +
 +
</script>
 +
<script src="https://2017.igem.org/Template:Uppsala/Script?action=raw&ctype=text/javascript"></script> 
  
 
</head>
 
</head>
−
<body>
 
  
−
<nav class="navbar navbar-inverse navbar-fixed-top handsy">
+
<body>
 +
<nav class="navbar navbar-inverse navbar-fixed-top handsy" >
 
   <div class="container-fluid">
 
   <div class="container-fluid">
−
     <div class="navbar-header">
+
     <div class="navbar-header" >
−
       <a class="navbar-left" href="#"><img src="https://static.igem.org/mediawiki/2017/6/67/Uppsala_navbar_logo.png" class="img.responsive" style="padding:5px 5px 0px 5px;"></a>
+
    <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-left" href="#"><img src="https://static.igem.org/mediawiki/2017/6/67/Uppsala_navbar_logo.png"  
 +
      class="img.responsive" style="padding:5px 5px 0px 5px;"></a>
 
     </div>
 
     </div>
−
     <ul class="nav navbar-nav pull-right">
+
<div class="collapse navbar-collapse" id="myNavbar">
−
       <li class="active"><a href="https://2017.igem.org/Team:Uppsala">Home</a></li>
+
     <ul class="nav navbar-nav pull-right" style="align:center !important;">
 +
       <li ><a href="https://2017.igem.org/Team:Uppsala">Home</a></li>
 
       <li class="dropdown">
 
       <li class="dropdown">
−
       <a class="dropdown-toggle" data-toggle="dropdown">Team
+
       <a class="dropdown-toggle" data-toggle="dropdown" role= "button">Team
 
       <span class="caret"></span></a>
 
       <span class="caret"></span></a>
 
       <ul class="dropdown-menu">
 
       <ul class="dropdown-menu">
 
       <li><a href="https://2017.igem.org/Team:Uppsala/Team">Team</a></li>
 
       <li><a href="https://2017.igem.org/Team:Uppsala/Team">Team</a></li>
 
       <li><a href="https://2017.igem.org/Team:Uppsala/Collaborations">Collaborations</a></li>
 
       <li><a href="https://2017.igem.org/Team:Uppsala/Collaborations">Collaborations</a></li>
 +
        <li><a href="https://2017.igem.org/Team:Uppsala/Attributions">Attributions</a></li>
 
       </ul>
 
       </ul>
 
       </li>
 
       </li>
Line 36: Line 264:
 
       <li><a href="https://2017.igem.org/Team:Uppsala/Description">Description</a></li>
 
       <li><a href="https://2017.igem.org/Team:Uppsala/Description">Description</a></li>
 
       <li><a href="https://2017.igem.org/Team:Uppsala/Design">Design</a></li>
 
       <li><a href="https://2017.igem.org/Team:Uppsala/Design">Design</a></li>
−
         <li><a href="https://2017.igem.org/Team:Uppsala/Experiments">Experiments</a></li>
+
         <li><a href="https://2017.igem.org/Team:Uppsala/CrocinPathway">Crocin Pathway</a></li>
−
         <li><a href="https://2017.igem.org/Team:Uppsala/Notebook">Notebook</a></li>
+
         <li><a href="https://2017.igem.org/Team:Uppsala/Zea-Strain">Zea-Strain</a></li>
−
        <li><a href="https://2017.igem.org/Team:Uppsala/InterLab">InterLab</a></li>
+
         <li><a href="https://2017.igem.org/Team:Uppsala/Model">Modeling</a></li>
−
        <li><a href="https://2017.igem.org/Team:Uppsala/Contribution">Contribution</a></li>
+
         <li><a href="https://2017.igem.org/Team:Uppsala/Parts">Parts</a></li>
−
         <li><a href="https://2017.igem.org/Team:Uppsala/Model">Model</a></li>
+
         </ul>
−
         <li><a href="https://2017.igem.org/Team:Uppsala/Results">Results</a></li>
+
−
         <li><a href="https://2017.igem.org/Team:Uppsala/Demonstrate">Demonstrate</a></li>
+
−
        <li><a href="https://2017.igem.org/Team:Uppsala/Improve">Improve</a></li>
+
−
        <li><a href="https://2017.igem.org/Team:Uppsala/Attributions">Attributions</a></li>
+
−
      </ul>
+
 
       </li>
 
       </li>
−
      <li><a href="https://2017.igem.org/Team:Uppsala/Safety">Safety</a></li>
 
 
       <li class="dropdown">
 
       <li class="dropdown">
 
       <a class="dropdown-toggle" data-toggle="dropdown">Human Practices
 
       <a class="dropdown-toggle" data-toggle="dropdown">Human Practices
 
       <span class="caret"></span></a>
 
       <span class="caret"></span></a>
 
       <ul class="dropdown-menu">
 
       <ul class="dropdown-menu">
−
       <li><a href="https://2017.igem.org/Team:Uppsala/HP/Silver">Silver HP</a></li>
+
       <li><a href="https://2017.igem.org/Team:Uppsala/HP/Silver">Human Practices</a></li>
−
       <li><a href="https://2017.igem.org/Team:Uppsala/HP/Gold_Integrated">Integrated and Gold HP</a></li>
+
       <li><a href="https://2017.igem.org/Team:Uppsala/HP/Gold_Integrated">Ethics-Gold HP</a></li>
 
         <li><a href="https://2017.igem.org/Team:Uppsala/Engagement">Engagement</a></li>
 
         <li><a href="https://2017.igem.org/Team:Uppsala/Engagement">Engagement</a></li>
 +
        <li><a href="https://2017.igem.org/Team:Uppsala/Entrepreneurship">Market Analysis</a></li>
 
         </ul>
 
         </ul>
 
       </li>
 
       </li>
 
       <li class="dropdown">
 
       <li class="dropdown">
−
       <a class="dropdown-toggle" data-toggle="dropdown">Awards
+
       <a class="dropdown-toggle" data-toggle="dropdown">Results
 
       <span class="caret"></span></a>
 
       <span class="caret"></span></a>
 
       <ul class="dropdown-menu">
 
       <ul class="dropdown-menu">
−
       <li><a href="https://2017.igem.org/Team:Uppsala/Applied_Design">Applied Design</a></li>
+
       <li><a href="https://2017.igem.org/Team:Uppsala/Results">Results</a></li>
−
       <li><a href="https://2017.igem.org/Team:Uppsala/Entrepreneurship">Entrepreneurship</a></li>
+
       <li><a href="https://2017.igem.org/Team:Uppsala/Demonstrate">Demonstrate</a></li>
−
         <li><a href="https://2017.igem.org/Team:Uppsala/Hardware">Hardware</a></li>
+
         <li><a href="https://2017.igem.org/Team:Uppsala/Medals">Medals</a></li>
−
        <li><a href="https://2017.igem.org/Team:Uppsala/Measurement">Measurement</a></li>
+
            </ul></li>
−
         <li><a href="https://2017.igem.org/Team:Uppsala/Model">Model</a></li>
+
     
−
        <li><a href="https://2017.igem.org/Team:Uppsala/Plant">Plant</a></li>
+
      <li><a href="https://2017.igem.org/Team:Uppsala/Portfolio">Portfolio</a></li>
−
        <li><a href="https://2017.igem.org/Team:Uppsala/Software">Software</a></li>
+
    <li class="dropdown">
−
         <li><a href="https://igem.org/2017_Judging_Form?team=Uppsala">Judging Form</a></li>
+
      <a class="dropdown-toggle" data-toggle="dropdown">Extended Work
−
        </ul>
+
      <span class="caret"></span></a>
−
      <li><a href="https://2017.igem.org/Team:Uppsala/Parts">Parts</a></li>
+
      <ul class="dropdown-menu">
 +
         <li><a href="https://2017.igem.org/Team:Uppsala/Hardware">Chipgineering2.0</a></li>
 +
      <li><a href="https://2017.igem.org/Team:Uppsala/InterLab">InterLab</a></li>
 +
      <li><a href="https://2017.igem.org/Team:Uppsala/Improve">Improve</a></li>
 +
         <li><a href="https://2017.igem.org/Team:Uppsala/Contribution">Contributions</a></li>
 +
            </ul></li>
 +
        <li><a href="https://2017.igem.org/Team:Uppsala/Safety">Safety</a></li>
 
     </li>
 
     </li>
 
   </div>
 
   </div>
 +
</div>
 
</nav>
 
</nav>
 
</body>
 
</body>
 
</html>
 
</html>

Latest revision as of 22:05, 1 November 2017