Difference between revisions of "Template:Global Template"

 
(3 intermediate revisions by the same user not shown)
Line 1: Line 1:
<html>
+
<!doctype html>
 +
<html lang="en">
 
<head>
 
<head>
<style>
+
<meta charset="utf-8" />
 +
<link rel="apple-touch-icon" sizes="76x76" href="assets/img/apple-icon.png">
 +
<link rel="icon" type="image/png" href="assets/img/favicon.png">
 +
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
  
/******************* ADJUSTS DEFAULT iGEM CONTENT *******************/
+
<title>Material Kit by Creative Tim</title>
 +
 
 +
<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0' name='viewport' />
 +
 
 +
<!--    Fonts and icons    -->
 +
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons" />
 +
    <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700" />
 +
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/latest/css/font-awesome.min.css" />
 +
 
 +
<!-- CSS Files -->
 +
    <link href="https://2017.igem.org/Template:Team:BostonU_HW_BootStrapMin/CSS" rel="stylesheet" />
 +
    <link href="https://2017.igem.org/Template:Team:BostonU_HW_MaterialKit/CSS" rel="stylesheet"/>
 +
 
 +
<style>
 +
/******************* ADJUSTS DEFAULT iGEM CONTENT *******************/
  
 
.logo_2017, #sideMenu, #firstHeading, #bars_item { /* HIDES SOME UNWANTED STUFF COMPLETELY */
 
.logo_2017, #sideMenu, #firstHeading, #bars_item { /* HIDES SOME UNWANTED STUFF COMPLETELY */
Line 29: Line 47:
  
 
/******************* ADJUSTS DEFAULT iGEM CONTENT *******************/
 
/******************* ADJUSTS DEFAULT iGEM CONTENT *******************/
 +
</style>
 +
</head>
  
/******************* Menu Bar *******************/
+
<body>
  
