Merge branch 'master' into pr/11744

Conflicts:
	dist/css/bootstrap.min.css

Gruntfile.js

 /* jshint node: true */
 
-module.exports = function(grunt) {
+module.exports = function (grunt) {
   "use strict";
 
   // Force use of Unix newlines
@@ -40,6 +40,21 @@ module.exports = function(grunt) {
       }
     },
 
+    jscs: {
+      options: {
+        config: 'js/.jscs.json',
+      },
+      gruntfile: {
+        src: ['Gruntfile.js']
+      },
+      src: {
+        src: ['js/*.js']
+      },
+      test: {
+        src: ['js/tests/unit/*.js']
+      }
+    },
+
     concat: {
       options: {
         banner: '<%= banner %><%= jqueryCheck %>',
@@ -288,6 +303,7 @@ module.exports = function(grunt) {
   grunt.loadNpmTasks('grunt-contrib-watch');
   grunt.loadNpmTasks('grunt-html-validation');
   grunt.loadNpmTasks('grunt-jekyll');
+  grunt.loadNpmTasks('grunt-jscs-checker');
   grunt.loadNpmTasks('grunt-recess');
   grunt.loadNpmTasks('grunt-saucelabs');
   grunt.loadNpmTasks('grunt-sed');
@@ -296,7 +312,7 @@ module.exports = function(grunt) {
   grunt.registerTask('validate-html', ['jekyll', 'validation']);
 
   // Test task.
-  var testSubtasks = ['dist-css', 'jshint', 'qunit', 'validate-html'];
+  var testSubtasks = ['dist-css', 'jshint', 'jscs', 'qunit', 'validate-html'];
   // Only run Sauce Labs tests if there's a Sauce access key
   if (typeof process.env.SAUCE_ACCESS_KEY !== 'undefined') {
     testSubtasks.push('connect');

README.md

@@ -123,7 +123,6 @@ Keep track of development and community news.
 
 * Follow [@twbootstrap on Twitter](http://twitter.com/twbootstrap).
 * Read and subscribe to [The Official Bootstrap Blog](http://blog.getbootstrap.com).
-* Have a question that's not a feature request or bug report? [Ask on the mailing list.](http://groups.google.com/group/twitter-bootstrap)
 * Chat with fellow Bootstrappers in IRC. On the `irc.freenode.net` server, in the `##twitter-bootstrap` channel.
 
 

_includes/footer.html

@@ -2,7 +2,7 @@
 ================================================== -->
 <!-- Placed at the end of the document so the pages load faster -->
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
-<script src="{{ page.base_url }}dist/js/bootstrap.js"></script>
+<script src="{{ page.base_url }}dist/js/bootstrap.min.js"></script>
 
 <script src="{{ page.base_url }}docs-assets/js/holder.js"></script>
 

_includes/header.html

 <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="">
+<meta name="description" content="Bootstrap, a sleek, intuitive, and powerful mobile first front-end framework for faster and easier web development.">
+<meta name="keywords" content="HTML, CSS, JS, JavaScript, framework, bootstrap, front-end, frontend, web development">
+<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contibutors">
 
 <title>
   {% if page.title == "Bootstrap" %}

_includes/nav-components.html

@@ -121,6 +121,7 @@
     <li><a href="#list-group-basic">Basic example</a></li>
     <li><a href="#list-group-badges">Badges</a></li>
     <li><a href="#list-group-linked">Linked items</a></li>
+    <li><a href="#list-group-contextual-classes">Contextual classes</a></li>
     <li><a href="#list-group-custom-content">Custom content</a></li>
   </ul>
 </li>

_includes/nav-css.html

@@ -16,6 +16,7 @@
     <li><a href="#grid-media-queries">Media queries</a></li>
     <li><a href="#grid-options">Grid options</a></li>
     <li><a href="#grid-example-basic">Ex: Stacked-to-horizonal</a></li>
+    <li><a href="#grid-example-fluid">Ex: Fluid container</a></li>
     <li><a href="#grid-example-mixed">Ex: Mobile and desktops</a></li>
     <li><a href="#grid-example-mixed-complete">Ex: Mobile, tablet, desktops</a></li>
     <li><a href="#grid-responsive-resets">Responsive column resets</a></li>
@@ -37,7 +38,14 @@
     <li><a href="#type-lists">Lists</a></li>
   </ul>
 </li>
-<li><a href="#code">Code</a></li>
+<li>
+  <a href="#code">Code</a>
+  <ul class="nav">
+    <li><a href="#code-inline">Inline code</a></li>
+    <li><a href="#code-user-input">User input</a></li>
+    <li><a href="#code-block">Blocks of code</a></li>
+  </ul>
+</li>
 <li>
   <a href="#tables">Tables</a>
   <ul class="nav">

about.html

@@ -69,7 +69,6 @@ base_url: "../"
   <p class="lead">Stay up to date on the development of Bootstrap and reach out to the community with these helpful resources.</p>
   <ul>
     <li>Read and subscribe to <a href="http://blog.getbootstrap.com/">The Official Bootstrap Blog</a>.</li>
-    <li>Have a question that's not a feature request or bug report? <a href="http://groups.google.com/group/twitter-bootstrap">Ask on the mailing list.</a></li>
     <li>Chat with fellow Bootstrappers using IRC in the <code>irc.freenode.net</code> server, in the <a href="irc://irc.freenode.net/#twitter-bootstrap">##twitter-bootstrap channel</a>.</li>
     <li>Find inspiring examples of people building with Bootstrap at the <a href="http://expo.getbootstrap.com">Bootstrap Expo</a>.</li>
   </ul>

components.html

@@ -16,7 +16,8 @@ base_url: "../"
 
     <h2 id="glyphicons-glyphs">Available glyphs</h2>
     <p>Includes 200 glyphs in font format from the Glyphicon Halflings set. <a href="http://glyphicons.com/">Glyphicons</a> Halflings are normally not available for free, but their creator has made them available for Bootstrap free of cost. As a thank you, we only ask that you to include a link back to <a href="http://glyphicons.com/">Glyphicons</a> whenever possible.</p>
-    <ul class="bs-glyphicons">
+    <div class="bs-glyphicons">
+      <ul class="bs-glyphicons-list">
         <li>
           <span class="glyphicon glyphicon-adjust"></span>
           <span class="glyphicon-class">glyphicon glyphicon-adjust</span>
@@ -818,6 +819,7 @@ base_url: "../"
           <span class="glyphicon-class">glyphicon glyphicon-zoom-out</span>
         </li>
       </ul>
+    </div>
 
 
     <h2 id="glyphicons-how-to-use">How to use</h2>
@@ -1172,7 +1174,7 @@ base_url: "../"
         <a class="btn btn-default" role="button">Middle</a>
         <div class="btn-group">
           <a class="btn btn-default dropdown-toggle" data-toggle="dropdown">
-            Right dropdown <span class="caret"></span>
+            Dropdown <span class="caret"></span>
           </a>
           <ul class="dropdown-menu" role="menu">
             <li><a href="#">Action</a></li>
@@ -3354,6 +3356,43 @@ body { padding-bottom: 70px; }
   <a href="#" class="list-group-item">Porta ac consectetur ac</a>
   <a href="#" class="list-group-item">Vestibulum at eros</a>
 </div>
+{% endhighlight %}
+
+    <h3 id="list-group-contextual-classes">Contextual classes</h3>
+    <p>Use contextual classes to style list items, default or linked. Also includes <code>.active</code> state.</p>
+    <div class="bs-example">
+      <div class="row">
+        <div class="col-sm-6">
+          <ul class="list-group">
+            <li class="list-group-item list-group-item-success">Dapibus ac facilisis in</li>
+            <li class="list-group-item list-group-item-warning">Porta ac consectetur ac</li>
+            <li class="list-group-item list-group-item-danger">Vestibulum at eros</li>
+            <li class="list-group-item list-group-item-info">Cras sit amet nibh libero</li>
+          </ul>
+        </div>
+        <div class="col-sm-6">
+          <div class="list-group">
+            <a href="#" class="list-group-item list-group-item-success">Dapibus ac facilisis in</a>
+            <a href="#" class="list-group-item list-group-item-warning">Porta ac consectetur ac</a>
+            <a href="#" class="list-group-item list-group-item-danger">Vestibulum at eros</a>
+            <a href="#" class="list-group-item list-group-item-info">Cras sit amet nibh libero</a>
+          </div>
+        </div>
+      </div>
+    </div>
+{% highlight html %}
+<ul class="list-group">
+  <li class="list-group-item list-group-item-success">Dapibus ac facilisis in</li>
+  <li class="list-group-item list-group-item-warning">Porta ac consectetur ac</li>
+  <li class="list-group-item list-group-item-danger">Vestibulum at eros</li>
+  <li class="list-group-item list-group-item-info">Cras sit amet nibh libero</li>
+</ul>
+<div class="list-group">
+  <a href="#" class="list-group-item list-group-item-success">Dapibus ac facilisis in</a>
+  <a href="#" class="list-group-item list-group-item-warning">Porta ac consectetur ac</a>
+  <a href="#" class="list-group-item list-group-item-danger">Vestibulum at eros</a>
+  <a href="#" class="list-group-item list-group-item-info">Cras sit amet nibh libero</a>
+</div>
 {% endhighlight %}
 
     <h3 id="list-group-custom-content">Custom content</h3>

css.html

@@ -76,7 +76,7 @@ base_url: "../"
     <h3 id="grid-intro">Introduction</h3>
     <p>Grid systems are used for creating page layouts through a series of rows and columns that house your content. Here's how the Bootstrap grid system works:</p>
     <ul>
-      <li>Rows must be placed within a <code>.container</code> for proper alignment and padding.</li>
+      <li>Rows must be placed within a <code>.container</code> (fixed-width) or <code>.container-fluid</code> (full-width) for proper alignment and padding.</li>
       <li>Use rows to create horizontal groups of columns.</li>
       <li>Content should be placed within columns, and only columns may be immediate children of rows.</li>
       <li>Predefined grid classes like <code>.row</code> and <code>.col-xs-4</code> are available for quickly making grid layouts. LESS mixins can also be used for more semantic layouts.</li>
@@ -249,6 +249,16 @@ base_url: "../"
   <div class="col-md-6">.col-md-6</div>
   <div class="col-md-6">.col-md-6</div>
 </div>
+{% endhighlight %}
+
+    <h3 id="grid-example-fluid">Example: Fluid container</h3>
+    <p>Turn any fixed-width grid layout into a full-width layout by changing your outermost <code>.container</code> to <code>.container-fluid</code>.</p>
+{% highlight html %}
+<div class="container-fluid">
+  <div class="row">
+    ...
+  </div>
+</div>
 {% endhighlight %}
 
     <h3 id="grid-example-mixed">Example: Mobile and desktop</h3>
@@ -1047,7 +1057,7 @@ base_url: "../"
       <h1 id="code">Code</h1>
     </div>
 
-    <h2>Inline</h2>
+    <h2 id="code-inline">Inline</h2>
     <p>Wrap inline snippets of code with <code>&lt;code&gt;</code>.</p>
 <div class="bs-example">
   For example, <code>&lt;section&gt;</code> should be wrapped as inline.
@@ -1056,7 +1066,16 @@ base_url: "../"
 For example, <code>&lt;section&gt;</code> should be wrapped as inline.
 {% endhighlight %}
 
-    <h2>Basic block</h2>
+    <h2 id="code-user-input">User input</h2>
+    <p>Use the <code>&lt;kbd&gt;</code> to indicate input that is typically entered via keyboard.</p>
+<div class="bs-example">
+  To switch directories, type <kbd>cd</kbd> followed the name of the directory.
+</div>
+{% highlight html %}
+  To switch directories, type <kbd>cd</kbd> followed the name of the directory.
+{% endhighlight %}
+
+    <h2 id="code-block">Basic block</h2>
     <p>Use <code>&lt;pre&gt;</code> for multiple lines of code. Be sure to escape any angle brackets in the code for proper rendering.</p>
 <div class="bs-example">
   <pre>&lt;p&gt;Sample text here...&lt;/p&gt;</pre>
@@ -1327,6 +1346,12 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
             </td>
             <td>Indicates a dangerous or potentially negative action</td>
           </tr>
+          <tr>
+            <td>
+              <code>.info</code>
+            </td>
+            <td>Indicates a neutral informative change or action</td>
+          </tr>
         </tbody>
       </table>
     </div>
@@ -1383,6 +1408,18 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
             <td>Column content</td>
             <td>Column content</td>
           </tr>
+          <tr>
+            <td>8</td>
+            <td>Column content</td>
+            <td>Column content</td>
+            <td>Column content</td>
+          </tr>
+          <tr class="info">
+            <td>9</td>
+            <td>Column content</td>
+            <td>Column content</td>
+            <td>Column content</td>
+          </tr>
         </tbody>
       </table>
     </div><!-- /example -->
@@ -1392,6 +1429,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
 <tr class="success">...</tr>
 <tr class="warning">...</tr>
 <tr class="danger">...</tr>
+<tr class="info">...</tr>
 
 <!-- On cells (`td` or `th`) -->
 <tr>
@@ -1399,6 +1437,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
   <td class="success">...</td>
   <td class="warning">...</td>
   <td class="danger">...</td>
+  <td class="info">...</td>
 </tr>
 {% endhighlight %}
 

dist/js/bootstrap.js

@@ -763,7 +763,7 @@ if (typeof jQuery === "undefined") { throw new Error("Bootstrap requires jQuery"
 
     if (e.keyCode == 38 && index > 0)                 index--                        // up
     if (e.keyCode == 40 && index < $items.length - 1) index++                        // down
-    if (!~index)                                      index=0
+    if (!~index)                                      index = 0
 
     $items.eq(index).focus()
   }
@@ -1013,7 +1013,7 @@ if (typeof jQuery === "undefined") { throw new Error("Bootstrap requires jQuery"
     } else if (!this.isShown && this.$backdrop) {
       this.$backdrop.removeClass('in')
 
-      $.support.transition && this.$element.hasClass('fade')?
+      $.support.transition && this.$element.hasClass('fade') ?
         this.$backdrop
           .one($.support.transition.end, callback)
           .emulateTransitionEnd(150) :
@@ -1213,7 +1213,7 @@ if (typeof jQuery === "undefined") { throw new Error("Bootstrap requires jQuery"
   }
 
   Tooltip.prototype.show = function () {
-    var e = $.Event('show.bs.'+ this.type)
+    var e = $.Event('show.bs.' + this.type)
 
     if (this.hasContent() && this.enabled) {
       this.$element.trigger(e)

docs-assets/css/docs.css

@@ -921,7 +921,6 @@ h1[id] {
  */
 
 .highlight {
-  display: none; /* hidden by default, until >480px */
   padding: 9px 14px;
   margin-bottom: 14px;
   background-color: #f7f7f9;
@@ -949,13 +948,6 @@ h1[id] {
   color: #bebec5;
 }
 
-/* Show code snippets when we have the space */
-@media (min-width: 481px) {
-  .highlight {
-    display: block;
-  }
-}
-
 
 /*
  * Responsive tests
@@ -1037,11 +1029,12 @@ h1[id] {
  */
 
 .bs-glyphicons {
+  margin: 0 -19px 20px -16px;
+  overflow: hidden;
+}
+.bs-glyphicons-list {
   padding-left: 0;
-  padding-bottom: 1px;
-  margin-bottom: 20px;
   list-style: none;
-  overflow: hidden;
 }
 .bs-glyphicons li {
   float: left;
@@ -1049,7 +1042,7 @@ h1[id] {
   height: 115px;
   padding: 10px;
   margin: 0 -1px -1px 0;
-  font-size: 12px;
+  font-size: 10px;
   line-height: 1.4;
   text-align: center;
   border: 1px solid #ddd;
@@ -1069,8 +1062,13 @@ h1[id] {
 }
 
 @media (min-width: 768px) {
+  .bs-glyphicons {
+    margin-left: 0;
+    margin-right: 0;
+  }
   .bs-glyphicons li {
     width: 12.5%;
+    font-size: 12px;
   }
 }
 

examples/cover/cover.css

+/*
+ * 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;
+  }
+}

examples/cover/index.html

+<!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>

examples/dashboard/dashboard.css

+/*
+ * Base structure
+ */
+
+/* Move down content because we have a fixed navbar that is 50px tall */
+body {
+  padding-top: 50px;
+}
+
+
+/*
+ * Global add-ons
+ */
+
+.sub-header {
+  padding-bottom: 10px;
+  border-bottom: 1px solid #eee;
+}
+
+
+/*
+ * Sidebar
+ */
+
+/* Hide for mobile, show later */
+.sidebar {
+  display: none;
+}
+@media (min-width: 768px) {
+  .sidebar {
+    position: fixed;
+    top: 0;
+    left: 0;
+    bottom: 0;
+    z-index: 1000;
+    display: block;
+    padding: 70px 20px 20px;
+    background-color: #f5f5f5;
+    border-right: 1px solid #eee;
+  }
+}
+
+/* Sidebar navigation */
+.nav-sidebar {
+  margin-left: -20px;
+  margin-right: -21px; /* 20px padding + 1px border */
+  margin-bottom: 20px;
+}
+.nav-sidebar > li > a {
+  padding-left: 20px;
+  padding-right: 20px;
+}
+.nav-sidebar > .active > a {
+  color: #fff;
+  background-color: #428bca;
+}
+
+
+/*
+ * Main content
+ */
+
+.main {
+  padding: 20px;
+}
+@media (min-width: 768px) {
+  .main {
+    padding-left: 40px;
+    pading-right: 40px;
+  }
+}
+.main .page-header {
+  margin-top: 0;
+}
+
+
+/*
+ * Placeholder dashboard ideas
+ */
+
+.placeholders {
+  margin-bottom: 30px;
+  text-align: center;
+}
+.placeholders h4 {
+  margin-bottom: 0;
+}
+.placeholder {
+  margin-bottom: 20px;
+}
+.placeholder img {
+  border-radius: 50%;
+}

examples/dashboard/index.html

+<!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>Dashboard Template for Bootstrap</title>
+
+    <!-- Bootstrap core CSS -->
+    <link href="../../dist/css/bootstrap.css" rel="stylesheet">
+
+    <!-- Custom styles for this template -->
+    <link href="dashboard.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="navbar navbar-inverse navbar-fixed-top" role="navigation">
+      <div class="container-fluid">
+        <div class="navbar-header">
+          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
+            <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="#">Project name</a>
+        </div>
+        <div class="navbar-collapse collapse">
+          <ul class="nav navbar-nav navbar-right">
+            <li><a href="#">Dashboard</a></li>
+            <li><a href="#">Settings</a></li>
+            <li><a href="#">Profile</a></li>
+            <li><a href="#">Help</a></li>
+          </ul>
+          <form action="" class="navbar-form navbar-right">
+            <input type="text" class="form-control" placeholder="Search...">
+          </form>
+        </div>
+      </div>
+    </div>
+
+    <div class="container-fluid">
+      <div class="row">
+        <div class="col-sm-3 sidebar">
+          <ul class="nav nav-sidebar">
+            <li class="active"><a href="#">Overview</a></li>
+            <li><a href="#">Reports</a></li>
+            <li><a href="#">Analytics</a></li>
+            <li><a href="#">Export</a></li>
+          </ul>
+          <ul class="nav nav-sidebar">
+            <li><a href="">Nav item</a></li>
+            <li><a href="">Nav item again</a></li>
+            <li><a href="">One more nav</a></li>
+            <li><a href="">Another nav item</a></li>
+            <li><a href="">More navigation</a></li>
+          </ul>
+          <ul class="nav nav-sidebar">
+            <li><a href="">Nav item again</a></li>
+            <li><a href="">One more nav</a></li>
+            <li><a href="">Another nav item</a></li>
+          </ul>
+        </div>
+        <div class="col-sm-9 col-sm-offset-3 main">
+          <h1 class="page-header">Dashboard</h1>
+
+          <div class="row placeholders">
+            <div class="col-xs-6 col-sm-3 placeholder">
+              <img data-src="holder.js/200x200/auto/sky" class="img-responsive" alt="Generic placeholder thumbnail">
+              <h4>Label</h4>
+              <span class="text-muted">Something else</span>
+            </div>
+            <div class="col-xs-6 col-sm-3 placeholder">
+              <img data-src="holder.js/200x200/auto/vine" class="img-responsive" alt="Generic placeholder thumbnail">
+              <h4>Label</h4>
+              <span class="text-muted">Something else</span>
+            </div>
+            <div class="col-xs-6 col-sm-3 placeholder">
+              <img data-src="holder.js/200x200/auto/sky" class="img-responsive" alt="Generic placeholder thumbnail">
+              <h4>Label</h4>
+              <span class="text-muted">Something else</span>
+            </div>
+            <div class="col-xs-6 col-sm-3 placeholder">
+              <img data-src="holder.js/200x200/auto/vine" class="img-responsive" alt="Generic placeholder thumbnail">
+              <h4>Label</h4>
+              <span class="text-muted">Something else</span>
+            </div>
+          </div>
+
+          <h2 class="sub-header">Section title</h2>
+          <div class="table-responsive">
+            <table class="table table-striped">
+              <thead>
+                <tr>
+                  <th>#</th>
+                  <th>Header</th>
+                  <th>Header</th>
+                  <th>Header</th>
+                  <th>Header</th>
+                </tr>
+              </thead>
+              <tbody>
+                <tr>
+                  <td>1,001</td>
+                  <td>Lorem</td>
+                  <td>ipsum</td>
+                  <td>dolor</td>
+                  <td>sit</td>
+                </tr>
+                <tr>
+                  <td>1,002</td>
+                  <td>amet</td>
+                  <td>consectetur</td>
+                  <td>adipiscing</td>
+                  <td>elit</td>
+                </tr>
+                <tr>
+                  <td>1,003</td>
+                  <td>Integer</td>
+                  <td>nec</td>
+                  <td>odio</td>
+                  <td>Praesent</td>
+                </tr>
+                <tr>
+                  <td>1,003</td>
+                  <td>libero</td>
+                  <td>Sed</td>
+                  <td>cursus</td>
+                  <td>ante</td>
+                </tr>
+                <tr>
+                  <td>1,004</td>
+                  <td>dapibus</td>
+                  <td>diam</td>
+                  <td>Sed</td>
+                  <td>nisi</td>
+                </tr>
+                <tr>
+                  <td>1,005</td>
+                  <td>Nulla</td>
+                  <td>quis</td>
+                  <td>sem</td>
+                  <td>at</td>
+                </tr>
+                <tr>
+                  <td>1,006</td>
+                  <td>nibh</td>
+                  <td>elementum</td>
+                  <td>imperdiet</td>
+                  <td>Duis</td>
+                </tr>
+                <tr>
+                  <td>1,007</td>
+                  <td>sagittis</td>
+                  <td>ipsum</td>
+                  <td>Praesent</td>
+                  <td>mauris</td>
+                </tr>
+                <tr>
+                  <td>1,008</td>
+                  <td>Fusce</td>
+                  <td>nec</td>
+                  <td>tellus</td>
+                  <td>sed</td>
+                </tr>
+                <tr>
+                  <td>1,009</td>
+                  <td>augue</td>
+                  <td>semper</td>
+                  <td>porta</td>
+                  <td>Mauris</td>
+                </tr>
+                <tr>
+                  <td>1,010</td>
+                  <td>massa</td>
+                  <td>Vestibulum</td>
+                  <td>lacinia</td>
+                  <td>arcu</td>
+                </tr>
+                <tr>
+                  <td>1,011</td>
+                  <td>eget</td>
+                  <td>nulla</td>
+                  <td>Class</td>
+                  <td>aptent</td>
+                </tr>
+                <tr>
+                  <td>1,012</td>
+                  <td>taciti</td>
+                  <td>sociosqu</td>
+                  <td>ad</td>
+                  <td>litora</td>
+                </tr>
+                <tr>
+                  <td>1,013</td>
+                  <td>torquent</td>
+                  <td>per</td>
+                  <td>conubia</td>
+                  <td>nostra</td>
+                </tr>
+                <tr>
+                  <td>1,014</td>
+                  <td>per</td>
+                  <td>inceptos</td>
+                  <td>himenaeos</td>
+                  <td>Curabitur</td>
+                </tr>
+                <tr>
+                  <td>1,015</td>
+                  <td>sodales</td>
+                  <td>ligula</td>
+                  <td>in</td>
+                  <td>libero</td>
+                </tr>
+              </tbody>
+            </table>
+          </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>

getting-started.html

@@ -17,7 +17,7 @@ base_url: "../"
 
     <h3 id="download-compiled">Compiled CSS, JS, and fonts</h3>
     <p>The fastest way to get Bootstrap is to download the precompiled and minified versions of our CSS, JavaScript, and fonts. No documentation or original source code files are included.</p>
-    <p><a class="btn btn-lg btn-primary" href="{{ site.download_dist }}" onclick="_gaq.push(['_trackEvent', 'Getting started', 'Download', 'Download compiled']);" role="button">Download precompiled Bootstrap</a></p>
+    <p><a class="btn btn-lg btn-primary" href="{{ site.download_dist }}" onclick="_gaq.push(['_trackEvent', 'Getting started', 'Download', 'Download compiled']);" role="button">Download Bootstrap</a></p>
 
     <h3 id="download-additional">Additional downloads</h3>
     <div class="bs-docs-dl-options">
@@ -261,6 +261,22 @@ bootstrap/
         <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="">
+        </a>
+        <h4>Dashboard</h4>
+        <p>Basic structure for a admin dashboard with fixed sidebar and navbar.</p>
+      </div>
       <div class="col-xs-6 col-md-4">
         <a class="thumbnail" href="../examples/non-responsive/">
           <img src="../examples/screenshots/non-responsive.jpg" alt="">
@@ -805,7 +821,8 @@ bootstrap/
 {% highlight html %}
 <meta http-equiv="X-UA-Compatible" content="IE=edge">
 {% endhighlight %}
-    <p>This tag is included in all docs pages and examples to ensure the best rendering possible in each supported version of Internet Explorer.</p>
+    <p>Confirm the document mode by opening the debugging tools: press <kbd>F12</kbd> and check the "Document Mode".</p>
+    <p>This tag is included in all Bootstrap's documentation and examples to ensure the best rendering possible in each supported version of Internet Explorer.</p>
     <p>See <a href="http://stackoverflow.com/questions/6771258/whats-the-difference-if-meta-http-equiv-x-ua-compatible-content-ie-edge">this StackOverflow question</a> for more information.</p>
 
     <h3 id="ie-10-width">Internet Explorer 10 in Windows 8 and Windows Phone 8</h3>

javascript.html

@@ -30,7 +30,7 @@ base_url: "../"
     <h3 id="js-data-attrs">Data attributes</h3>
     <p>You can use all Bootstrap plugins purely through the markup API without writing a single line of JavaScript. This is Bootstrap's first-class API and should be your first consideration when using a plugin.</p>
 
-    <p>That said, in some situations it may be desirable to turn this functionality off. Therefore, we also provide the ability to disable the data attribute API by unbinding all events on the document namespaced with <code>data-api</code>. This looks like this:
+    <p>That said, in some situations it may be desirable to turn this functionality off. Therefore, we also provide the ability to disable the data attribute API by unbinding all events on the document namespaced with <code>data-api</code>. This looks like this:</p>
 {% highlight js %}
 $(document).off('.data-api')
 {% endhighlight %}
@@ -50,7 +50,7 @@ $('.btn.danger').button('toggle').addClass('fat')
 {% highlight js %}
 $('#myModal').modal()                      // initialized with defaults
 $('#myModal').modal({ keyboard: false })   // initialized with no keyboard
-$('#myModal').modal('show')                // initializes and invokes show immediately</p>
+$('#myModal').modal('show')                // initializes and invokes show immediately
 {% endhighlight %}
 
     <p>Each plugin also exposes its raw constructor on a <code>Constructor</code> property: <code>$.fn.popover.Constructor</code>. If you'd like to get a particular plugin instance, retrieve it directly from an element: <code>$('[rel=popover]').data('popover')</code>.</p>
@@ -415,7 +415,7 @@ $('#myModal').on('hidden.bs.modal', function (e) {
       </nav> <!-- /navbar-example -->
     </div> <!-- /example -->
 
-    <h3>Within tabs</h3>
+    <h3>Within pills</h3>
     <div class="bs-example">
       <ul class="nav nav-pills">
         <li class="active"><a href="#">Regular link</a></li>
@@ -449,7 +449,7 @@ $('#myModal').on('hidden.bs.modal', function (e) {
             <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Separated link</a></li>
           </ul>
         </li>
-      </ul> <!-- /tabs -->
+      </ul> <!-- /pills -->
     </div> <!-- /example -->
 
 

js/.jscs.json

+{
+    "requireSpaceAfterKeywords": ["if", "else", "for", "while", "do", "switch", "return"],
+    "requireSpacesInFunctionExpression": { "beforeOpeningCurlyBrace": true },
+    "disallowLeftStickedOperators": ["?", "+", "-", "/", "*", "=", "==", "===", "!=", "!==", ">", ">=", "<", "<="],
+    "requireRightStickedOperators": ["!"],
+    "disallowRightStickedOperators": ["?", "/", "*", ":", "=", "==", "===", "!=", "!==", ">", ">=", "<", "<="],
+    "disallowSpaceAfterPrefixUnaryOperators": ["++", "--", "+", "-", "~", "!"],
+    "disallowSpaceBeforePostfixUnaryOperators": ["++", "--"],
+    "requireSpaceBeforeBinaryOperators": ["+", "-", "/", "*", "=", "==", "===", "!=", "!=="],
+    "requireSpaceAfterBinaryOperators": ["+", "-", "/", "*", "=", "==", "===", "!=", "!=="],
+    "disallowKeywords": ["with"],
+    "validateLineBreaks": "LF",
+    "requireLineFeedAtFileEnd": true
+}

js/dropdown.js

@@ -85,7 +85,7 @@
 
     if (e.keyCode == 38 && index > 0)                 index--                        // up
     if (e.keyCode == 40 && index < $items.length - 1) index++                        // down
-    if (!~index)                                      index=0
+    if (!~index)                                      index = 0
 
     $items.eq(index).focus()
   }

js/modal.js

@@ -180,7 +180,7 @@
     } else if (!this.isShown && this.$backdrop) {
       this.$backdrop.removeClass('in')
 
-      $.support.transition && this.$element.hasClass('fade')?
+      $.support.transition && this.$element.hasClass('fade') ?
         this.$backdrop
           .one($.support.transition.end, callback)
           .emulateTransitionEnd(150) :

js/tests/unit/scrollspy.js

@@ -19,7 +19,7 @@ $(function () {
       test("should switch active class on scroll", function () {
         var sectionHTML = '<div id="masthead"></div>'
           , $section = $(sectionHTML).append('#qunit-fixture')
-          , topbarHTML ='<div class="topbar">'
+          , topbarHTML = '<div class="topbar">'
           + '<div class="topbar-inner">'
           + '<div class="container">'
           + '<h3><a href="#">Bootstrap</a></h3>'

js/tests/unit/tooltip.js

@@ -290,7 +290,7 @@ $(function () {
       test("should place tooltips inside the body", function () {
         var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
           .appendTo('#qunit-fixture')
-          .tooltip({container:'body'})
+          .tooltip({container: 'body'})
           .tooltip('show')
         ok($("body > .tooltip").length, 'inside the body')
         ok(!$("#qunit-fixture > .tooltip").length, 'not found in parent')
@@ -301,7 +301,7 @@ $(function () {
         var container = $("<div />").appendTo("body")
             .css({position: "absolute", width: 200, height: 200, bottom: 0, left: 0})
           , tooltip = $("<a href='#' title='Very very very very very very very very long tooltip'>Hover me</a>")
-          .css({position: "absolute", top:0, left: 0})
+          .css({position: "absolute", top: 0, left: 0})
           .appendTo(container)
           .tooltip({placement: "top", animate: false})
           .tooltip("show")
@@ -347,7 +347,7 @@ $(function () {
               .tooltip('show')
           , tooltip = container.find(".tooltip")
 
-        ok( Math.round(target.offset().top + target[0].offsetHeight/2 - tooltip[0].offsetHeight/2) === Math.round(tooltip.offset().top) )
+        ok( Math.round(target.offset().top + (target[0].offsetHeight / 2) - (tooltip[0].offsetHeight / 2)) === Math.round(tooltip.offset().top) )
         target.tooltip('hide')
       })
 

js/tooltip.js

@@ -133,7 +133,7 @@
   }
 
   Tooltip.prototype.show = function () {
-    var e = $.Event('show.bs.'+ this.type)
+    var e = $.Event('show.bs.' + this.type)
 
     if (this.hasContent() && this.enabled) {
       this.$element.trigger(e)

less/buttons.less

@@ -56,6 +56,10 @@
 .btn-primary {
   .button-variant(@btn-primary-color; @btn-primary-bg; @btn-primary-border);
 }
+// Success appears as green
+.btn-success {
+  .button-variant(@btn-success-color; @btn-success-bg; @btn-success-border);
+}
 // Warning appears as orange
 .btn-warning {
   .button-variant(@btn-warning-color; @btn-warning-bg; @btn-warning-border);
@@ -64,10 +68,6 @@
 .btn-danger {
   .button-variant(@btn-danger-color; @btn-danger-bg; @btn-danger-border);
 }
-// Success appears as green
-.btn-success {
-  .button-variant(@btn-success-color; @btn-success-bg; @btn-success-border);
-}
 // Info appears as blue-green
 .btn-info {
   .button-variant(@btn-info-color; @btn-info-bg; @btn-info-border);

less/code.less

@@ -21,6 +21,16 @@ code {
   border-radius: @border-radius-base;
 }
 
+// User input typically entered via keyboard
+kbd {
+  padding: 2px 4px;
+  font-size: 90%;
+  color: @kbd-color;
+  background-color: @kbd-bg;
+  border-radius: @border-radius-small;
+  box-shadow: inset 0 -1px 0 rgba(0,0,0,.25);
+}
+
 // Blocks of code
 pre {
   display: block;

less/grid.less

@@ -2,7 +2,11 @@
 // Grid system
 // --------------------------------------------------
 
-// Set the container width, and override it for fixed navbars in media queries
+
+// Container widths
+//
+// Set the container width, and override it for fixed navbars in media queries.
+
 .container {
   .container-fixed();
 
@@ -17,12 +21,30 @@
   }
 }
 
-// mobile first defaults
+
+// Fluid container
+//
+// Utilizes the mixin meant for fixed width containers, but without any defined
+// width for fluid, full width layouts.
+
+.container-fluid {
+  .container-fixed();
+}
+
+
+// Row
+//
+// Rows contain and clear the floats of your columns.
+
 .row {
   .make-row();
 }
 
+
+// Columns
+//
 // Common styles for small and large grid columns
+
 .make-grid-columns();
 
 
@@ -76,4 +98,3 @@
   .make-grid(@grid-columns, lg, push);
   .make-grid(@grid-columns, lg, offset);
 }
-

less/list-group.less

@@ -2,17 +2,21 @@
 // List groups
 // --------------------------------------------------
 
+
 // Base class
 //
 // Easily usable on <ul>, <ol>, or <div>.
+
 .list-group {
   // No need to set list-style: none; since .list-group-item is block level
   margin-bottom: 20px;
   padding-left: 0; // reset padding because ul and ol
 }
 
+
 // Individual list items
-// -------------------------
+//
+// Use on `li`s or `div`s within the `.list-group` parent.
 
 .list-group-item {
   position: relative;
@@ -41,7 +45,12 @@
   }
 }
 
+
 // Linked list items
+//
+// Use anchor elements instead of `li`s or `div`s to create linked list items.
+// Includes an extra `.active` modifier class for showing selected items.
+
 a.list-group-item {
   color: @list-group-link-color;
 
@@ -75,8 +84,21 @@ a.list-group-item {
   }
 }
 
+
+// Contextual variants
+//
+// Add modifier classes to change text and background color on individual items.
+// Organizationally, this must come after the `:hover` states.
+
+.list-group-item-variant(success; @state-success-bg; @state-success-text);
+.list-group-item-variant(warning; @state-warning-bg; @state-warning-text);
+.list-group-item-variant(danger; @state-danger-bg; @state-danger-text);
+.list-group-item-variant(info; @state-info-bg; @state-info-text);
+
+
 // Custom content options
-// -------------------------
+//
+// Extra classes for creating well-formatted content within `.list-group-item`s.
 
 .list-group-item-heading {
   margin-top: 0;

less/mixins.less

@@ -150,10 +150,10 @@
       -ms-transform: rotate(@degrees); // IE9+
           transform: rotate(@degrees);
 }
-.scale(@ratio) {
-  -webkit-transform: scale(@ratio);
-      -ms-transform: scale(@ratio); // IE9+
-          transform: scale(@ratio);
+.scale(@ratio; @ratio-y...) {
+  -webkit-transform: scale(@ratio, @ratio-y);
+      -ms-transform: scale(@ratio, @ratio-y); // IE9+
+          transform: scale(@ratio, @ratio-y);
 }
 .translate(@x; @y) {
   -webkit-transform: translate(@x, @y);
@@ -414,29 +414,56 @@
 .table-row-variant(@state; @background) {
   // Exact selectors below required to override `.table-striped` and prevent
   // inheritance to nested tables.
-  .table {
-    > thead,
-    > tbody,
-    > tfoot {
-      > tr > .@{state},
-      > .@{state} > td,
-      > .@{state} > th {
+  .table > thead > tr,
+  .table > tbody > tr,
+  .table > tfoot > tr {
+    > td.@{state},
+    > th.@{state},
+    &.@{state} > td,
+    &.@{state} > th {
       background-color: @background;
     }
   }
-  }
 
   // Hover states for `.table-hover`
   // Note: this is not available for cells or rows within `thead` or `tfoot`.
-  .table-hover > tbody {
-    > tr > .@{state}:hover,
-    > .@{state}:hover > td,
-    > .@{state}:hover > th {
+  .table-hover > tbody > tr {
+    > td.@{state}:hover,
+    > th.@{state}:hover,
+    &.@{state}:hover > td,
+    &.@{state}:hover > th {
       background-color: darken(@background, 5%);
     }
   }
 }
 
+// List Groups
+// -------------------------
+.list-group-item-variant(@state; @background; @color) {
+  .list-group-item-@{state} {
+    color: @color;
+    background-color: @background;
+  }
+  a.list-group-item-@{state} {
+    color: @color;
+
+    .list-group-item-heading { color: inherit; }
+
+    &:hover,
+    &:focus {
+      color: @color;
+      background-color: darken(@background, 5%);
+    }
+    &.active,
+    &.active:hover,
+    &.active:focus {
+      color: #fff;
+      background-color: @color;
+      border-color: @color;
+    }
+  }
+}
+
 // Button variants
 // -------------------------
 // Easily pump out default styles, as well as :hover, :focus, :active,
@@ -475,7 +502,7 @@
 
   .badge {
     color: @background;
-    background-color: #fff;
+    background-color: @color;
   }
 }
 

less/navbar.less

@@ -93,8 +93,10 @@
 //
 // When a container is present, change the behavior of the header and collapse.
 
-.container > .navbar-header,
-.container > .navbar-collapse {
+.container,
+.container-fluid {
+  > .navbar-header,
+  > .navbar-collapse {
     margin-right: -@navbar-padding-horizontal;
     margin-left:  -@navbar-padding-horizontal;
 
@@ -102,6 +104,7 @@
       margin-right: 0;
       margin-left:  0;
     }
+  }
 }
 
 
@@ -159,7 +162,8 @@
   }
 
   @media (min-width: @grid-float-breakpoint) {
-    .navbar > .container & {
+    .navbar > .container &,
+    .navbar > .container-fluid & {
       margin-left: -@navbar-padding-horizontal;
     }
   }

less/tables.less

@@ -156,8 +156,9 @@ table {
 // Generate the contextual variants
 .table-row-variant(active; @table-bg-active);
 .table-row-variant(success; @state-success-bg);
-.table-row-variant(danger; @state-danger-bg);
 .table-row-variant(warning; @state-warning-bg);
+.table-row-variant(danger; @state-danger-bg);
+.table-row-variant(info; @state-info-bg);
 
 
 // Responsive tables

less/type.less

@@ -120,6 +120,7 @@ cite    { font-style: normal; }
 .text-left           { text-align: left; }
 .text-right          { text-align: right; }
 .text-center         { text-align: center; }
+.text-justify        { text-align: justify; }
 
 
 // Page header

less/variables.less

@@ -286,7 +286,7 @@
 
 // Navbar toggle
 @navbar-default-toggle-hover-bg:           #ddd;
-@navbar-default-toggle-icon-bar-bg:        #ccc;
+@navbar-default-toggle-icon-bar-bg:        #888;
 @navbar-default-toggle-border-color:       #ddd;
 
 
@@ -602,6 +602,9 @@
 @code-color:                  #c7254e;
 @code-bg:                     #f9f2f4;
 
+@kbd-color:                   #fff;
+@kbd-bg:                      #333;
+
 @pre-bg:                      #f5f5f5;
 @pre-color:                   @gray-dark;
 @pre-border-color:            #ccc;

package.json

@@ -32,6 +32,7 @@
     , "grunt-contrib-watch": "~0.5.3"
     , "grunt-html-validation": "~0.1.6"
     , "grunt-jekyll": "~0.4.0"
+    , "grunt-jscs-checker": "~0.2.5"
     , "grunt-recess": "~0.5.0"
     , "grunt-saucelabs": "~4.1.2"
     , "grunt-sed": "~0.1.1"