Difference between revisions of "Template:Queens Canada"

(added the proper nav items)
m
 
(111 intermediate revisions by 3 users not shown)
Line 1: Line 1:
 +
<html lang="en">
 +
<!--Custom Loader (uncomment this section to see the animation in action)-->
 +
<div class="loader-wrapper" id = loader-wrapper-id>
 +
  <div class="loader">
 +
    <div class="wave top-wave">
 +
      <div></div>
 +
      <div></div>
 +
      <div></div>
 +
      <div></div>
 +
      <div></div>
 +
      <div></div>
 +
      <div></div>
 +
      <div></div>
 +
      <div></div>
 +
      <div></div>
 +
      <div></div>
 +
      <div></div>
 +
    </div>
 +
    <div class="wave bottom-wave">
 +
      <div></div>
 +
      <div></div>
 +
      <div></div>
 +
      <div></div>
 +
      <div></div>
 +
      <div></div>
 +
      <div></div>
 +
      <div></div>
 +
      <div></div>
 +
      <div></div>
 +
      <div></div>
 +
      <div></div>
 +
    </div>
 +
  </div>
 +
</div>
 +
<script>
 +
    window.addEventListener("load", function () {
 +
    const loader = document.querySelector(".loader-wrapper");
 +
    loader.className += " hidden";
 +
    const e = document.getElementById("loader-wrapper-id");
 +
    e.addEventListener("animationend", (ev) => {
 +
        if (ev.type === "animationend") {
 +
            e.style.display: "none";
 +
        }
 +
    }, false);
 +
});
 +
</script>
 +
</html>
 +
 
{{Queens Canada/Scripts}}
 
{{Queens Canada/Scripts}}
 
{{Queens Canada/Styles}}
 
{{Queens Canada/Styles}}
 +
 
<html>  
 
<html>  
 
<!-- This will be the location for all common elements on the website -->
 
<!-- This will be the location for all common elements on the website -->
Line 6: Line 55:
 
     <meta charset="UTF-8">
 
     <meta charset="UTF-8">
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 +
    <script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
 
</head>
 
</head>
  
 
<body onresize = windowResize() onload = windowLoad()>
 
<body onresize = windowResize() onload = windowLoad()>
 
   <header>
 
   <header>
−
        <div id = nav>
+
−
            <div id = brand-elements>
+
  <nav class="navbar" id = to-nav>
−
                <a href = "path/to/homepage" title = "Go to Homepage">
+
    <a class="toggle-button" id="nav-icon" onclick = openMobileNav()>
−
                    <img id = logo-pic src = https://via.placeholder.com/250x100>
+
        <span class="bar" id = bar-1></span>
−
                </a>
+
<span class="bar" id = bar-2></span>
−
                <div id = open-close-nav> 
+
<span class="bar" id = bar-3></span>
−
                  <!-- <img id = nav-icon src = Resources/QGEM_Nav_Icon.png onclick = openNav()>
+
    </a>
−
                    <img id = close-nav-button src = Resources/QGEM_Close_Nav.png onclick = closeNav()>-->
+
   
−
                    <div id = nav-icon onclick = openNav() title = "Open Menu">| | |</div>
+
    <div class="navbar-links">
−
                    <div id = close-nav-button onclick = closeNav() title = "Close Menu">&times;</div>
+
<ul>
−
                </div>
+
            <div class="velcrion-logo navbar-brand" >
−
                <div id = social-links>
+
    <a class="navbar-brand" href="https://2020.igem.org/Team:Queens_Canada">
−
                    <h3>Check out our...</h3>
+
                <img src = "https://static.igem.org/mediawiki/2020/6/67/T--Queens_Canada--logos.png">
−
                    <a title = "Go to Instagram">Instagram</a>
+
            </a>
−
                    <a title = "Go to Facebook">Facebook</a>
+
−
                    <a title = "Go to LinkedIn">LinkedIn</a>
+
−
                </div>
+
 
             </div>
 
             </div>
−
            <div id = nav-elements>
+
    <li><a class="current" href="https://2020.igem.org/Team:Queens_Canada">HOME</a></li>
−
                <a class = nav-link href = "https://2020.igem.org/Team:Queens_Canada" title = "Go to Homepage">
+
            <!-- onclick = "" is added to the dropdown nav links as a workaround for hover on mobile -->
−
                    <div class = nav-item>
+
            <li class="dropdown" onclick = ""><a>PROJECT</a>
−
                        <h2 class = nav-text>Home</h2>
+
                 <ul class="dropdown-content">
−
                    </div>
+
                     <li><a href = "https://2020.igem.org/Team:Queens_Canada/Description">Description</a></li>