@import url(https://fonts.googleapis.com/css?family=Lato);
+
<!-- NAVBAR -->
  
*, *:before, *:after{
+
<nav class="navbar navbar-danger navbar-fixed-top navbar-color-on-scroll">
  -webkit-box-sizing: border-box;
+
<div class="container">
  -moz-box-sizing: border-box;
+
        <div class="navbar-header">
  box-sizing: border-box;
+
    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navigation-index">
  padding: 0;
+
        <span class="sr-only">Toggle navigation</span>
  margin: 0;
+
        <span class="icon-bar"></span>
  font-family: 'Lato', sans-serif;
+
        <span class="icon-bar"></span>
}
+
        <span class="icon-bar"></span>
 +
    </button>
 +
    <a href="#">
 +
        <div class="logo-container">
 +
                <div class="logo">
 +
                    <img src="" alt="MARS Logo" rel="tooltip" title="<b>MARS</b> was developed and designed by <b>The 2017 BU iGEM HW Team</b>" data-placement="bottom" data-html="true">
 +
                </div>
  
/*| Navigation |*/
+
</div>
 +
      </a>
 +
    </div>
  
nav{
+
    <div class="collapse navbar-collapse" id="navigation-index">
  position: fixed;
+
    <ul class="nav navbar-nav navbar-right">
  top: 0;
+
<!-- Team Section -->
  left: 0;
+
<!-- Human Practices Section -->
  width: 100%;
+
<li class="dropdown">
  background: #fff;
+
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Team
  box-shadow: 0 3px 10px -2px rgba(0,0,0,.1);
+
<b class="caret"></b>
  border: 1px solid rgba(0,0,0,.1);
+
</a>
}
+
<ul class="dropdown-menu dropdown-menu">
  nav ul{
+
<li class="dropdown-header">Dropdown header</li>
    list-style: none;
+
<li><a href="#">Action</a></li>
    position: relative;
+
<li><a href="#">Another action</a></li>
    float: right;
+
<li><a href="#">Something else here</a></li>
    margin-right: 100px;
+
<li class="divider"></li>
    display: inline-table;
+
<li><a href="#">Separated link</a></li>
  }
+
<li class="divider"></li>
    nav ul li{
+
<li><a href="#">One more separated link</a></li>
      float: left;
+
</ul>
      -webkit-transition: all .2s ease-in-out;
+
<!-- END Human Practices Section -->
      -moz-transition: all .2s ease-in-out;
+
  <!-- END Team Section -->
      transition: all .2s ease-in-out;
+
    }
+
  
    nav ul li:hover{background: rgba(0,0,0,.15);}
+
<!-- Project Section -->
    nav ul li:hover > ul{display: block;}
+
<li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Project
    nav ul li{
+
<b class="caret"></b>
      float: left;
+
</a>
      -webkit-transition: all .2s ease-in-out;
+
<ul class="dropdown-menu dropdown-menu">
      -moz-transition: all .2s ease-in-out;
+
<li class="dropdown-header">Microfluidics 101</li>
      transition: all .2s ease-in-out;
+
<li><a href="#">Introduction to Microfluidics</a></li>
    }
+
<li><a href="#">Video Tutorials</a></li>
      nav ul li a{
+
<li><a href="#">Something else here</a></li>
        display: block;
+
<li class="divider"></li>
        padding: 30px 20px;
+
<li class = "dropdown-header">Microfluidic Chips</li>
        color: #222;
+
<li><a href="#">MARS Archive</a></li>
        font-size: .9em;
+
<li class="divider"></li>
        letter-spacing: 1px;
+
<li><a href="#">One more separated link</a></li>
        text-decoration: none;
+
</ul>
        text-transform: uppercase;
+
</li>
      }
+
<!-- END Project Section -->
      nav ul ul{
+
        display: none;
+
        background: #fff;
+
        position: absolute;
+
        top: 100%;
+
        box-shadow: -3px 3px 10px -2px rgba(0,0,0,.1);
+
        border: 1px solid rgba(0,0,0,.1);
+
      }
+
        nav ul ul li{float: none; position: relative;}
+
          nav ul ul li a {
+
            padding: 15px 30px;
+
            border-bottom: 1px solid rgba(0,0,0,.05);
+
          }
+
          nav ul ul ul {
+
            position: absolute;
+
            left: 100%;
+
            top:0;
+
          }
+
  
/******************* Menu Bar *******************/
+
<!-- Notebook Section -->
 +
<li class="dropdown">
 +
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Notebook
 +
<b class="caret"></b>
 +
</a>
 +
<ul class="dropdown-menu dropdown-menu">
 +
<li class="dropdown-header">Dropdown header</li>
 +
<li><a href="#">Action</a></li>
 +
<li><a href="#">Another action</a></li>
 +
<li><a href="#">Something else here</a></li>
 +
<li class="divider"></li>
 +
<li><a href="#">Separated link</a></li>
 +
<li class="divider"></li>
 +
<li><a href="#">One more separated link</a></li>
 +
</ul>
 +
<!-- END Notebook Section -->
 +
 
 +
<!-- Human Practices Section -->
 +
<li class="dropdown">
 +
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Human Practices
 +
<b class="caret"></b>
 +
</a>
 +
<ul class="dropdown-menu dropdown-menu">
 +
<li class="dropdown-header">Dropdown header</li>
 +
<li><a href="#">Action</a></li>
 +
<li><a href="#">Another action</a></li>
 +
<li><a href="#">Something else here</a></li>
 +
<li class="divider"></li>
 +
<li><a href="#">Separated link</a></li>
 +
<li class="divider"></li>
 +
<li><a href="#">One more separated link</a></li>
 +
</ul>
 +
<!-- END Human Practices Section -->
 +
 
 +
<!-- Human Practices Section -->
 +
<li class="dropdown">
 +
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Medal Criteria
 +
<b class="caret"></b>
 +
</a>
 +
<ul class="dropdown-menu dropdown-menu">
 +
<li class="dropdown-header">Dropdown header</li>
 +
<li><a href="#">Action</a></li>
 +
<li><a href="#">Another action</a></li>
 +
<li><a href="#">Something else here</a></li>
 +
<li class="divider"></li>
 +
<li><a href="#">Separated link</a></li>
 +
<li class="divider"></li>
 +
<li><a href="#">One more separated link</a></li>
 +
</ul>
 +
<!-- END Human Practices Section -->
 +
 
 +
<!-- Random -->
 +
<li>
 +
<a href="components-documentation.html" target="_blank">
 +
<i class="material-icons">dashboard</i> Components
 +
</a>
 +
</li>
 +
<li>
 +
<!-- END Random -->
 +
 
 +
<!-- Social Media -->
 +
<a rel="tooltip" title="Follow us on Twitter!" data-placement="bottom" href="https://twitter.com/igemhwbu" target="_blank" class="btn btn-white btn-simple btn-just-icon">
 +
<i class="fa fa-twitter"></i>
 +
</a>
 +
</li>
 +
<li>
 +
<a rel="tooltip" title="Follow us on Instagram!" data-placement="bottom" href="https://www.instagram.com/buigemhardware/?hl=en" target="_blank" class="btn btn-white btn-simple btn-just-icon">
 +
<i class="fa fa-instagram"></i>
 +
</a>
 +
</li>
 +
<!-- END Social Media -->
 +
 
 +
    </ul>
 +
    </div>
 +
 
 +
 
 +
</div>
 +
</nav>
  
</style>
 
</head>
 
<body>
 
<nav role='navigation'>
 
  <ul>
 
    <li><a href="https://2017.igem.org/Team:BostonU_HW/Team">Team</a></li>
 
    <li><a href="#">Project</a>
 
      <ul>
 
        <li><a href="https://2017.igem.org/Team:BostonU_HW/Project/uF101">Microfluidics 101</a></li>
 
        <li><a href="https://2017.igem.org/Team:BostonU_HW/Project/Video_Tutorials">Video Tutorials</a></li>
 
      </ul>
 
    </li>
 
    <li><a href="#">Human Practices</a></li>
 
    <li><a href="#">Medal Criteria</a></li>
 
  </ul>
 
</nav>
 
 
</body>
 
</body>
 +
 +
<!--  Core JS Files  -->
 +
<script src="https://2017.igem.org/Template:Team:BostonU_HW_jqueryMin/Javascript" type="text/javascript"></script>
 +
<script src="https://2017.igem.org/Template:Team:BostonU_HW_BootstrapMin/Javascript" type="text/javascript"></script>
 +
<script src="https://2017.igem.org/Template:Team:BostonU_HW_MaterialMin/Javascript"></script>
 +
 +
<!--  Plugin for the Sliders, full documentation here: http://refreshless.com/nouislider/ -->
 +
<script src="https://2017.igem.org/Template:Team:BostonU_HW_NouisliderMin/Javascript" type="text/javascript"></script>
 +
 +
<!--  Plugin for the Datepicker, full documentation here: http://www.eyecon.ro/bootstrap-datepicker/ -->
 +
<script src="https://2017.igem.org/Template:Team:BostonU_HW_BootstrapDatepicker/Javascript" type="text/javascript"></script>
 +
 +
<!-- Control Center for Material Kit: activating the ripples, parallax effects, scripts from the example pages etc -->
 +
<script src="https://2017.igem.org/Template:Team:BostonU_HW_Materialkit/Javascript" type="text/javascript"></script>
 +
 +
</html>

Latest revision as of 18:28, 18 August 2017

<!doctype html> Material Kit by Creative Tim