Difference between revisions of "Template:UFlorida/Menu"

Line 2: Line 2:
  
 
<head>
 
<head>
 
 
 
  <!-- External scripts -->
 
 
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,600'
 
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,600'
 
  rel='stylesheet' type='text/css'>
 
  rel='stylesheet' type='text/css'>
Line 12: Line 8:
 
   <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
 
   <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
 
   <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
 
   <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
 
  <!-- Functionallity and behaviour JS -->
 
  <script>
 
 
    $(document).ready(function(){
 
 
      //Loading screen functionallity
 
      $('.loading').animate(
 
          {opacity:0},
 
          500,
 
          function(){
 
            $('.loading').attr("style", "display:none");
 
          }
 
      );
 
 
      //Height responsiveness
 
      $(window).resize(function() {
 
          wheight = $(window).height();
 
          $('.container').attr("style","height:"+(wheight)+"px;background-size:cover;");
 
          $('.team-member-container').attr("style","height:"+wheight/2.7+"px;");
 
      });
 
 
      $(window).trigger('resize');
 
 
      //Menu moveto container on item click functionallity
 
      $('.menu-item').on('click', function(){
 
          $('.menu-item').removeClass('subselected');
 
          $(this).addClass('subselected');
 
          if($(this).attr("data")=="#top"){
 
              $('html, body').animate({
 
                  scrollTop: 0
 
              }, 1000);
 
          }else{
 
              $('html, body').animate({
 
                  scrollTop: $($(this).attr("data")).offset().top-70
 
              }, 1000);
 
          }
 
      });
 
 
      //Hover of team members
 
      $('.team-member-container').on('mouseenter', function(){
 
        $(this).children('.team-member-photo').attr("style", "background-image:url('"+$(this).attr("hover")+"');");
 
        $(this).on('mouseleave', function(){
 
          $(this).children('.team-member-photo').attr('style', "background-image:url('"+$(this).attr("data")+"');");
 
        });
 
      });
 
 
    });
 
   
 
  </script>
 
 
  <style>
 
 
 
#sideMenu, #top_title {display:none;}
 
#content { padding:0px; width:90%; margin-top:-7px; margin-left:5%;, margin-right: 5%}
 
body {background-color:white; }
 
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
 
 
 
    body,
 
    html{
 
      margin: 0;
 
      padding:0;
 
      font-family: font-family: 'Yanone Kaffeesatz', sans-serif;
 
    }
 
 
    /* REMOVE UNWANTED ELEMENTS AND STYLE OTHERS */
 
    .firstHeading{
 
      display:none;
 
    }
 
    #top-section{
 
      background:#48af5d;
 
      margin-left:0 !important;
 
      width:100%;
 
      left:0;
 
    }
 
 
 
    /* LOADING SCREEN */
 
    .loading{
 
      position:fixed;
 
      width:100%;
 
      height:100%;
 
      top:0;
 
      left:0;
 
 
      z-index:5;
 
 
      background-color:#555;
 
      color:#fff;
 
      text-align: center;
 
    }
 
    .loading p{
 
      position: relative;
 
      width:100%;
 
      height:10%;
 
      top:45%;
 
      left:0;
 
    }
 
 
    /* MENU STYLING */
 
    .menu{
 
      position:fixed;
 
      width:100%;
 
      height:56px;
 
      top:14px;
 
      background-color: #47a3da;
 
 
      z-index:4;
 
 
      border-collapse: collapse;
 
      text-align:center;
 
    }
 
    .menu tr td{
 
      text-align: center;
 
      vertical-align: middle;
 
 
      font-weight: 700;
 
      font-size:16px;
 
      color:#fff;
 
      width:7%;
 
    }
 
    .menu tr td.menu-item:hover{
 
      background-color:#258ecd;
 
      cursor: pointer;
 
    }
 
    .subselected{
 
      background-color: #258ecd;
 
    }
 
 
    /* CONTAINERS STYLING */
 
    .container{
 
      position:relative;
 
      width:100%;
 
      top:50px;
 
    }
 
    .container .subcontainer{
 
      position:absolute;
 
      width:95%;
 
      height:90%;
 
      top:5%;
 
      left:2.5%;
 
    }
 
    #top{
 
      background-size: cover;
 
   
 
      overflow:hidden;
 
    }
 
 
    /* TEAM MEMBERS CARDS STYLING */
 
    .team-member-container{
 
      position:relative;
 
      width:14%;
 
      margin-left:2.28%;
 
 
      float:left;
 
    }
 
    .team-member-container:hover{
 
      cursor:pointer;
 
    }
 
    .row2{
 
      top:4%;
 
    }
 
    .team-member-container .team-member-photo{
 
      position:relative;
 
      width:100%;
 
      height:85%;
 
      top:0;
 
      left:0;
 
      background-size: cover;
 
    }
 
    .team-member-container .team-member-footer{
 
      position:relative;
 
      width:100%;
 
      height:15%;
 
      top:0;
 
      left:0;
 
 
      border:none;
 
      border-collapse: collapse;
 
      background-color: #47a3da;
 
      color:#fff;
 
 
      text-align: center;
 
      vertical-align: middle;
 
    }
 
 