−
                </a>
+
                     <li><a href = "https://2020.igem.org/Team:Queens_Canada/Protein-Construct">Protein Construct</a></li>
−
 
+
                    <li><a href = "https://2020.igem.org/Team:Queens_Canada/FRET">FRET</a></li>
−
                 <div class = "drop-link nav-item" title = "Expand Project Menu" onclick = showSubmenu(2)>
+
                    <li><a href = "https://2020.igem.org/Team:Queens_Canada/Coiled-Coils">Coiled-Coils</a></li>
−
                     <h2 class = nav-text>Project</h2>
+
                    <li><a href = "https://2020.igem.org/Team:Queens_Canada/Binding-Proteins">Binding Proteins</a></li>
−
 
+
                    <li><a href = "https://2020.igem.org/Team:Queens_Canada/Implementation">Implementation</a></li>
−
                     <div class = submenu>
+
                    <li><a href = "https://2020.igem.org/Team:Queens_Canada/Results">Results</a></li>
−
                        <div class = sub-nav-item>
+
                     <li><a href = "https://2020.igem.org/Team:Queens_Canada/Contribution">Contribution</a></li>
−
                            <a class = sub-nav-link href = "https://2020.igem.org/Team:Queens_Canada/Description" title = "Go to Description">Description</a>
+
                 </ul>
−
                        </div>  
+
            </li>
−
                        <div class = sub-nav-item>
+
            <li class="dropdown" onclick = ""><a>HUMAN</a>
−
                            <a class = sub-nav-link href = "https://2020.igem.org/Team:Queens_Canada/Design" title = "Go to Design">Design</a>
+
                <ul class="dropdown-content">
−
                        </div>  
+
                    <li><a href = "https://2020.igem.org/Team:Queens_Canada/Human_Practices">Human Practices</a></li>
−
                        <div class = sub-nav-item>
+
                    <li><a href = "https://2020.igem.org/Team:Queens_Canada/Education">Education</a></li>
−
                            <a class = sub-nav-link href = "https://2020.igem.org/Team:Queens_Canada/Implementation" title = "Go to Proposed Implementation">Proposed Implementation</a>
+
                    <li><a href = "https://2020.igem.org/Team:Queens_Canada/Collaborations">Collaborations</a></li>
−
                        </div>  
+
                    <li><a href = "https://2020.igem.org/Team:Queens_Canada/Partnership">Partnership</a></li>
−
                     </div>
+
                     <li><a href = "https://2020.igem.org/Team:Queens_Canada/Safety">Safety</a></li>
−
                 </div>
+
                 </ul>
−
 
+
            </li>
−
                <div class = "drop-link nav-item" title = "Expand Team Menu" onclick = showSubmenu(1)>
+
            <li class="dropdown" onclick = ""><a>MODEL</a>
−
                    <h2 class = nav-text>Team</h2>
+
                <ul class="dropdown-content">
−
                   
+
                    <li><a href = "https://2020.igem.org/Team:Queens_Canada/Model">Overview</a></li>
−
                    <div class = submenu id = team-submenu>
+
                    <li><a href = "https://2020.igem.org/Team:Queens_Canada/Static-Dynamic">Protein Stability</a></li>
−
                        <a class = sub-nav-link href = "https://2020.igem.org/Team:Queens_Canada/Team" title = "Meet our team">Team Members</a>
+
                    <li><a href = "https://2020.igem.org/Team:Queens_Canada/Coiled-Coil-Stability">Coiled-Coil Stability</a>
−
                       
+
                    </li>
−
                        <a class = sub-nav-link href = "https://2020.igem.org/Team:Queens_Canada/Attributions" title = "Go to Attributions">Attributions</a>
+
                    <li><a href = "https://2020.igem.org/Team:Queens_Canada/Directed-Cysteine">Cysteine Modification</a></li>
−
                     </div>  
+
                    <li><a href = "https://2020.igem.org/Team:Queens_Canada/Software">Software</a></li>
−
                 </div>
+
                    <li><a href = "https://2020.igem.org/Team:Queens_Canada/Mutaguide">Mutaguide</a></li>
−
 
+
                 </ul>
−
                <div class = "drop-link nav-item" title = "Expand Results Menu" onclick = showSubmenu(1)>
+
            </li>
−
                    <h2 class = nav-text>Results</h2>
+
            <li class="dropdown" onclick = ""><a>PROTOTYPE</a>
−
                   
+
                <ul class="dropdown-content">
−
                    <div class = submenu>
+
                     <li><a href = "https://2020.igem.org/Team:Queens_Canada/Prototype-Overview">Overview</a></li>
