Team:SMTexas

From 2014hs.igem.org

(Difference between revisions)
Line 1: Line 1:
 +
<html>
 +
 +
<link rel="stylesheet" type="text/css" href="https://2014hs.igem.org/Template:SMTexas/CSS?action=raw&amp;ctype=text/css">
 +
 +
<script src="https://2014hs.igem.org/Template:SMTexas/JS?action=raw&amp;ctype=application/javascript"></script>
 +
<html>
<html>
<html lang="en">
<html lang="en">
 +
<head>
<head>
-
  <meta charset="utf-8">
+
    <meta charset="utf-8">
-
  <title>Bootstrap 3, from LayoutIt!</title>
+
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
    <meta name="description" content="">
-
  <meta name="description" content="">
+
    <meta name="author" content="">
-
  <meta name="author" content="">
+
-
<!--link rel="stylesheet/less" href="less/bootstrap.less" type="text/css" /-->
+
    <title>Grayscale - Free One Page Theme for Bootstrap 3</title>
-
<!--link rel="stylesheet/less" href="less/responsive.less" type="text/css" /-->
+
-
<!--script src="js/less-1.3.3.min.js"></script-->
+
-
<!--append ‘#!watch’ to the browser URL, then refresh the page. -->
+
-
+
-
<link href="css/bootstrap.min.css" rel="stylesheet">
+
-
<link href="css/style.css" rel="stylesheet">
+
-
  <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
+
    <!-- Bootstrap Core CSS -->
-
  <!--[if lt IE 9]>
+
    <link href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet" type="text/css">
-
     <script src="js/html5shiv.js"></script>
+
 
-
  <![endif]-->
+
    <!-- Fonts -->
 +
     <link href="http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css" rel="stylesheet" type="text/css">
 +
    <link href='http://fonts.googleapis.com/css?family=Lora:400,700,400italic,700italic' rel='stylesheet' type='text/css'>
 +
    <link href='http://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'>
 +
 
 +
    <!-- Custom Theme CSS -->
 +
    <link href="css/grayscale.css" rel="stylesheet">
-
  <!-- Fav and touch icons -->
 
-
  <link rel="apple-touch-icon-precomposed" sizes="144x144" href="img/apple-touch-icon-144-precomposed.png">
 
-
  <link rel="apple-touch-icon-precomposed" sizes="114x114" href="img/apple-touch-icon-114-precomposed.png">
 
-
  <link rel="apple-touch-icon-precomposed" sizes="72x72" href="img/apple-touch-icon-72-precomposed.png">
 
-
  <link rel="apple-touch-icon-precomposed" href="img/apple-touch-icon-57-precomposed.png">
 
-
  <link rel="shortcut icon" href="img/favicon.png">
 
-
 
 
-
<script type="text/javascript" src="js/jquery.min.js"></script>
 
-
<script type="text/javascript" src="js/bootstrap.min.js"></script>
 
-
<script type="text/javascript" src="js/scripts.js"></script>
 
</head>
</head>
-
<body>
+
<body id="page-top" data-spy="scroll" data-target=".navbar-custom">
-
<div class="container">
+
 
-
<div class="row clearfix">
+
    <nav class="navbar navbar-custom navbar-fixed-top" role="navigation">
-
<div class="col-md-12 column">
+
        <div class="container">
-
<div class="page-header">
+
            <div class="navbar-header page-scroll">
-
<h1>
+
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-main-collapse">
-
SMTexas <small>iGEM 2014</small>
+
                    <i class="fa fa-bars"></i>
-
</h1>
+
                </button>
-
</div>
+
                <a class="navbar-brand" href="#page-top">
-
<div class="carousel slide" id="carousel-336666">
+
                    <i class="fa fa-play-circle"></i> <span class="light">Start</span> Bootstrap
-
<ol class="carousel-indicators">
+
                </a>
-
<li data-slide-to="0" data-target="#carousel-336666">
+
            </div>
-
</li>
+
 
-
<li data-slide-to="1" data-target="#carousel-336666" class="active">
+
            <!-- Collect the nav links, forms, and other content for toggling -->
-
</li>
+
            <div class="collapse navbar-collapse navbar-right navbar-main-collapse">
-
<li data-slide-to="2" data-target="#carousel-336666">
+
                <ul class="nav navbar-nav">
-
</li>
+
                    <!-- Hidden li included to remove active class from about link when scrolled up past about section -->
-
</ol>
+
                    <li class="hidden">
-
<div class="carousel-inner">
+
                        <a href="#page-top"></a>
-
<div class="item">
+
                    </li>
