Difference between revisions of "Template:UANL/navbar"

(Created page with "<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awe...")
 
Line 1: Line 1:
<!DOCTYPE html>
 
 
<html>
 
<html>
<head>
+
<script>
<meta name="viewport" content="width=device-width, initial-scale=1">
+
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+
<style>
+
body {
+
  font-family: Arial, Helvetica, sans-serif;
+
  margin: 0;
+
}
+
  
.navbar {
+
$(document).ready(function() {
  overflow: hidden;
+
  background-color: #333;
+
}
+
  
.navbar a {
+
$("#HQ_page").attr('id','');
  float: left;
+
  font-size: 16px;
+
  color: white;
+
  text-align: center;
+
  padding: 14px 16px;
+
  text-decoration: none;
+
  width: 10%;
+
}
+
  
.subnav {
+
//highlight current page on the menu
  float: left;
+
highlight_current_page_menu();
  overflow: hidden;
+
}
+
//accessing submenus
 +
$(".menu_item").click(function(){
 +
$(".submenu_control_icon", this).toggleClass("open");
 +
$(this).next(".submenu").fadeToggle(400);
 +
});
 +
 +
//mobile menu access
 +
$(".igem_2018_team_mobile_bar").click(function(){
 +
$(this).next().toggleClass("displaying_menu");
 +
});
 +
 +
});
  
.subnav .subnavbtn {
 
  font-size: 16px; 
 
  border: none;
 
  outline: none;
 
  color: white;
 
  padding: 14px 16px;
 
  background-color: inherit;
 
  font-family: inherit;
 
  margin: 0;
 
}
 
  
.navbar a:hover, .subnav:hover .subnavbtn {
+
function highlight_current_page_menu() {
  background-color: red;
+
}
+
var page_url="https://2018.igem.org/";
 +
page_url = page_url + wgPageName;
 +
$("a[href$='"+ page_url +"']").children().addClass("current_page");
 +
 +
//if the page is in a submenu, open the submenu and make the appropiate changes
 +
if( $( ".current_page" ).hasClass( "submenu_item" )){
 +
 +
$(".current_page").parent().parent().fadeToggle(400);
 +
$(".current_page").parent().parent().prev().addClass("current_page");
 +
$(".menu_item.current_page > .submenu_control_icon").toggleClass("open");
 +
 +
}
 +
}
  
.subnav-content {
+
 
 +
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
 +
</script>
 +
 
 +
 
 +
<!------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
 +
<!--- THIS IS WHERE THE HTML BEGINS --->
 +
<!------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
 +
 
 +
<head>
 +
  <meta charset="UTF-8">
 +
  <meta http-equiv="x-ua-compatible" content="ie=edge">
 +
  <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=1, minimum-scale=1, maximum-scale=2.5" />
 +
  <!-- Title, Description -->
 +
  <title>Wiki</title>
 +
  <meta name="description" content="UPF CRG Barcelona 2018">
 +
  <!-- Open Graph Metadata -->
 +
  <meta property="og:url" content="" /> <!-- PAGE URL -->
 +
  <meta property="og:type" content="website" /> <!-- TYPE -->
 +
  <meta property="og:title" content="" /> <!-- TITLE -->
 +
  <meta property="og:description" content="" /> <!-- DESCRIPTION-->
 +
  <meta property="og:image" content="" /> <!-- IMAGE URL -->
 +
 
 +
</head>
 +
 
 +
<style>
 +
.mw-body {
 +
  width: 100% !important;
 +
  padding: 0 !important;
 +
  margin: 0 !important;
 +
}
 +
#top_title {
 
   display: none;
 
   display: none;
  position: absolute;
 
  left: 0;
 
  background-color: red;
 
  width: 100%;
 
  z-index: 1;
 
 
}
 
}
  
.subnav-content a {
+
    a {
  float: left;
+
      text-decoration: none !important;
  color: white;
+
      -webkit-tap-highlight-color: transparent;
  text-decoration: none;
+
      p {
 +
        text-decoration: none !important;
 +
      }
 +
    }
 +
:focus {
 +
    outline: none !important;
 
}
 
}
  
.subnav-content a:hover {
+
p, ol>li, .container>div>ul>li {
   background-color: #eee;
+
   font-size: 1rem;
  color: black;
+
 
}
 
}
  