body {
 
    padding-top: 110px;
 
}
 
 
.center-block {
 
  display: block;
 
  margin-left: auto;
 
  margin-right: auto;
 
}
 
 
 
.navbar-fixed-top {
 
background: #fff;
 
filter: none !important;
 
box-shadow: 0 2px 15px rgba(0,0,0,0.25);
 
-moz-box-shadow: 0 2px 15px rgba(0,0,0,0.25);
 
-webkit-box-shadow: 0 2px 15px rgba(0,0,0,0.25);
 
        border-bottom: 1px solid rgba(0,0,0,0.2);
 
 
}
 
 
 
.dropdown-submenu {
 
    position: relative;
 
}
 
 
.dropdown-submenu>.dropdown-menu {
 
    top: 0;
 
    left: 100%;
 
    margin-top: -6px;
 
    margin-left: -1px;
 
    -webkit-border-radius: 0 6px 6px 6px;
 
    -moz-border-radius: 0 6px 6px;
 
    border-radius: 0 6px 6px 6px;
 
}
 
 
.dropdown-submenu:hover>.dropdown-menu {
 
    display: block;
 
}
 
 
.dropdown-submenu>a:after {
 
    display: block;
 
    content: " ";
 
    float: right;
 
    width: 0;
 
    height: 0;
 
    border-color: transparent;
 
    border-style: solid;
 
    border-width: 5px 0 5px 5px;
 
    border-left-color: #ccc;
 
    margin-top: 5px;
 
    margin-right: -10px;
 
}
 
 
.dropdown-submenu:hover>a:after {
 
    border-left-color: #fff;
 
}
 
 
.dropdown-submenu.pull-left {
 
    float: none;
 
}
 
 
.dropdown-submenu.pull-left>.dropdown-menu {
 
    left: -100%;
 
    margin-left: 10px;
 
    -webkit-border-radius: 6px 0 6px 6px;
 
    -moz-border-radius: 6px 0 6px 6px;
 
    border-radius: 6px 0 6px 6px;
 
 
 
 
.faceBot{
 
  background: #202020;
 
}
 
 
@font-face {
 
  font-family: 'Open Sans', Arial;;
 
}
 
 
body
 
{
 
    font-family: 'Open Sans', Arial;
 
}
 
 
ul.nav a{
 
  color: gray;
 
  background-color: transparent;
 
  height: 100%;
 
  position: relative;
 
}
 
 
ul.nav a:hover{
 
  color: gray;
 
  background-color: transparent;
 
  height: 100%;
 
  position: relative;
 
}
 
 
h2 {
 
  color:green;
 
}
 
 
h4 {
 
    font-weight: bold;
 
}
 
 
.menu-item{
 
  height: 75px;
 
}
 
 
li.menu-item{
 
  background: transparent !important;
 
}
 
 
 
 
.green-effect{
 
  display: none;
 
  background-color: #4AAF51;
 
  opacity: 1;
 
  color: #FFF;
 
  transition-property: all;
 
  transition-duration: 0.3s;
 
  transition-timing-function: ease-out;
 
  transition-delay: 0s;
 
  border-color: #288D30;
 
  position: absolute;
 
  bottom: 0px;
 
  width: 100%;
 
  height: 2px;
 
  right: 0px;
 
}
 
 
.logo {
 
margin-top: 100px;
 
 
}
 
 
a:hover .green-effect{
 
  display: inherit;
 
}
 
 
.invertir:hover {
 
  -webkit-filter: invert(100%);
 
}
 
 
dropdown-toggle {
 
width: 10%;
 
 
 
 
 
}
 
 
 
</style>
 
 
  
 
</head>
 
</head>
 
 
<body>
 
<body>
  
 +
<div class="container">
 +
<nav class="navbar navbar-inverse navbar-fixed-top">
 +
        <div class="navbar-header">
 +
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
 +
                <span class="sr-only">Toggle navigation</span>
 +
                <span class="icon-bar"></span>
 +
                <span class="icon-bar"></span>
 +
                <span class="icon-bar"></span>
 +
            </button>
  
<div class="navbar navbar-fixed-top" style="margin-top:15px">
+
            <a class="navbar-brand" id="BioballoonLabel" href="https://2016.igem.org/Team:Stanford-Brown">Stanford-Brown</a>
  <nav class="navbar-inner">
+
 
+
  <div class="row-sm-height">
+
 
+
  <div class="col-sm-2"><a href="https://2016.igem.org/Team:Sydney_Australia"><img class="logo" src="https://static.igem.org/mediawiki/2016/8/81/T--Sydney_Australia--Peek_Banner.png" height="60"  width="auto" ></a></div>
+
 
+
 
+
 
+
 
+
 
+
+
 
+
  <div class="col-md-10" >
+
      <ul class="nav navbar-nav" style="margin-top:10px">
+
    <li>
+
    <a href="#" class="dropdown-toggle" data-toggle="dropdown">
+
 
+
                Team<b class="caret"></b>           
+
</a>
+
                    <ul class="dropdown-menu multi-level">
+
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/Team">About Us </a></li>
+
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/Attributions">Attributions </a></li>
+
                   
+
                    </ul>
+
                </li>
+
 
+
 
+
 
+
<li>
+
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">Project <b class="caret"></b></a>
+
                    <ul class="dropdown-menu multi-level"  >
+
+
<li><a href="https://2016.igem.org/Team:Sydney_Australia/ProjectHome">Project- Home</a></li>
+
<li class="divider"></li>
+
              <li><a href="https://2016.igem.org/Team:Sydney_Australia/Safety">Safety</a></li>
+
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/Sense">Sense</a></li>
+
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/Express">Express</a></li>
+
             
+
                 
+
                        <li class="dropdown-submenu">
+
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">Keep Fresh</a>
+
                            <ul class="dropdown-menu">
+
                                <li><a href="https://2016.igem.org/Team:Sydney_Australia/Design">Applied Design</a></li>
+
                             
+
                                <li><a href="https://2016.igem.org/Team:Sydney_Australia/Entrepreneurship">Business Plan</a></li>
+
                            </ul>
+
                        </li>
+
 
+
                          <li><a href="https://2016.igem.org/Team:Sydney_Australia/Notebook">Notebook</a></li>
+
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/Interlab">Interlab</a></li>
+
<li><a href=" https://2016.igem.org/Team:Sydney_Australia/Protocols">Protocols</a></li>
+
                    </ul>
+
 
+
 
+
                </li>
+
 
+
 
+
 
+
 
+
 
+
     
+
 
+
 
+
        <li>
+
    <a href="https://2016.igem.org/Team:Sydney_Australia/Human_Practices" class="dropdown-toggle" data-toggle="dropdown">
+
 
+
                Human Practices<b class="caret"></b>           
+
</a>
+
                    <ul class="dropdown-menu multi-level">
+
<li><a href="https://2016.igem.org/Team:Sydney_Australia/Human_Practices">Human Practices - Summary</a></li>
+
<li class="divider"></li>
+
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/Integrated_Practices">Integrated Human Practices</a></li>
+
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/Engagement">Outreach</a></li>
+
<li><a href="https://2016.igem.org/Team:Sydney_Australia/TOK">Theory of Knowledge</a></li>
+
                     
+
                    </ul>
+
                </li>
+
 
+
 
+
        <li class="menu-item">
+
          <a href="https://2016.igem.org/Team:Sydney_Australia/Collaboration">
+
            <span>Collaboration</span>
+
            <span class="green-effect"></span>
+
          </a>
+
</li>
+
 
+
   
+
 
+
+
 
+
                <li>
+
             
+
 
+
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">
+
 
+
                Modelling <b class="caret"></b>           
+
</a>
+
                    <ul class="dropdown-menu multi-level">
+
                          <li><a href="https://2016.igem.org/Team:Sydney_Australia/Model">Modelling - Home</a></li>
+
<li class="divider"></li>
+
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/ProteinModel1">Protein Modelling <br> Etnr1</a></li>
+
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/ProteinModel2">Protein Modelling <br> Etnr2</a></li>
+
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/InternalCellular">Internal Cellular Model</a></li>
+
                       
+
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/MacroscopicDiffusion">Macroscopic Diffusion Model</a></li>
+
                     
+
                     
+
                    </ul>
+
                </li>
+
 
+
      <li>
+
 
+
  <li>
+
             
+
 
+
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">
+
 
+
                Software <b class="caret"></b>           
+
</a>
+
                    <ul class="dropdown-menu multi-level">
+
                      <li><a href="https://2016.igem.org/Team:Sydney_Australia/Software">Software - Home</a></li>
+
<li class="divider"></li>
+
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/Primers">Primer Design App</a></li>
+
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/SmartPhone">SmartPhone App </a></li>
+
                     
+
                     
+
                     
+
                    </ul>
+
                </li>
+
 
+
  <li>
+
    <a href="https://2016.igem.org/Team:Sydney_Australia/Achievements" class="dropdown-toggle" data-toggle="dropdown">
+
 
+
                Achievements<b class="caret"></b>           
+
</a>
+
                    <ul class="dropdown-menu multi-level">
+
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/Parts"> Parts</a></li>
+
                        <li><a href="https://2016.igem.org/Team:Sydney_Australia/Medals">Medals</a></li>
+
 
+
                   
+
                    </ul>
+
                </li>
+
 
+
  
 +
        <div id="navbar" class="navbar-collapse collapse">
 +
        <ul class="nav navbar-nav">
 +
<!--index-->
 +
            <li class="active"><a href="https://2016.igem.org/Team:Stanford-Brown">Home</a></li>
 +
<!--attributions-->
 +
                <li><a href="https://2016.igem.org/Team:Stanford-Brown/Attributions">Attributions</a></li>
 +
<!--biomembrane-->
 +
                <li class="dropdown">
 +
                <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">BioMembrane<span class="caret"></span></a>
 +
                <ul class="dropdown-menu">
 +
                    <li><a href="https://2016.igem.org/Team:Stanford-Brown/SB16_BioMembrane_Overview">Overview</a></li>
 +
                    <li><a href="https://2016.igem.org/Team:Stanford-Brown/SB16_BioMembrane_Collagen">Collagen</a></li>
 +
<li><a href="https://2016.igem.org/Team:Stanford-Brown/SB16_BioMembrane_Elastin">Elastin</a></li>
 +
<li><a href="https://2016.igem.org/Team:Stanford-Brown/SB16_BioMembrane_p-Aramid">p-Aramid</a></li>
 +
                    <li><a href="https://2016.igem.org/Team:Stanford-Brown/SB16_BioMembrane_Latex">Latex</a></li>
 +
                    <li><a href="https://2016.igem.org/Team:Stanford-Brown/SB16_BioMembrane_UV">UV Protection</a></li>
 +
                  </ul>
 +
                </li>
 +
<!--float-->
 +
<li class="dropdown">
 +
                  <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Float<span class="caret"></span></a>
 +
                  <ul class="dropdown-menu">
 +
<li><a href="https://2016.igem.org/Team:Stanford-Brown/SB16_Float_Gas">Gas Production</a></li>
 +
                  </ul>
 +
                </li>
 +
<!--sensing-->
 +
                <li class="dropdown">
 +
                  <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">BioSensor<span class="caret"></span></a>
 +
                  <ul class="dropdown-menu">
 +
                    <li><a href="https://2016.igem.org/Team:Stanford-Brown/SB16_BioSensor_Overview">Overview</a></li>
 +
<li><a href="https://2016.igem.org/Team:Stanford-Brown/SB16_BioSensor_Chromoproteins">Chromoproteins</a></li>
 +
                    <li><a href="https://2016.igem.org/Team:Stanford-Brown/SB16_BioSensor_FQsensor">Fluorophore-Quencher</a></li>
 +
<li><a href="https://2016.igem.org/Team:Stanford-Brown/SB16_BioMembrane_AptamerPurification">Aptamer Purification</a></li>
 +
                  </ul>
 +
                </li>
  
      </ul>
+
<!--human practices-->
</div>
+
<li class="dropdown">
  </nav>
+
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Practices<span class="caret"></span></a>
</div>
+
<ul class="dropdown-menu">
 +
<li><a href="https://2016.igem.org/Team:Stanford-Brown/Human_Practices">Overview</a></li>
 +
<li><a href="https://2016.igem.org/Team:Stanford-Brown/Integrated_Practices">Integrated Human Practices</a></li>
 +
<li><a href="https://2016.igem.org/Team:Stanford-Brown/Engagement">Outreach</a></li>
 +
 +
<li><a href="https://2016.igem.org/Team:Stanford-Brown/SB16_Practices_Exploration">Life Beyond the Lab</a></li>
 +
</ul>
 +
</li>
 +
<!--collaborations-->
 +
                <li class="dropdown">
 +
                  <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Collaborations<span class="caret"></span></a>
 +
                  <ul class="dropdown-menu">
 +
                    <li><a href="https://2016.igem.org/Team:Stanford-Brown/SB16_Collaborations_Interlab">InterLab Study</a></li>
 +
                    <li><a href="https://2016.igem.org/Team:Stanford-Brown/Collaborations">Team Collaborations</a></li>
 +
                  </ul>
 +
                </li>
  
 +
<!--biobricks-->
 +
                <li><a href="https://2016.igem.org/Team:Stanford-Brown/Parts">BioBricks</a></li>
 +
<!--protocols-->
 +
<li class="dropdown">
 +
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Protocols<span class="caret"></span></a>
 +
<ul class="dropdown-menu">
 +
<li><a href="https://2016.igem.org/Team:Stanford-Brown/SB16_Protocols">Protocols</a>
 +
</li>
 +
<li><a href="https://2016.igem.org/Team:Stanford-Brown/SB16_Software">Software Design</a>
 +
</li>
 +
<li><a href="https://2016.igem.org/Team:Stanford-Brown/SB16_Modeling">Modeling</a>
 +
</li>
 +
<li role="separator" class="divider"></li>
 +
<li class="dropdown-header">Notebooks</li>
 +
<li><a href="https://2016.igem.org/Team:Stanford-Brown/SB16_Notebooks_CE">Collagen & Elastin</a></li>
 +
<li><a href="https://2016.igem.org/Team:Stanford-Brown/SB16_Notebooks_p-Aramid">P-aramid</a></li>
 +
<li><a href="https://2016.igem.org/Team:Stanford-Brown/SB16_Notebooks_Latex">Latex</a></li>
 +
<li><a href="https://2016.igem.org/Team:Stanford-Brown/SB16_Notebooks_UV">UV protection</a></li>
 +
<li><a href="https://2016.igem.org/Team:Stanford-Brown/SB16_Notebooks_AptamerPurification">Aptamer Purification</a></li>
 +
<li><a href="https://2016.igem.org/Team:Stanford-Brown/SB16_Notebooks_Gas">Gas Production</a></li>
 +
<li><a href="https://2016.igem.org/Team:Stanford-Brown/SB16_Notebooks_Chromoproteins">Chromoproteins</a></li>
 +
<li><a href="https://2016.igem.org/Team:Stanford-Brown/SB16_Notebooks_FQsensor">Fluorophore-Quencher</a></li>
 +
<li><a href="https://2016.igem.org/Team:Stanford-Brown/SB16_Notebooks_Nylon">Nylon</a></li>
 +
<li><a href="https://2016.igem.org/Team:Stanford-Brown/SB16_Notebooks_Interlab">Interlab Study</a></li>
 +
</ul>
 +
</li>
  
<html>
+
<!--team-->
 +
                <li><a href="https://2016.igem.org/Team:Stanford-Brown/Team">Team</a></li>
 +
<!--requirements-->
 +
<li class="dropdown">
 +
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Requirements<span class="caret"></span></a>
 +
<ul class="dropdown-menu">
 +
<li><a href="https://2016.igem.org/Team:Stanford-Brown/SB16_MedalRequirements">Medals</a></li>
 +
<li><a href="https://2016.igem.org/Team:Stanford-Brown/Safety">Safety</a></li>
 +
</ul>
 +
</li>
 +
            </ul>
 +
        </div>
 +
</div>
 +
</nav>
 +
<!--NAVBAR END-->
 +
</div> <!--END container-->
 +
</body>

Revision as of 01:01, 10 September 2017