Difference between revisions of "Template:British Columbia/Header"

 
(45 intermediate revisions by the same user not shown)
Line 1: Line 1:
−
<!DOCTYPE html>
 
−
 
 
<html>
 
<html>
−
<head>
+
<meta charset="UTF-8">
−
  <title>Cascading Menus</title>
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
−
  <meta charset="utf-8">
+
<style>
  
−
  <!-- internal styles -->
+
html,body {font-family: GeosansLight; margin-top:-1.5px !important; border:0 !important;}
−
  <style>
+
−
 
+
  
−
  </style>
+
.dropbtn {
−
</head>
+
    background-color: #D9EDEB;
 +
    color: #808080;
 +
    padding: 30px 20px;
 +
    font-family:GeosansLight;
 +
    font-size: 18px;
 +
    letter-spacing: 1.5px;
 +
    -webkit-text-stroke: 0.9px;
 +
    border: 0;
 +
    margin-top: -1.5px;
 +
    height: 80px;
 +
}
 +
 
 +
.dropdown {
 +
    position: relative;
 +
    display: inline-block;
 +
    float: right;
 +
}
 +
 
 +
.dropdown-content {
 +
    display: none;
 +
    position: absolute;
 +
    background-color: #45827A;
 +
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
 +
}
 +
 
 +
.dropdown-content a {
 +
    color: white !important;
 +
    font-family: GeosansLight;
 +
    font-size: 17px;
 +
    letter-spacing: 1px;
 +
    padding: 6px 16px;
 +
    text-decoration: none !important;
 +
    display: block;
 +
    width:160px;
 +
    font-weight:normal !important;
 +
}
 +
 
 +
.dropdown-content a:hover {background-color: #22645B; -webkit-text-stroke: 0.8px;}
 +
 
 +
.dropdown:hover .dropdown-content {
 +
    display: block;
 +
}
 +
 
 +
.dropdown:hover .dropbtn {
 +
    background-color: #C4DFDD; color: black;
 +
} 
 +
 
 +
 
 +
</style>
 
<body>
 
<body>
  
−
<ul id="dropdown">
+
 
−
  <li><a href="#">hyperlink 1</a>
+
 
−
      <ul class="sub1">
+
<div class="dropdown">
−
          <li><a href="#">hyperlink 1.1</a></li>
+
  <button class="dropbtn">ACHIEVEMENTS</button>
−
          <li><a href="#">hyperlink 1.2</a></li>
+
</div>
−
          <li><a href="#">hyperlink 1.3</a></li>
+
 
−
          <li><a href="#">hyperlink 1.4</a></li>
+
<div class="dropdown">
−
      </ul>
+
  <button class="dropbtn">NOTEBOOK&#9662;</button>
−
  </li>
+
<div class="dropdown-content">
−
  <li><a href="#">hyperlink 2</a></li>
+
    <a href="#">PROTOCOLS</a>
−
  <li><a href="#">hyperlink 3</a>
+
    <a href="#">LAB BOOK</a>
−
      <ul class="sub1">
+
  </div>
−
          <li><a href="#">hyperlink 3.1</a></li>
+
</div>
−
          <li><a href="#">hyperlink 3.2</a></li>
+
 
−
          <li><a href="#">hyperlink 3.3</a></li>
+
<div class="dropdown">
−
          <li><a href="#">hyperlink 3.4</a></li>
+
  <button class="dropbtn">TEAM&#9662;</button>
−
      </ul>
+
  <div class="dropdown-content">
−
  </li>
+
    <a href="#">MEMBERS</a>
−
  <li><a href="#">hyperlink 4</a>
+
    <a href="#">ATTRIBUTIONS</a>
−
      <ul class="sub1">
+
    <a href="#">SPONSORS</a>
−
          <li><a href="#">hyperlink 4.1</a></li>
+
  </div>
−
          <li><a href="#">hyperlink 4.2</a></li>
+
</div>
−
          <li><a href="#">hyperlink 4.3</a></li>
+
 
−
          <li><a href="#">hyperlink 4.4</a></li>
+
<div class="dropdown">
−
      </ul>
+
  <button class="dropbtn"><img src=""/>HUMAN PRACTICES&#9662;</button>
−
  </li>
+
  <div class="dropdown-content">
−
  <li><a href="#">hyperlink 5</a>
+
    <a href="#">SILVER</a>
−
      <ul class="sub1">
+
    <a href="#">GOLD</a>
−
          <li><a href="#">hyperlink 5.1</a></li>
+
    <a href="#">EDUCATION & ENGAGEMENT</a>
−
          <li><a href="#">hyperlink 5.2</a></li>
+
    <a href="#">COLLABORATIONS</a>
−
          <li><a href="#">hyperlink 5.3</a></li>
+
  </div>
−
          <li><a href="#">hyperlink 5.4</a></li>
+
</div>
−
      </ul>
+
 
−
  </li>
+
<div class="dropdown">
−
</ul>
+
  <button class="dropbtn">MODEL</button>
 +
</div>
 +
 
 +
 
 +
<div class="dropdown">
 +
  <button class="dropbtn">PROJECT&#9662;</button>
 +
  <div class="dropdown-content">
 +
    <a href="https://2018.igem.org/Team:British_Columbia/Description">DESCRIPTION</a>
 +
    <a href="https://2018.igem.org/Team:British_Columbia/Naringenin">NARINGENIN</a>
 +
    <a href="https://2018.igem.org/Team:British_Columbia/Biosensor">BIOSENSOR</a>
 +
    <a href="https://2018.igem.org/Team:British_Columbia/Kaempferol">KAEMPFEROL</a>
 +
    <a href="https://2018.igem.org/Team:British_Columbia/Parts">PARTS</a>
 +
  </div>
 +
</div>
 +
 
 +
<div class="dropdown">
 +
  <button class="dropbtn"><img src="https://2018.igem.org/File:T--British_Columbia--general_logo.png" height=300px/></button>
 +
</div>
 +
 
 +
 
 +
 
 +
 
  
 
</body>
 
</body>
 
</html>
 
</html>

Latest revision as of 15:43, 20 August 2018

PROTOCOLS LAB BOOK
MEMBERS ATTRIBUTIONS SPONSORS
SILVER GOLD EDUCATION & ENGAGEMENT COLLABORATIONS
DESCRIPTION NARINGENIN BIOSENSOR KAEMPFEROL PARTS