Difference between revisions of "Template:MSU-Michigan/W3"

Line 184: Line 184:
 
.w3-border-black,.w3-hover-border-black:hover{border-color:#000!important}
 
.w3-border-black,.w3-hover-border-black:hover{border-color:#000!important}
 
.w3-border-grey,.w3-hover-border-grey:hover,.w3-border-gray,.w3-hover-border-gray:hover{border-color:#bbb!important}
 
.w3-border-grey,.w3-hover-border-grey:hover,.w3-border-gray,.w3-hover-border-gray:hover{border-color:#bbb!important}
 +
 +
<body>
 +
<!-- Navbar -->
 +
<div class="w3-top w3-padding-16">
 +
  <div class="w3-bar w3-black w3-card-2">
 +
    <a class="w3-bar-item w3-button w3-padding-large w3-hide-medium w3-hide-large w3-right" href="javascript:void(0)" onclick="myFunction()" title="Toggle Navigation Menu"><i class="fa fa-bars"></i></a>
 +
 +
<!-- Home Button -->
 +
    <a href="https://2017.igem.org/Team:MSU-Michigan" class="w3-bar-item w3-button w3-padding-large">Home</a>
 +
 +
<!-- Project Button -->
 +
    <div class="w3-dropdown-hover w3-hide-small">
 +
      <button class="w3-padding-large w3-button" title="Project">Project <i class="fa fa-caret-down"></i></button>   
 +
      <div class="w3-dropdown-content w3-bar-block w3-card-4">
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/Description" class="w3-bar-item w3-button">Description</a>
 +
<a href="https://2017.igem.org/wiki/index.php?title=Team:MSU-Michigan/Background" class="w3-bar-item w3-button">Background</a>
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/Design" class="w3-bar-item w3-button">Design</a>
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/Experiments" class="w3-bar-item w3-button">Experiments</a>
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/Notebook" class="w3-bar-item w3-button">Notebook</a>
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/InterLab" class="w3-bar-item w3-button">InterLab</a>
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/Contribution" class="w3-bar-item w3-button">Contribution</a>
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/Results" class="w3-bar-item w3-button">Results</a>
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/Demonstrate" class="w3-bar-item w3-button">Demonstrate</a>
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/Improve" class="w3-bar-item w3-button">Improve</a>
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/Attributions" class="w3-bar-item w3-button">Attributions</a>
 +
      </div>
 +
    </div>
 +
 +
<!-- Safety -->
 +
    <a href="https://www.youtube.com/watch?v=AjPau5QYtYs" class="w3-bar-item w3-button w3-padding-large w3-hide-small">Safety</a>
 +
 +
<!-- Human Practices -->
 +
    <div class="w3-dropdown-hover w3-hide-small">
 +
      <button class="w3-padding-large w3-button" title="Human Practices">Human Practices <i class="fa fa-caret-down"></i></button>   
 +
      <div class="w3-dropdown-content w3-bar-block w3-card-4">
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/Engagement" class="w3-bar-item w3-button">Engagement</a>
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/HP/Gold_Integrated" class="w3-bar-item w3-button">Gold Integrated</a>
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/HP/Silver" class="w3-bar-item w3-button">Silver</a>
 +
      </div>
 +
    </div>
 +
 +
<!-- Team Button  -->
 +
    <div class="w3-dropdown-hover w3-hide-small">
 +
      <button class="w3-padding-large w3-button" title="Team">Team <i class="fa fa-caret-down"></i></button>   
 +
      <div class="w3-dropdown-content w3-bar-block w3-card-4">
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/Team" class="w3-bar-item w3-button">Team</a>
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/Collaborations" class="w3-bar-item w3-button">Collaborations</a>
 +
      </div>
 +
    </div>
 +
 +
<!-- Parts Button -->
 +
    <div class="w3-dropdown-hover w3-hide-small">
 +
      <button class="w3-padding-large w3-button" title="Parts">Parts <i class="fa fa-caret-down"></i></button>   
 +
      <div class="w3-dropdown-content w3-bar-block w3-card-4">
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/Parts" class="w3-bar-item w3-button">Parts</a>
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/Basic_Part" class="w3-bar-item w3-button">Basic_Part</a>
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/Composite_Part" class="w3-bar-item w3-button">Composite_Part</a>
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/Part_Collection" class="w3-bar-item w3-button">Part_Collection</a>
 +
      </div>
 +
    </div>
 +
 +
<!-- Awards Button -->
 +
    <div class="w3-dropdown-hover w3-hide-small">
 +
      <button class="w3-padding-large w3-button" title="Awards">Awards <i class="fa fa-caret-down"></i></button>   
 +
      <div class="w3-dropdown-content w3-bar-block w3-card-4">
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/Applied_Design" class="w3-bar-item w3-button">Applied Design</a>
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/Entrepreneurship" class="w3-bar-item w3-button">Entrepreneurship</a>
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/Hardware" class="w3-bar-item w3-button">Hardware</a>
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/Measurement" class="w3-bar-item w3-button">Measurement</a>
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/Model" class="w3-bar-item w3-button">Model</a>
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/Plant" class="w3-bar-item w3-button">Plant</a>
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/Software" class="w3-bar-item w3-button">Software</a>
 +
      </div>
 +
    </div>
 +
 +
<!-- Proof of Concept Button  -->
 +
    <div class="w3-dropdown-hover w3-hide-small">
 +
      <button class="w3-padding-large w3-button" title="Team">Proof of Concept<i class="fa fa-caret-down"></i></button>   
 +
      <div class="w3-dropdown-content w3-bar-block w3-card-4">
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/GFP_Induction" class="w3-bar-item w3-button">IPTG Induction</a>
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/Current" class="w3-bar-item w3-button">Current Induction</a>
 +
        <a href="https://2017.igem.org/Team:MSU-Michigan/GFP_Microscopy" class="w3-bar-item w3-button">GFP Microscopy</a>
 +
      </div>
 +
    </div>
 +
</div>
 +
 +
 +
<style>
 +
#myDIV {
 +
    width: 100%;
 +
    padding: 50px 0;
 +
    text-align: center;
 +
    background-color: lightblue;
 +
    margin-top: 20px;
 +
}
 +
</style>
 +
<script>
 +
function myFunction() {
 +
    var x = document.getElementById("myDIV");
 +
    if (x.style.display === "none") {
 +
        x.style.display = "block";
 +
    } else {
 +
        x.style.display = "none";
 +
    }
 +
}
 +
</script>
 +
 +
<!-- Close Buttons and Header -->
 +
<a href="javascript:void(0)" class="w3-padding-large w3-hover-red w3-hide-small w3-right"><i class="fa fa-search"></i></a>
 +
<style>
 +
input[type=text] {
 +
    width: 130px;
 +
    box-sizing: border-box;
 +
    border: 2px solid #ccc;
 +
    border-radius: 4px;
 +
    font-size: 16px;
 +
    background-color: white;
 +
    background-image: url('javascript:void(0)');
 +
    background-position: 10px 10px;
 +
    background-repeat: no-repeat;
 +
    padding: 12px 20px 12px 40px;
 +
    -webkit-transition: width 0.4s ease-in-out;
 +
    transition: width 0.4s ease-in-out;
 +
}
 +
 +
input[type=text]:focus {
 +
    width: 100%;
 +
}
 +
</style>
 +
  </div>
 +
</div>
 +
 +
<!-- Navbar on small screens
 +
<div id="navDemo" class="w3-bar-block w3-black w3-hide w3-hide-large w3-hide-medium w3-top" style="margin-top:46px">
 +
  <a href="#band" class="w3-bar-item w3-button w3-padding-large">BAND</a>
 +
  <a href="#tour" class="w3-bar-item w3-button w3-padding-large">TOUR</a>
 +
  <a href="#contact" class="w3-bar-item w3-button w3-padding-large">CONTACT</a>
 +
  <a href="#" class="w3-bar-item w3-button w3-padding-large">MERCH</a>
 +
</div>
 +
 +
 +
<!-- Page content -->
 +
</div>
 +
<div class="w3-content" style="max-width:2000px;margin-top:46px">
 +
 +
<!-- End Page Content -->
 +
</div>
 +
</body>
 +
</html>

Revision as of 00:27, 17 October 2017