try out new table-based type example

diff --git a/docs/assets/css/docs.css b/docs/assets/css/docs.css
index e1caaceb743b9dd3fa3da700a01934cd06387fb6..50f3cb80087394b858759277fd2237abff88942a 100644 (file)
--- a/docs/assets/css/docs.css
+++ b/docs/assets/css/docs.css
@@ -243,6 +243,31 @@ section > ul li {
   margin-bottom: 0;
 }
 
+/* Typography */
+.bs-docs-example-type .table td {
+  color: #999;
+  vertical-align: middle;
+  border-color: ;
+}
+.bs-docs-example-type .table td,
+.bs-docs-example-type .table th {
+  padding: 15px 0;
+  border-color: #eee;
+}
+.bs-docs-example-type .table tr:first-child td,
+.bs-docs-example-type .table tr:first-child th {
+  border-top: 0;
+}
+.bs-docs-example-type h1,
+.bs-docs-example-type h2,
+.bs-docs-example-type h3,
+.bs-docs-example-type h4,
+.bs-docs-example-type h5,
+.bs-docs-example-type h6 {
+  margin: 0;
+}
+
+
 /* Navbar examples */
 .bs-navbar-top-example,
 .bs-navbar-bottom-example {

diff --git a/docs/css.html b/docs/css.html
index 88c3b48a1f88be7599756d262ee179221378606d..13d39adebe328e99e93e6d5ea9e85258357ccc70 100644 (file)
--- a/docs/css.html
+++ b/docs/css.html
@@ -90,7 +90,39 @@ title: CSS
           <!-- Headings -->
           <h2 id="headings">Headings</h2>
           <p>All HTML headings, <code>&lt;h1&gt;</code> through <code>&lt;h6&gt;</code> are available.</p>
-          <div class="bs-docs-example">
+
+          <div class="bs-docs-example bs-docs-example-type">
+            <table class="table">
+              <tbody>
+                <tr>
+                  <th><h1>Bootstrap heading</h1></th>
+                  <td>Semibold 38px</td>
+                </tr>
+                <tr>
+                  <th><h2>Bootstrap heading</h2></th>
+                  <td>Semibold 32px</td>
+                </tr>
+                <tr>
+                  <th><h3>Bootstrap heading</h3></th>
+                  <td>Semibold 24px</td>
+                </tr>
+                <tr>
+                  <th><h4>Bootstrap heading</h4></th>
+                  <td>Semibold 18px</td>
+                </tr>
+                <tr>
+                  <th><h5>Bootstrap heading</h5></th>
+                  <td>Semibold 16px</td>
+                </tr>
+                <tr>
+                  <th><h6>Bootstrap heading</h6></th>
+                  <td>Semibold 12px</td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+
+<!--           <div class="bs-docs-example">
             <h1>h1. Heading 1</h1>
             <h2>h2. Heading 2</h2>
             <h3>h3. Heading 3</h3>
@@ -98,7 +130,7 @@ title: CSS
             <h5>h5. Heading 5</h5>
             <h6>h6. Heading 6</h6>
           </div>
-
+ -->
           <!-- Body copy -->
           <h2 id="body-copy">Body copy</h2>
           <p>Bootstrap's global default <code>font-size</code> is <strong>14px</strong>, with a <code>line-height</code> of <strong>20px</strong>. This is applied to the <code>&lt;body&gt;</code> and all paragraphs. In addition, <code>&lt;p&gt;</code> (paragraphs) receive a bottom margin of half their line-height (10px by default).</p>