--- /dev/null
+/*
+ * Globals
+ */
+
+/* Links */
+a,
+a:focus,
+a:hover {
+ color: #fff;
+}
+
+/* Custom default button */
+.btn-default,
+.btn-default:hover,
+.btn-default:focus {
+ color: #333;
+ text-shadow: none; /* Prevent inheritence from `body` */
+ background-color: #fff;
+ border: 1px solid #fff;
+}
+
+
+/*
+ * Base structure
+ */
+
+html,
+body {
+ height: 100%;
+ background-color: #333;
+}
+body {
+ color: #fff;
+ text-align: center;
+ text-shadow: 0 1px 3px rgba(0,0,0,.5);
+ box-shadow: inset 0 0 100px rgba(0,0,0,.5);
+}
+
+/* Extra markup and styles for table-esque vertical and horizontal centering */
+.site-wrapper {
+ display: table;
+ width: 100%;
+ min-height: 100%;
+}
+.site-wrapper-inner {
+ display: table-cell;
+ vertical-align: top;
+}
+.cover-container {
+ margin-left: auto;
+ margin-right: auto;
+}
+
+/* Padding for spacing */
+.inner {
+ padding: 30px;
+}
+
+
+/*
+ * Header
+ */
+.masthead-brand {
+ margin-top: 10px;
+ margin-bottom: 10px;
+}
+
+.masthead-nav > li {
+ display: inline-block;
+}
+.masthead-nav > li + li {
+ margin-left: 20px;
+}
+.masthead-nav > li > a {
+ padding-left: 0;
+ padding-right: 0;
+ font-size: 16px;
+ font-weight: bold;
+ color: #fff; /* IE8 proofing */
+ color: rgba(255,255,255,.75);
+ border-bottom: 2px solid transparent;
+}
+.masthead-nav > li > a:hover,
+.masthead-nav > li > a:focus {
+ background-color: transparent;
+ border-bottom-color: rgba(255,255,255,.25);
+}
+.masthead-nav > .active > a,
+.masthead-nav > .active > a:hover,
+.masthead-nav > .active > a:focus {
+ color: #fff;
+ border-bottom-color: #fff;
+}
+
+@media (min-width: 768px) {
+ .masthead-brand {
+ float: left;
+ }
+ .masthead-nav {
+ float: right;
+ }
+}
+
+
+/*
+ * Cover
+ */
+
+.cover {
+ padding: 0 20px;
+}
+.cover .btn-lg {
+ padding: 10px 20px;
+ font-weight: bold;
+}
+
+
+/*
+ * Footer
+ */
+
+.mastfoot {
+ color: #999; /* IE8 proofing */
+ color: rgba(255,255,255,.5);
+}
+
+
+/*
+ * Affix and center
+ */
+
+@media (min-width: 768px) {
+ /* Pull out the header and footer */
+ .masthead {
+ position: fixed;
+ top: 0;
+ }
+ .mastfoot {
+ position: fixed;
+ bottom: 0;
+ }
+ /* Start the vertical centering */
+ .site-wrapper-inner {
+ vertical-align: middle;
+ }
+ /* Handle the widths */
+ .masthead,
+ .mastfoot,
+ .cover-container {
+ width: 100%; /* Must be percentage or pixels for horizontal alignment */
+ }
+}
+
+@media (min-width: 992px) {
+ .masthead,
+ .mastfoot,
+ .cover-container {
+ width: 700px;
+ }
+}
--- /dev/null
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <meta name="description" content="">
+ <meta name="author" content="">
+ <link rel="shortcut icon" href="../../docs-assets/ico/favicon.png">
+
+ <title>Cover Template for Bootstrap</title>
+
+ <!-- Bootstrap core CSS -->
+ <link href="../../dist/css/bootstrap.css" rel="stylesheet">
+
+ <!-- Custom styles for this template -->
+ <link href="cover.css" rel="stylesheet">
+
+ <!-- Just for debugging purposes. Don't actually copy this line! -->
+ <!--[if lt IE 9]><script src="../../docs-assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
+
+ <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
+ <!--[if lt IE 9]>
+ <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
+ <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
+ <![endif]-->
+ </head>
+
+ <body>
+
+ <div class="site-wrapper">
+
+ <div class="site-wrapper-inner">
+
+ <div class="cover-container">
+
+ <div class="masthead clearfix">
+ <div class="inner">
+ <h3 class="masthead-brand">Cover</h3>
+ <ul class="nav masthead-nav">
+ <li class="active"><a href="#">Home</a></li>
+ <li><a href="#">Features</a></li>
+ <li><a href="#">Contact</a></li>
+ </ul>
+ </div>
+ </div>
+
+ <div class="inner cover">
+ <h1 class="cover-heading">Cover your page.</h1>
+ <p class="lead">Cover is a one-page template for building simple and beautiful home pages. Download, edit the text, and add your own fullscreen background photo to make it your own.</p>
+ <p class="lead">
+ <a href="#" class="btn btn-lg btn-default">Learn more</a>
+ </p>
+ </div>
+
+ <div class="mastfoot">
+ <div class="inner">
+ <p>Cover template for <a href="http://getbootstrap.com">Bootstrap</a>, by <a href="https://twitter.com/mdo">@mdo</a>.</p>
+ </div>
+ </div>
+
+ </div>
+
+ </div>
+
+ </div>
+
+ <!-- Bootstrap core JavaScript
+ ================================================== -->
+ <!-- Placed at the end of the document so the pages load faster -->
+ <script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
+ <script src="../../dist/js/bootstrap.min.js"></script>
+ <script src="../../docs-assets/js/holder.js"></script>
+ </body>
+</html>
<h4>Carousel</h4>
<p>Customize the navbar and carousel, then add some new components.</p>
</div>
+ <div class="col-xs-6 col-md-4">
+ <a class="thumbnail" href="../examples/cover/">
+ <img src="../examples/screenshots/cover.jpg" alt="">
+ </a>
+ <h4>Cover</h4>
+ <p>A one-page template for building simple and beautiful home pages.</p>
+ </div>
+ <div class="clearfix visible-xs"></div>
+
<div class="col-xs-6 col-md-4">
<a class="thumbnail" href="../examples/dashboard/">
<img src="../examples/screenshots/dashboard.jpg" alt="">
<h4>Dashboard</h4>
<p>Basic structure for a admin dashboard with fixed sidebar and navbar.</p>
</div>
- <div class="clearfix visible-xs"></div>
-
<div class="col-xs-6 col-md-4">
<a class="thumbnail" href="../examples/non-responsive/">
<img src="../examples/screenshots/non-responsive.jpg" alt="">
<h4>Non-responsive Bootstrap</h4>
<p>Easily disable the responsiveness of Bootstrap <a href="../getting-started/#disable-responsive">per our docs</a>.</p>
</div>
+ <div class="clearfix visible-xs"></div>
+
<div class="col-xs-6 col-md-4">
<a class="thumbnail" href="../examples/theme/">
<img src="../examples/screenshots/theme.jpg" alt="">