Line 1: | Line 1: | ||
− | {{ | + | {{Template:BUHW2016_NavBar}} |
+ | |||
+ | |||
+ | {{Template:BUHW2016_Bootstrap}} | ||
<html> | <html> | ||
+ | <head> | ||
+ | <style> | ||
+ | |||
+ | |||
+ | /********************************* DEFAULT WIKI SETTINGS ********************************/ | ||
+ | |||
+ | #sideMenu, #top_title {display:none;} | ||
+ | #content { padding:0px; width:100%; margin-top:-12px; margin-left:0px;} | ||
+ | body {background-color:white; } | ||
+ | #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; } | ||
+ | |||
+ | |||
+ | |||
+ | @font-face { | ||
+ | font-family: openSans; | ||
+ | src: url(https://static.igem.org/mediawiki/2016/1/1e/T--BostonU_HW--openSansLight_rcwolf.ttf); | ||
+ | } | ||
+ | |||
+ | |||
+ | html,body | ||
+ | { | ||
+ | width: 100%; | ||
+ | min-width: 100%; | ||
+ | height: 100%; | ||
+ | margin: 0px; | ||
+ | padding: 0px; | ||
+ | overflow-x: hidden; | ||
+ | } | ||
+ | |||
+ | |||
+ | body{ | ||
+ | background-color: white; | ||
+ | } | ||
+ | |||
+ | * { | ||
+ | font-family: openSans !important; | ||
+ | } | ||
+ | |||
+ | |||
+ | .navbar { | ||
+ | background-color: black; | ||
+ | border-color: black; | ||
+ | margin-top: 10px; | ||
+ | |||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | .navbar-default .navbar-header .navbar-brand, | ||
+ | .navbar-default .navbar-header .navbar-brand:hover, | ||
+ | .navbar-default .navbar-header .navbar-brand:focus { | ||
+ | color: white; | ||
+ | } | ||
+ | .navbar-default .nav > li > a, | ||
+ | .navbar-default .nav > li > a:focus { | ||
+ | color: white; | ||
+ | font-size: medium; | ||
+ | } | ||
+ | .navbar-default .nav > li > a:hover, | ||
+ | .navbar-default .nav > li > a:focus:hover { | ||
+ | color: white; | ||
+ | font-size: medium; | ||
+ | } | ||
+ | .navbar-default.affix { | ||
+ | background-color: white; | ||
+ | border-color: white; | ||
+ | } | ||
+ | |||
+ | |||
+ | /* Animated Underlining For Menu Items */ | ||
+ | .dropbtn { | ||
+ | display: inline-block; | ||
+ | position: relative; | ||
+ | padding-bottom: 3px; | ||
+ | } | ||
+ | .dropbtn:after { | ||
+ | content: ''; | ||
+ | display: block; | ||
+ | margin: auto; | ||
+ | height: 2px; | ||
+ | width: 0px; | ||
+ | background: transparent; | ||
+ | transition: width .5s ease, background-color .5s ease; | ||
+ | } | ||
+ | .sliding-middle-out:hover > .dropbtn:after { | ||
+ | width: 100%; | ||
+ | background: white; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | /* Dropdown Menu Functionality */ | ||
+ | /* Style The Dropdown Button */ | ||
+ | .dropbtn { | ||
+ | color: white; | ||
+ | border: none; | ||
+ | cursor: pointer; | ||
+ | } | ||
+ | |||
+ | /* The container <div> - needed to position the dropdown content */ | ||
+ | .dropdown { | ||
+ | position: relative; | ||
+ | display: inline-block; | ||
+ | } | ||
+ | |||
+ | /* Dropdown Content (Hidden by Default) */ | ||
+ | .dropdown-content { | ||
+ | display: none; | ||
+ | position: absolute; | ||
+ | background-color: rgba(249,249,249,0.4); | ||
+ | min-width: 160px; | ||
+ | } | ||
+ | |||
+ | /* Links inside the dropdown */ | ||
+ | .dropdown-content a { | ||
+ | color: black; | ||
+ | font-size: 15px; | ||
+ | padding: 10px 16px; | ||
+ | text-decoration: none; | ||
+ | display: block; | ||
+ | } | ||
+ | |||
+ | /* Change color of dropdown links on hover */ | ||
+ | .dropdown-content a:hover {background-color: #f1f1f1} | ||
+ | |||
+ | /* Show the dropdown menu on hover */ | ||
+ | .dropdown:hover .dropdown-content { | ||
+ | display: block; | ||
+ | } | ||
+ | |||
+ | .paddedNav{ | ||
+ | padding-left: 23px; | ||
+ | padding-right: 23px; | ||
+ | padding-bottom: 5px; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | </style> | ||
+ | |||
+ | |||
+ | </head> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
<body> | <body> | ||
− | < | + | |
− | <div class=" | + | <header id="top" class="header"> |
− | + | ||
− | <div class=" | + | <nav class="navbar navbar-default navbar-fixed-top" style="max-height: 70px !important;"> |
− | + | <div class="container-fluid paddedNav"> | |
+ | <!-- Brand and toggle get grouped for better mobile display --> | ||
+ | <div class="navbar-header"> | ||
+ | <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false"> | ||
+ | <span class="sr-only">Toggle navigation</span> | ||
+ | <span class="icon-bar"></span> | ||
+ | <span class="icon-bar"></span> | ||
+ | <span class="icon-bar"></span> | ||
+ | </button> | ||
+ | |||
+ | <a class="navbar-brand" href="https://2016.igem.org/Team:BostonU_HW"><img src="https://static.igem.org/mediawiki/2016/9/97/T--BostonU_HW--NeptuneLogo_rcwolf.png" height="38" width="55" style="display: inline-block; padding-right: 17px; ">BU HW 2016</a> | ||
+ | </div> | ||
+ | |||
+ | <!-- Collect the nav links, forms, and other content for toggling --> | ||
+ | <div class="collapse navbar-collapse " > | ||
+ | <ul class="nav navbar-nav navbar-right"> | ||
+ | <li class="sliding-middle-out dropdown"> | ||
+ | <a href="#" class="dropbtn">TEAM </a> | ||
+ | <div class="dropdown-content"> | ||
+ | <a href="https://2016.igem.org/Team:BostonU_HW/Team">Meet the Team </a> | ||
+ | <a href="https://2016.igem.org/Team:BostonU_HW/Attributions">Attributions</a> | ||
+ | <a href="https://2016.igem.org/Team:BostonU_HW/Collaborations">Collaborations</a> | ||
+ | </div> | ||
+ | </li> | ||
+ | <li class="sliding-middle-out dropdown"> | ||
+ | <a href="#" class="dropbtn">PROJECT</a> | ||
+ | |||
+ | <div class="dropdown-content"> | ||
+ | <a href="https://2016.igem.org/Team:BostonU_HW/Results">Results</a> | ||
+ | <a href="https://2016.igem.org/Team:BostonU_HW/Demonstrate">Project Build</a> | ||
+ | <a href="https://2016.igem.org/Team:BostonU_HW/Proof">Application</a> | ||
+ | <a href="https://2016.igem.org/Team:BostonU_HW/Design">Documentation</a> | ||
+ | <a href="https://2016.igem.org/Team:BostonU_HW/Parts">Parts</a> | ||
+ | |||
+ | </div> | ||
+ | </li> | ||
+ | <li class="sliding-middle-out dropdown"> | ||
+ | <a href="#" class="dropbtn">NOTEBOOK</a> | ||
+ | <div class="dropdown-content"> | ||
+ | <a href="https://2016.igem.org/Team:BostonU_HW/Notebook">Timeline</a> | ||
+ | <a href="https://2016.igem.org/Team:BostonU_HW/Experiments">Experiments</a> | ||
+ | <a href="https://2016.igem.org/Team:BostonU_HW/Safety">Safety</a> | ||
+ | </div> | ||
+ | </li> | ||
+ | <li class="sliding-middle-out dropdown"> | ||
+ | <a href="https://2016.igem.org/Team:BostonU_HW/Human_Practices" class="dropbtn">HUMAN PRACTICES</a> | ||
+ | <div class="dropdown-content"> | ||
+ | <a href="https://2016.igem.org/Team:BostonU_HW/HP/Silver">Silver</a> | ||
+ | <a href="https://2016.igem.org/Team:BostonU_HW/HP/Gold">Gold</a> | ||
+ | <a href="https://2016.igem.org/Team:BostonU_HW/Integrated_Practices">Integrated Practices</a> | ||
+ | <a href="https://2016.igem.org/Team:BostonU_HW/Engagement">Engagement</a> | ||
+ | </div> | ||
+ | </li> | ||
+ | <li class="sliding-middle-out dropdown"> | ||
+ | <a href="#" class="dropbtn">AWARDS</a> | ||
+ | <img src="https://static.igem.org/mediawiki/2016/5/58/T--BostonU_HW--indexTriangle_rcwolf.png" width="36" height="18" style="margin-bottom: 0 !important; margin-top: 0; padding-bottom: 0 !important; border: none; display: block; margin: 0 auto;"> | ||
+ | <div class="dropdown-content"> | ||
+ | <a href="https://2016.igem.org/Team:BostonU_HW/Hardware">Hardware</a> | ||
+ | <a href="https://2016.igem.org/Team:BostonU_HW/Software">Software</a> | ||
+ | <a href="https://2016.igem.org/Team:BostonU_HW/Measurement">Measurement</a> | ||
+ | <a href="https://2016.igem.org/Team:BostonU_HW/Model">Model</a> | ||
+ | </div> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </div><!-- /.navbar-collapse --> | ||
+ | </div><!-- /.container-fluid --> | ||
+ | </nav> | ||
+ | |||
+ | |||
</div> | </div> | ||
+ | |||
+ | |||
+ | |||
+ | </body> | ||
+ | |||
+ | |||
+ | |||
+ | <html> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | <html> | ||
+ | |||
+ | <style> | ||
+ | |||
+ | html { | ||
+ | background-color: #D2D2D2; | ||
+ | } | ||
+ | body { | ||
+ | background-color: #D2D2D2; | ||
+ | } | ||
+ | |||
+ | #greyWrapper { | ||
+ | padding-top: 120px; | ||
+ | background-color: #D2D2D2; | ||
+ | margin: 0px 0px 40px 0px; | ||
+ | min-height: 1000px; | ||
+ | } | ||
+ | #pageTitle { | ||
+ | margin-left: 25px; | ||
+ | padding-bottom: 16px; | ||
+ | } | ||
+ | .pageBanner { | ||
+ | position: fixed; | ||
+ | color:black; | ||
+ | background-color:white; | ||
+ | width:100%; | ||
+ | top:70px; | ||
+ | z-index: 1; | ||
+ | } | ||
+ | .densmoreCard { | ||
+ | background-color: white; | ||
+ | padding:0; | ||
+ | } | ||
+ | .advisorCard { | ||
+ | background-color: white; | ||
+ | } | ||
+ | .miniBio { | ||
+ | padding-left: 20px; | ||
+ | padding-right:20px; | ||
+ | padding-bottom:30px; | ||
+ | } | ||
+ | .bioIcon { | ||
+ | border: none; | ||
+ | display: block; | ||
+ | margin-top: -24px; | ||
+ | margin-bottom: -20px; | ||
+ | margin-left: auto; | ||
+ | margin-right: auto; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | .btn { | ||
+ | padding: 14px 24px; | ||
+ | border: 0 none; | ||
+ | border-radius: 0; | ||
+ | font-weight: 700; | ||
+ | font-size: 15px; | ||
+ | letter-spacing: 0.5px; | ||
+ | text-transform: uppercase; | ||
+ | -webkit-box-shadow: 5px 5px 0px rgba(4, 4, 4, 0.3); | ||
+ | -moz-box-shadow: 5px 5px 0px rgba(4, 4, 4, 0.3); | ||
+ | box-shadow: 5px 5px 0px rgba(4, 4, 4, 0.3); | ||
+ | outline: #545454 solid 2px; | ||
+ | |||
+ | } | ||
+ | |||
+ | .btn:focus, .btn:active:focus, .btn.active:focus { | ||
+ | outline: 0 none; | ||
+ | } | ||
+ | |||
+ | .btn-primary { | ||
+ | background: #ffffff; | ||
+ | color: #000000; | ||
+ | } | ||
+ | |||
+ | .btn-primary:active, .btn-primary.active { | ||
+ | background: #ffffff; | ||
+ | color: #000000; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | .btn-primary:focus { | ||
+ | background: #ffffff; | ||
+ | color: #000000; | ||
+ | } | ||
+ | |||
+ | |||
+ | .btn:active:focus { | ||
+ | background: #545454 !important; | ||
+ | color: white; | ||
+ | box-shadow: none; | ||
+ | } | ||
+ | .btn-primary:hover{ | ||
+ | background: #545454; | ||
+ | color: white; | ||
+ | } | ||
+ | |||
+ | |||
+ | </style> | ||
+ | |||
+ | |||
+ | |||
+ | <body> | ||
+ | <!-- PAGE TITLE BANNER --> | ||
+ | <div id="greyWrapper"> | ||
+ | <div class="pageBanner"> | ||
+ | <h3 id="pageTitle">SOFTWARE</h3> | ||
+ | </div> | ||
+ | <br><br><br><br> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | <div class="row" style="padding-top:50px; padding-bottom:50px;"> | ||
+ | <div class="col-md-1"></div> | ||
+ | <div class="col-md-10" style="font-size: 3em; line-height: 130%;">PAGE TITLE</div> | ||
+ | <div class="col-md-1"></div> | ||
</div> | </div> | ||
+ | |||
+ | <div class="row" style="padding-top:100px; padding-bottom:100px;"> | ||
+ | <div class="col-md-1"></div> | ||
+ | <div class="col-md-10" style="background-color: white; padding-top:50px; padding-bottom:50px;"> | ||
+ | <div class="row"> | ||
+ | <div class="col-md-1"></div> | ||
+ | <div class="col-md-10"> | ||
+ | <div style="font-size: 2em; line-height: 150%; color:#355E62;">SECTION TITLE</div> | ||
+ | <br><br> | ||
+ | <div> | ||
+ | Add Descriptive Text HERE. | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="col-md-1"></div> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | </div> | ||
+ | <div class="col-md-1"></div> | ||
</div> | </div> | ||
− | |||
− | |||
+ | <div class="row" style="padding-top:20px; padding-bottom:20px;"> | ||
+ | <div class="col-md-1"></div> | ||
+ | <div class="col-md-10"> | ||
+ | <video width="100%" controls> | ||
+ | <source src="https://static.igem.org/mediawiki/2016/3/34/T--BostonU_HW--SoftwareVideo_rcwolf.mp4" type="video/mp4"> | ||
+ | Your browser does not support the video tag. | ||
+ | </video> | ||
+ | </div> | ||
+ | <div class="col-md-1"></div> | ||
+ | </div> | ||
+ | <br><br> | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | + | ||
+ | |||
+ | |||
+ | |||
+ | </body> | ||
+ | </html> |
Revision as of 21:32, 17 October 2016
SOFTWARE
PAGE TITLE
SECTION TITLE
Add Descriptive Text HERE.