.subnav:hover .subnav-content {
+
a:visited, a:hover, a:active, a:link {
   display: block;
+
   color: inherit;
 
}
 
}
 +
 +
@media screen and (min-width: 400px) {
 +
 +
  .container,
 +
  .container-centered,
 +
  main {
 +
    padding: 0;
 +
  }
 +
}
 +
 
</style>
 
</style>
</head>
 
<body>
 
  
<div class="navbar">
+
<!------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
  <a href="https://2019.igem.org/Team:UANL">E.Compa</a>
+
<!--- Content of the page  --->
  <div class="subnav">
+
<!------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
    <button class="subnavbtn">Project</button>
+
    <div class="subnav-content">
+
      <a href="https://2019.igem.org/Team:UANL/Description">Description</a>
+
    </div>
+
  </div>
+
  <div class="subnav">
+
    <button class="subnavbtn">Team</button>
+
    <div class="subnav-content">
+
      <a href="https://2019.igem.org/Team:UANL/Team">Members</a>
+
      <a href="https://2019.igem.org/Team:UANL/Attributions">Attribution</a>
+
      <a href="https://2019.igem.org/Team:UANL/Collaborations">Collab</a>
+
      <a href="https://2019.igem.org/Team:UANL/Contact" target="_blank">Contact°</a>
+
    </div>
+
  </div>
+
  <div class="subnav">
+
    <button class="subnavbtn">Dry Lab</button>
+
    <div class="subnav-content">
+
      <a href="https://2019.igem.org/Team:UANL/Design">Design</a>
+
      <a href="https://2019.igem.org/Team:UANL/Simulations">Simulations°</a>
+
      <a href="https://2019.igem.org/Team:UANL/Model">Math model</a>
+
      <a href="https://2019.igem.org/Team:UANL/Circuit">Circuit°</a>
+
      <a href="https://2019.igem.org/Team:UANL/Improve">Improve</a>
+
      <a href="https://2019.igem.org/Team:UANL/Parts">Parts Overview</a>
+
  <a href="https://2019.igem.org/Team:UANL/Basic_Part">Basic Parts</a>
+
      <a href="https://2019.igem.org/Team:UANL/Composite_Part">Composite Part</a>
+
      <a href="https://2019.igem.org/Team:UANL/Part_Collection">Part Collection</a>
+
    </div>
+
  </div>
+
  <div class="subnav">
+
    <button class="subnavbtn">Wet Lab</button>
+
    <div class="subnav-content">
+
      <a href="https://2019.igem.org/Team:UANL/Experiments">Experiments</a>
+
      <a href="https://2019.igem.org/Team:UANL/Results">Results</a>
+
      <a href="https://2019.igem.org/Team:UANL/Demonstrate">Demostrate</a>
+
      <a href="https://2019.igem.org/Team:UANL/Contribution">Contribution</a>
+
      <a href="https://2019.igem.org/Team:UANL/Notebook">Notebook</a>
+
    </div>
+
  </div>
+
  <div class="subnav">
+
    <button class="subnavbtn">Safety</button>
+
    <div class="subnav-content">
+
      <a href="https://2019.igem.org/Team:UANL/Safety">Safety</a>
+
      <a href="https://2019.igem.org/Team:UANL/Safety">Save Switch</a>
+
    </div>
+
  </div>
+
  <div class="subnav">
+
    <button class="subnavbtn">Human Practices</button>
+
    <div class="subnav-content">
+
      <a href="https://2019.igem.org/Team:UANL/Human_Practices">Human Practices</a>
+
      <a href="https://2019.igem.org/Team:UANL/Public_Engagement">Education</a>
+
    </div>
+
  </div>
+
  <div class="subnav">
+
    <button class="subnavbtn">Entrepreneur</button>
+
    <div class="subnav-content">
+
      <a href="https://2019.igem.org/Team:UANL/Entrepreneurship">Entrepreneur</a>
+
    </div>
+
  </div>
+
  <div class="subnav">
+
    <button class="subnavbtn">Awards</button>
+
    <div class="subnav-content">
+
      <a href="https://igem.org/2019_Judging_Form?team=UANL">Judgy Form</a>
+
    </div>
+
  </div>
+
</div>
+
<img src="https://static.igem.org/mediawiki/2019/3/3c/Igem_mobile_menu_logo.svg">
+
</body>
+
</html>
+

Revision as of 14:07, 13 October 2019

Wiki