Difference between revisions of "Template:Uppsala/Navbar"

Line 16: Line 16:
 
}
 
}
  
−
  /* when the page size is bigger than 800px, this show/hide control is hidden by default */
+
   
−
nav #display_menu_control {
+
−
display:none;
+
−
text-align:center;
+
−
}
+
  
 
/* 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.*/
 
/* 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.*/
Line 148: Line 144:
  
  
−
nav .menu_button {
 
−
width: 50%;
 
−
padding: 10px 0px 10px 15px;
 
−
float:right;
 
−
border-bottom: 1px solid #4d4d4d;
 
−
font-size: 2vh !important;
 
−
font-weight: bold;
 
−
color: #5e5f5f;
 
−
cursor: pointer;
 
−
}
 
−
nav .menu_button .expand_collapse_icon {
 
−
width:100%;
 
−
float:left;
 
−
}
 
−
 
−
nav .menu_button .expand_collapse_icon::before {
 
−
content: "+"; 
 
−
}
 
−
 
−
.open::before {
 
−
content: "-" !important; 
 
−
}
 
−
/* styling for the menu buttons on hover */
 
−
nav .menu_button:hover, {
 
−
background-color: #3399ff;
 
−
text-decoration: none;
 
−
color:#ffffff;
 
−
}
 
−
 
−
 
−
/* IF THE SCREEN IS LESS THAN 1200PX */
 
−
@media only screen and (max-width: 1200px) {
 
−
 
−
nav #display_menu_control { display:none; }
 
−
#menu_content { display:block;}
 
−
.menu_button.direct_to_page {padding-left: 17px;}
 
−
 
−
}
 
−
 
−
/* IF THE SCREEN IS LESS THAN 800PX */
 
−
@media only screen and (max-width: 800px) {
 
−
 
−
nav { width:100%; height: 15%; position:relative; left:0%;}
 
−
nav #display_menu_control { display:block; }
 
−
#menu_content { display:none;}
 
−
nav .menu_button .expand_collapse_icon { width: 5%; }
 
−
.menu_bottom_padding {display:none;}
 
−
 
−
}
 
−
   
 
  
 
</style>
 
</style>
Line 258: Line 204:
 
// in case you preview mode is selected, the menu is hidden for better visibility  
 
// in case you preview mode is selected, the menu is hidden for better visibility  
 
if (window.location.href.indexOf("submit") >= 0) {
 
if (window.location.href.indexOf("submit") >= 0) {
−
$(".navbar").hide();
+
$(".igem_menu_wrapperr").hide();
 
}
 
}
  
Line 269: Line 215:
  
 
// show/hide the menu wrapper
 
// show/hide the menu wrapper
−
$(".navbar").fadeToggle("100");
+
$(".igem_menu_wrapper").fadeToggle("100");
 
});
 
});
 
   }  
 
   }  
Line 289: Line 235:
  
 
<body>
 
<body>
−
<nav class="navbar navbar-inverse navbar-fixed-top handsy" id="navbar" >
+
<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" >

Revision as of 17:47, 1 November 2017