Line 260: | Line 260: | ||
padding: 100px 0; | padding: 100px 0; | ||
} | } | ||
+ | |||
+ | |||
+ | /* Header Navbar */ | ||
+ | |||
+ | .navbar-default { | ||
+ | background-color: white; | ||
+ | border-color: rgba(34, 34, 34, 0.05); | ||
+ | font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif; | ||
+ | -webkit-transition: all 0.35s; | ||
+ | -moz-transition: all 0.35s; | ||
+ | transition: all 0.35s; | ||
+ | } | ||
+ | .navbar-default .navbar-header .navbar-brand { | ||
+ | color: #f05f40; | ||
+ | font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif; | ||
+ | font-weight: 700; | ||
+ | text-transform: uppercase; | ||
+ | } | ||
+ | .navbar-default .navbar-header .navbar-brand:hover, | ||
+ | .navbar-default .navbar-header .navbar-brand:focus { | ||
+ | color: #eb3812; | ||
+ | } | ||
+ | .navbar-default .nav > li > a, | ||
+ | .navbar-default .nav > li > a:focus { | ||
+ | text-transform: uppercase; | ||
+ | font-weight: 700; | ||
+ | font-size: 13px; | ||
+ | color: #222222; | ||
+ | } | ||
+ | .navbar-default .nav > li > a:hover, | ||
+ | .navbar-default .nav > li > a:focus:hover { | ||
+ | color: #f05f40; | ||
+ | } | ||
+ | .navbar-default .nav > li.active > a, | ||
+ | .navbar-default .nav > li.active > a:focus { | ||
+ | color: #f05f40 !important; | ||
+ | background-color: transparent; | ||
+ | } | ||
+ | .navbar-default .nav > li.active > a:hover, | ||
+ | .navbar-default .nav > li.active > a:focus:hover { | ||
+ | background-color: transparent; | ||
+ | } | ||
+ | @media (min-width: 768px) { | ||
+ | .navbar-default { | ||
+ | background-color: transparent; | ||
+ | border-color: rgba(255, 255, 255, 0.3); | ||
+ | } | ||
+ | .navbar-default .navbar-header .navbar-brand { | ||
+ | color: rgba(255, 255, 255, 0.7); | ||
+ | } | ||
+ | .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: rgba(255, 255, 255, 0.7); | ||
+ | } | ||
+ | .navbar-default .nav > li > a:hover, | ||
+ | .navbar-default .nav > li > a:focus:hover { | ||
+ | color: white; | ||
+ | } | ||
+ | .navbar-default.affix { | ||
+ | background-color: white; | ||
+ | border-color: rgba(34, 34, 34, 0.05); | ||
+ | } | ||
+ | .navbar-default.affix .navbar-header .navbar-brand { | ||
+ | color: #f05f40; | ||
+ | font-size: 14px; | ||
+ | } | ||
+ | .navbar-default.affix .navbar-header .navbar-brand:hover, | ||
+ | .navbar-default.affix .navbar-header .navbar-brand:focus { | ||
+ | color: #eb3812; | ||
+ | } | ||
+ | .navbar-default.affix .nav > li > a, | ||
+ | .navbar-default.affix .nav > li > a:focus { | ||
+ | color: #222222; | ||
+ | } | ||
+ | .navbar-default.affix .nav > li > a:hover, | ||
+ | .navbar-default.affix .nav > li > a:focus:hover { | ||
+ | color: #f05f40; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | |||
</style> | </style> | ||
Line 267: | Line 352: | ||
<body> | <body> | ||
+ | |||
+ | |||
+ | <nav id="mainNav" class="navbar navbar-default navbar-fixed-top"> | ||
+ | <div class="container-fluid"> | ||
+ | <!-- 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"> | ||
+ | <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 page-scroll" href="#page-top">Start Bootstrap</a> | ||
+ | </div> | ||
+ | |||
+ | <!-- Collect the nav links, forms, and other content for toggling --> | ||
+ | <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> | ||
+ | <ul class="nav navbar-nav navbar-right"> | ||
+ | <li> | ||
+ | <a class="page-scroll" href="#about">About</a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a class="page-scroll" href="#services">Services</a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a class="page-scroll" href="#portfolio">Portfolio</a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a class="page-scroll" href="#contact">Contact</a> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </div> | ||
+ | <!-- /.navbar-collapse --> | ||
+ | </div> | ||
+ | <!-- /.container-fluid --> | ||
+ | </nav> | ||
+ | |||
+ | |||
+ | |||
+ | |||
<!-- Navigation --> | <!-- Navigation --> | ||
<a id="menu-toggle" href="#" class="btn btn-dark btn-lg"><img src="https://static.igem.org/mediawiki/2016/e/ec/Menu_icon_rcwolf.png"></a> | <a id="menu-toggle" href="#" class="btn btn-dark btn-lg"><img src="https://static.igem.org/mediawiki/2016/e/ec/Menu_icon_rcwolf.png"></a> |
Revision as of 18:52, 27 June 2016
Fluigi
Boston University iGem Special Track 2016: Hardware
Fluigi is a tool used to specify, design, and build a microfluidic device.
Project Description
Where can we use Microfluidics?
- Synthetic Biology: 'Lab on a Chip', 2014 - Experiments to monitor precise control of the number and concentration of input: 'Diverse Sensitivity Thresholds in Dynamic Signaling Response by Social Amoebae', 2012 - Single-cell tracking: 'Microfluidics for Synthetic Biology: From Design to Execution' - Microchemostat for environmental control: 'Long-Term Monitoring of Bacteria Undergoing Programmed Population Control in a Microchemostat', 2005