From 5f7352a6fe5f7a7eef4dce64184f55d1fec2676b Mon Sep 17 00:00:00 2001
From: Mark Otto <otto@github.com>
Date: Thu, 16 May 2013 22:11:31 -0700
Subject: [PATCH] Better grid template; link color change in docs navbar

---
 docs/assets/css/docs.css |  2 +-
 docs/css.html            |  1 +
 docs/examples/grid.html  | 22 +++++++++++++++++++++-
 3 files changed, 23 insertions(+), 2 deletions(-)

diff --git a/docs/assets/css/docs.css b/docs/assets/css/docs.css
index e389eaf6e9..9221cac1bd 100644
--- a/docs/assets/css/docs.css
+++ b/docs/assets/css/docs.css
@@ -25,7 +25,7 @@ body {
   color: #fff;
 }
 .bs-docs-nav .navbar-nav > li > a {
-  color: #dfc9c8;
+  color: #e6cac8;
 }
 .bs-docs-nav .navbar-nav > li > a:hover {
   color: #fff;
diff --git a/docs/css.html b/docs/css.html
index be4e130985..264d4c672c 100644
--- a/docs/css.html
+++ b/docs/css.html
@@ -67,6 +67,7 @@ lead: "Fundamental HTML elements styled and enhanced with extensible classes."
 
     <h3 id="grid-example">Grid example</h3>
     <p>On mobile devices, the grid starts out stacked. Above 768px, it becomes horizontal as media queries kick in to apply <code>float</code>s and <code>width</code>s. To create a basic grid layout, wrap a series of <code>.col-lg-*</code> elements within a <code>.row</code>. As this is a 12-column grid, each <code>.col-lg-*</code> spans a number of those 12 columns, and should always add up to 12 for each row (or the number of columns in the parent), even at mobile resolutions.</p>
+    <p>Be sure to checkout the <a href="../examples/grid/">full-page grid example</a> as well.</p>
     <div class="bs-docs-grid">
       <div class="row show-grid">
         <div class="col col-lg-1">1</div>
diff --git a/docs/examples/grid.html b/docs/examples/grid.html
index eea2ac0cf2..d14602e4ec 100644
--- a/docs/examples/grid.html
+++ b/docs/examples/grid.html
@@ -11,9 +11,16 @@ title: Grid template
     padding-right: 15px;
   }
 
+  h4 {
+    margin-top: 25px;
+  }
   .row {
     margin-bottom: 20px;
   }
+  .row .row {
+    margin-top: 10px;
+    margin-bottom: 0;
+  }
   [class*="col-lg-"] {
     padding-top: 15px;
     padding-bottom: 15px;
@@ -49,6 +56,19 @@ title: Grid template
   </div>
 
   <h4>Full width, single column</h4>
-  <p class="text-muted">No grid classes are necessary for full-width elements.</p>
+  <p class="text-warning">No grid classes are necessary for full-width elements.</p>
+
+  <h4>Two columns with two nested columns</h4>
+  <div class="row">
+    <div class="col col-lg-8">
+      .col .col-lg-8
+      <div class="row">
+        <div class="col col-lg-6">.col .col-lg-6</div>
+        <div class="col col-lg-6">.col .col-lg-6</div>
+      </div>
+    </div>
+    <div class="col col-lg-4">.col .col-lg-4</div>
+  </div>
+
 
 </div> <!-- /container -->