−
                        <a class = sub-nav-link href = "https://2020.igem.org/Team:Queens_Canada/Model" title = "Go to Model">Model</a>
+
                     <li><a href = "https://2020.igem.org/Team:Queens_Canada/Fluorometer">Fluorometer</a></li>
−
                        <a class = sub-nav-link href = "https://2020.igem.org/Team:Queens_Canada/Hardware" title = "Go to Hardware">Hardware</a>
+
                    <li><a href = "https://2020.igem.org/Team:Queens_Canada/Fluid-Dynamics">Fluid Dynamics</a></li>
−
                        <a class = sub-nav-link href = "https://2020.igem.org/Team:Queens_Canada/Engineering" title = "Go to Engineering">Engineering Success</a>
+
                    <li><a href = "https://2020.igem.org/Team:Queens_Canada/App">Mobile App</a></li>
−
                        <a class = sub-nav-link href = "https://2020.igem.org/Team:Queens_Canada/Safety" title = "Go to Safety">Safety</a>
+
                </ul>
−
                        <a class = sub-nav-link href = "https://2020.igem.org/Team:Queens_Canada/Proof_of_Concept" title = "Go to Proof of Concept">Proof of Concept</a>
+
            </li>
−
                    </div>  
+
    <li class="dropdown" onclick = ""><a>PARTS</a>
−
                 </div>
+
                <ul class="dropdown-content">
−
               
+
                    <li><a href = "https://2020.igem.org/Team:Queens_Canada/Parts-Overview">Overview</a></li>
−
                <div class = "drop-link nav-item" title = "Expand Human Practices Menu" onclick = showSubmenu(1)>
+
                    <li><a href = "https://2020.igem.org/Team:Queens_Canada/Expression-Plasmid">Expression Plasmid</a></li>
−
                     <h2 class = nav-text>Human Practices</h2>
+
                    <li><a href = "https://2020.igem.org/Team:Queens_Canada/Purification-Summary">Purification Summary</a></li>
−
                   
+
                 </ul>
−
                     <div class = submenu>
+
            </li>
−
                        <a class = sub-nav-link href = "https://2020.igem.org/Team:Queens_Canada/Human_Practices" title = "Go to Human Practices">Integrated Human Practices</a>
+
            <li class="dropdown" onclick = ""><a>NOTEBOOK</a>
−
                        <a class = sub-nav-link href = "https://2020.igem.org/Team:Queens_Canada/Education" title = "Go to Education">Education</a>
+
                <ul class="dropdown-content">
−
                        <a class = sub-nav-link href = "https://2020.igem.org/Team:Queens_Canada/Engineering" title = "Go to Engineering">Engineering Success</a>
+
                    <li><a href = "https://2020.igem.org/Team:Queens_Canada/Protocols">Protocols</a></li>
−
                        <a class = sub-nav-link href = "https://2020.igem.org/Team:Queens_Canada/Partnership" title = "Go to Partnership">Partnership</a>
+
                     <li><a href = "https://2020.igem.org/Team:Queens_Canada/Posters-Presentations">Posters and                                                  Presentations</a></li>
−
                    </div>  
+
                 </ul>
−
                 </div>
+
            </li>
−
               
+
            <li class="dropdown" onclick = ""><a>TEAM</a>
−
                <a class = nav-link href = "https://2020.igem.org/Team:Queens_Canada/Contribution" title = "Go to Contribution">
+
                <ul class="dropdown-content">
−
                     <div class = nav-item>
+
                    <li><a href = "https://2020.igem.org/Team:Queens_Canada/Team">Team Members</a></li>
−
                        <h2 class = nav-text>Contribution</h2>
+
                    <li><a href = "https://2020.igem.org/Team:Queens_Canada/Sponsors">Our Sponsors</a></li>
−
                    </div>
+
                     <li><a href = "https://2020.igem.org/Team:Queens_Canada/Attributions">Attributions</a></li>
−
                 </a>
+
                 </ul>
−
 
+
             </li>
−
                <a class = nav-link href = "https://2020.igem.org/Team:Queens_Canada/Entrepreneurship" title = "Go to Entrepreneurship">
+
</ul>
−
                     <div class = nav-item>
+
    </div>
−
                        <h2 class = nav-text>Entrepreneurship</h2>
+
−
                    </div>
+
  </nav>
−
                 </a>
+
       
−
             </div>
+
−
        </div>      
+
−
 
+
−
 
+
 
   </header>
 
   </header>
 
</body>
 
</body>
−
 
−
 
−
 
  
 
</html>
 
</html>

Latest revision as of 01:36, 28 October 2020