-
<img alt="" src="http://lorempixel.com/1600/500/sports/1">
+
                    <li class="page-scroll">
-
<div class="carousel-caption">
+
                        <a href="#about">About</a>
-
<h4>
+
                    </li>
-
First Thumbnail label
+
                    <li class="page-scroll">
-
</h4>
+
                        <a href="#download">Download</a>
-
<p>
+
                    </li>
-
Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.
+
                    <li class="page-scroll">
-
</p>
+
                        <a href="#contact">Contact</a>
-
</div>
+
                    </li>
-
</div>
+
                </ul>
-
<div class="item active">
+
            </div>
-
<img alt="" src="http://lorempixel.com/1600/500/sports/2">
+
            <!-- /.navbar-collapse -->
-
<div class="carousel-caption">
+
        </div>
-
<h4>
+
        <!-- /.container -->
-
Second Thumbnail label
+
    </nav>
-
</h4>
+
 
-
<p>
+
    <section class="intro">
-
Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.
+
        <div class="intro-body">
-
</p>
+
            <div class="container">
-
</div>
+
                <div class="row">
-
</div>
+
                    <div class="col-md-8 col-md-offset-2">
-
<div class="item">
+
                        <h1 class="brand-heading">Grayscale</h1>
-
<img alt="" src="http://lorempixel.com/1600/500/sports/3">
+
                        <p class="intro-text">A free, premium quality, responsive one page Bootstrap theme created by Start Bootstrap.</p>
-
<div class="carousel-caption">
+
                        <div class="page-scroll">
-
<h4>
+
                            <a href="#about" class="btn btn-circle">
-
Third Thumbnail label
+
                                <i class="fa fa-angle-double-down animated"></i>
-
</h4>
+
                            </a>
-
<p>
+
                        </div>
-
Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.
+
                    </div>
-
</p>
+
                </div>
-
</div>
+
            </div>
-
</div>
+
        </div>
-
</div> <a class="left carousel-control" href="#carousel-336666" data-slide="prev"><span class="glyphicon glyphicon-chevron-left"></span></a> <a class="right carousel-control" href="#carousel-336666" data-slide="next"><span class="glyphicon glyphicon-chevron-right"></span></a>
+
    </section>
-
</div>
+
 
-
<nav class="navbar navbar-default navbar-fixed-top navbar-inverse" role="navigation">
+
    <section id="about" class="container content-section text-center">
-
<div class="navbar-header">
+
        <div class="row">
-
<button type="button" class="navbar-toggle" 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" href="#">Brand</a>
+
            <div class="col-lg-8 col-lg-offset-2">
-
</div>
+
                <h2>About Grayscale</h2>
-
+
                <p>Grayscale is a premium quality, free Bootstrap 3 theme created by Start Bootstrap. It can be yours right now, all you need to do is download the template on the preview page. You can use this template for any purpose, personal or commercial.</p>
-
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
+
                <p>This striking, black and white theme features stock photographs by <a href="http://gratisography.com/">Gratisography</a> along with a custom Google Map skin courtesy of <a href="http://snazzymaps.com/">Snazzy Maps</a>.</p>
-
<ul class="nav navbar-nav">
+
                <p>With this template, just the slightest splash of color can make a huge impact on the overall presentation and design.</p>
-
<li class="active">
+
            </div>
-
<a href="#">Link</a>
+
        </div>
-
</li>
+
    </section>
-
<li>
+
 
-
<a href="#">Link</a>
+
    <section id="download" class="content-section text-center">
-
</li>
+
        <div class="download-section">
-
<li class="dropdown">
+
            <div class="container">
-
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown<strong class="caret"></strong></a>
+
                <div class="col-lg-8 col-lg-offset-2">
-
<ul class="dropdown-menu">
+
                    <h2>Download Grayscale</h2>
-
<li>
+
                    <p>You can download Grayscale for free on the download page at Start Bootstrap. You can also get the source code directly from GitHub if you prefer. Additionally, Grayscale is the first Start Bootstrap theme to come with a LESS file for easy color customization!</p>
-
<a href="#">Action</a>
+
                    <a href="http://startbootstrap.com/grayscale" class="btn btn-default btn-lg">Visit Download Page</a>
-
</li>
+
                </div>
-
<li>
+
            </div>
-
<a href="#">Another action</a>
+
        </div>
-
</li>
+
    </section>
-
<li>
+
 
-
<a href="#">Something else here</a>
+
    <section id="contact" class="container content-section text-center">
-
</li>
+
        <div class="row">
