From ca2711fc8e98c6969b642894b485df9235c09009 Mon Sep 17 00:00:00 2001
From: Mark Otto <markdotto@gmail.com>
Date: Wed, 17 Sep 2014 20:03:32 -0700
Subject: rewrite jumbotron less and make heading use a class

---
 docs/components/jumbotron.md | 19 +++++++++++++++----
 1 file changed, 15 insertions(+), 4 deletions(-)

(limited to 'docs/components')

diff --git a/docs/components/jumbotron.md b/docs/components/jumbotron.md
index d211f1a52..080133ed5 100644
--- a/docs/components/jumbotron.md
+++ b/docs/components/jumbotron.md
@@ -7,18 +7,29 @@ A lightweight, flexible component that can optionally extend the entire viewport
 
 {% example html %}
 <div class="jumbotron">
-  <h1>Hello, world!</h1>
-  <p>This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.</p>
-  <p><a class="btn btn-primary btn-lg" role="button">Learn more</a></p>
+  <h1 class="jumbotron-heading">Hello, world!</h1>
+  <p class="lead">This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.</p>
+  <p class="lead"><a class="btn btn-primary btn-lg" role="button">Learn more</a></p>
 </div>
 {% endexample %}
 
 To make the jumbotron full width, and without rounded corners, place it outside all `.container`s and instead add a `.container` within.
 
-{% example html %}
+{% highlight html %}
 <div class="jumbotron">
   <div class="container">
     ...
   </div>
 </div>
+{% endhighlight %}
+
+Jumbotrons also come with an adaptive `hr`—just add `.jumbotron-hr` to the element and the `border-top-color` will be tinted based on the jumbotron background.
+
+{% example html %}
+<div class="jumbotron">
+  <h1 class="jumbotron-heading">Jumbotron <code>hr</code></h1>
+  <p class="lead">This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.</p>
+  <hr class="jumbotron-hr">
+  <p class="lead"><a class="btn btn-primary btn-lg" role="button">Learn more</a></p>
+</div>
 {% endexample %}
-- 
cgit v1.2.3