-
<li class="divider">
+
            <div class="col-lg-8 col-lg-offset-2">
-
</li>
+
                <h2>Contact Start Bootstrap</h2>
-
<li>
+
                <p>Feel free to email us to provide some feedback on our templates, give us suggestions for new templates and themes, or to just say hello!</p>
-
<a href="#">Separated link</a>
+
                <p>feedback@startbootstrap.com</p>
-
</li>
+
                <ul class="list-inline banner-social-buttons">
-
<li class="divider">
+
                    <li><a href="https://twitter.com/SBootstrap" class="btn btn-default btn-lg"><i class="fa fa-twitter fa-fw"></i> <span class="network-name">Twitter</span></a>
-
</li>
+
                    </li>
-
<li>
+
                    <li><a href="https://github.com/IronSummitMedia/startbootstrap" class="btn btn-default btn-lg"><i class="fa fa-github fa-fw"></i> <span class="network-name">Github</span></a>
-
<a href="#">One more separated link</a>
+
                    </li>
-
</li>
+
                    <li><a href="https://plus.google.com/+Startbootstrap/posts" class="btn btn-default btn-lg"><i class="fa fa-google-plus fa-fw"></i> <span class="network-name">Google+</span></a>
-
</ul>
+
                    </li>
-
</li>
+
                </ul>
-
</ul>
+
            </div>
-
<form class="navbar-form navbar-left" role="search">
+
        </div>
-
<div class="form-group">
+
    </section>
-
<input class="form-control" type="text">
+
 
-
</div> <button type="submit" class="btn btn-default">Submit</button>
+
    <div id="map"></div>
-
</form>
+
 
-
<ul class="nav navbar-nav navbar-right">
+
    <!-- Core JavaScript Files -->
-
<li>
+
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
-
<a href="#">Link</a>
+
    <script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
-
</li>
+
    <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
-
<li class="dropdown">
+
 
-
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown<strong class="caret"></strong></a>
+
    <!-- Google Maps API Key - You will need to use your own API key to use the map feature -->
-
<ul class="dropdown-menu">
+
    <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCRngKslUGJTlibkQ3FkfTxj3Xss1UlZDA&sensor=false"></script>
-
<li>
+
 
-
<a href="#">Action</a>
+
    <!-- Custom Theme JavaScript -->
-
</li>
+
    <script src="js/grayscale.js"></script>
-
<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>
+
-
</ul>
+
-
</li>
+
-
</ul>
+
-
</div>
+
-
+
-
</nav>
+
-
</div>
+
-
</div>
+
-
<div class="row clearfix">
+
-
<div class="col-md-12 column">
+
-
<p>
+
-
Lorem ipsum dolor sit amet, <strong>consectetur adipiscing elit</strong>. Aliquam eget sapien sapien. Curabitur in metus urna. In hac habitasse platea dictumst. Phasellus eu sem sapien, sed vestibulum velit. Nam purus nibh, lacinia non faucibus et, pharetra in dolor. Sed iaculis posuere diam ut cursus. <em>Morbi commodo sodales nisi id sodales. Proin consectetur, nisi id commodo imperdiet, metus nunc consequat lectus, id bibendum diam velit et dui.</em> Proin massa magna, vulputate nec bibendum nec, posuere nec lacus. <small>Aliquam mi erat, aliquam vel luctus eu, pharetra quis elit. Nulla euismod ultrices massa, et feugiat ipsum consequat eu.</small>
+
-
</p>
+
-
</div>
+
-
</div>
+
-
</div>
+
</body>
</body>
 +
</html>
</html>

Revision as of 19:24, 4 April 2014

Grayscale - Free One Page Theme for Bootstrap 3

Grayscale

A free, premium quality, responsive one page Bootstrap theme created by Start Bootstrap.

About Grayscale

Grayscale is a premium quality, free Bootstrap 3 theme created by Start Bootstrap. It can be yours right now, all you need to do is download the template on the preview page. You can use this template for any purpose, personal or commercial.

This striking, black and white theme features stock photographs by Gratisography along with a custom Google Map skin courtesy of Snazzy Maps.

With this template, just the slightest splash of color can make a huge impact on the overall presentation and design.

Download Grayscale

You can download Grayscale for free on the download page at Start Bootstrap. You can also get the source code directly from GitHub if you prefer. Additionally, Grayscale is the first Start Bootstrap theme to come with a LESS file for easy color customization!

Visit Download Page

Contact Start Bootstrap

Feel free to email us to provide some feedback on our templates, give us suggestions for new templates and themes, or to just say hello!

feedback@startbootstrap.com