From 267d3e7ed7f50cc5625145ad714a5e1099612e87 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Thu, 17 Jan 2013 00:50:19 -0800 Subject: [PATCH] streamline css docs --- docs/assets/css/docs.css | 11 +++--- docs/css.html | 65 ++++++------------------------- docs/templates/pages/css.mustache | 65 ++++++------------------------- 3 files changed, 27 insertions(+), 114 deletions(-) diff --git a/docs/assets/css/docs.css b/docs/assets/css/docs.css index 27744e96d8..244728817d 100644 --- a/docs/assets/css/docs.css +++ b/docs/assets/css/docs.css @@ -165,12 +165,6 @@ section > ul li { position: static; top: 0; } -.bs-docs-sidenav.affix-bottom { - position: absolute; - top: auto; - bottom: 270px; -} - /* Chevrons within each link */ .bs-docs-sidenav .glyphicon-chevron-right { @@ -474,6 +468,11 @@ section > ul li { .bs-docs-sidenav { width: 170px; } + .bs-docs-sidenav.affix-bottom { + position: absolute; + top: auto; + bottom: 270px; + } } /* Tablets/desktops and up */ diff --git a/docs/css.html b/docs/css.html index fe0ab54667..e4499e571d 100644 --- a/docs/css.html +++ b/docs/css.html @@ -178,9 +178,6 @@

The typographic scale is based on two LESS variables in variables.less: @font-size-base and @line-height-base. The first is the base font-size used throughout and the second is the base line-height. We use those variables and some simple math to create the margins, paddings, and line-heights of all our type and more. Customize them and Bootstrap adapts.

-
- -

Emphasis

Make use of HTML's default emphasis tags with lightweight styles.

@@ -240,9 +237,6 @@ -
- -

Abbreviations

Stylized implementation of HTML's <abbr> element for abbreviations and acronyms to show the expanded version on hover. Abbreviations with a title attribute have a light dotted bottom border and a help cursor on hover, providing additional context on hover.

@@ -261,9 +255,6 @@ 
<abbr title="HyperText Markup Language" class="initialism">HTML</abbr>
-
- -

Addresses

Present contact information for the nearest ancestor or the entire body of work.

@@ -296,9 +287,6 @@ -
- -

Blockquotes

For quoting blocks of content from another source within your document.

@@ -348,9 +336,6 @@ -
- -

Lists

@@ -671,9 +656,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped -
- -

Optional classes

Add any of the following classes to the .table base class.

@@ -840,9 +822,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped -
- -

Optional row classes

Use contextual classes to color table rows.

@@ -933,9 +912,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped -
- -

Supported table markup

List of supported table HTML elements and how they should be used.

@@ -1072,9 +1048,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped -
- -

Optional layouts

Included with Bootstrap are optional form layouts for common use cases.

@@ -1163,9 +1136,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped -
- -

Supported form controls

Examples of standard form controls supported in an example form layout.

@@ -1297,9 +1267,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped -
- -

Extending form controls

Adding on top of existing browser controls, Bootstrap includes other useful form components.

@@ -1616,9 +1583,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped -
- -

Form control states

Provide feedback to users or visitors with basic feedback states on form controls and labels.

@@ -2100,9 +2064,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped

Glyphicons Halflings are normally not available for free, but an arrangement between Bootstrap and the Glyphicons creator have made this possible at no cost to you as developers. As a thank you, we ask you to include an optional link back to Glyphicons whenever practical.

-
- -

How to use

Add the appropriate class to any inline element. All icon classes are prefixed with glyphicon- for easy styling. To use, place the following code just about anywhere:

@@ -2112,9 +2073,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped
           
When using beside strings of text, as in buttons or nav links, be sure to leave a space after the icon for proper spacing.

 
 
-          

-
-
           
Icon examples

           
Use them in buttons, button groups for a toolbar, navigation, or prepended form inputs.

 
@@ -2190,14 +2148,12 @@ For example, <code>&lt;section&gt;</code> should be wrapped
 
           
Navigation

           

-            

-              
-            

+            
           

 
 <ul class="nav nav-list">
@@ -2213,8 +2169,9 @@ For example, <code>&lt;section&gt;</code> should be wrapped
             

               
               

-                

-                  
+                

+                  
+                  
                 

               

             

@@ -2223,8 +2180,8 @@ For example, <code>&lt;section&gt;</code> should be wrapped
 <div class="control-group">
   <label class="control-label" for="inputIcon">Email address</label>
   <div class="controls">
-    <div class="input-prepend">
-      <span class="add-on"><i class="glyphicon-envelope"></i></span>
+    <div class="input-group">
+      <span class="input-group-addon"><i class="glyphicon-envelope"></i></span>
       <input class="span2" id="inputIcon" type="text">
     </div>
   </div>
diff --git a/docs/templates/pages/css.mustache b/docs/templates/pages/css.mustache
index b2fe366743..2190d781d3 100644
--- a/docs/templates/pages/css.mustache
+++ b/docs/templates/pages/css.mustache
@@ -114,9 +114,6 @@
           
The typographic scale is based on two LESS variables in variables.less: @font-size-base and @line-height-base. The first is the base font-size used throughout and the second is the base line-height. We use those variables and some simple math to create the margins, paddings, and line-heights of all our type and more. Customize them and Bootstrap adapts.

 
 
-          

-
-
           {{! Emphasis }}
           
Emphasis

           
Make use of HTML's default emphasis tags with lightweight styles.

@@ -177,9 +174,6 @@
 

 
 
-          

-
-
           {{! Abbreviations }}
           
Abbreviations

           
Stylized implementation of HTML's <abbr> element for abbreviations and acronyms to show the expanded version on hover. Abbreviations with a title attribute have a light dotted bottom border and a help cursor on hover, providing additional context on hover.

@@ -199,9 +193,6 @@
           
<abbr title="HyperText Markup Language" class="initialism">HTML</abbr>

 
 
-          

-
-
           {{! Addresses }}
           
Addresses

           
Present contact information for the nearest ancestor or the entire body of work.

@@ -235,9 +226,6 @@
-
- - {{! Blockquotes }}

Blockquotes

For quoting blocks of content from another source within your document.

@@ -288,9 +276,6 @@ -
- -

Lists

@@ -611,9 +596,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped -
- -

Optional classes

Add any of the following classes to the .table base class.

@@ -780,9 +762,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped -
- -

Optional row classes

Use contextual classes to color table rows.

@@ -873,9 +852,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped -
- -

Supported table markup

List of supported table HTML elements and how they should be used.

@@ -1012,9 +988,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped -
- -

Optional layouts

Included with Bootstrap are optional form layouts for common use cases.

@@ -1103,9 +1076,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped -
- -

Supported form controls

Examples of standard form controls supported in an example form layout.

@@ -1237,9 +1207,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped -
- -

Extending form controls

Adding on top of existing browser controls, Bootstrap includes other useful form components.

@@ -1556,9 +1523,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped -
- -

Form control states

Provide feedback to users or visitors with basic feedback states on form controls and labels.

@@ -2040,9 +2004,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped

Glyphicons Halflings are normally not available for free, but an arrangement between Bootstrap and the Glyphicons creator have made this possible at no cost to you as developers. As a thank you, we ask you to include an optional link back to Glyphicons whenever practical.

-
- -

How to use

Add the appropriate class to any inline element. All icon classes are prefixed with glyphicon- for easy styling. To use, place the following code just about anywhere:

@@ -2052,9 +2013,6 @@ For example, <code>&lt;section&gt;</code> should be wrapped
           
When using beside strings of text, as in buttons or nav links, be sure to leave a space after the icon for proper spacing.

 
 
-          

-
-
           
Icon examples

           
Use them in buttons, button groups for a toolbar, navigation, or prepended form inputs.

 
@@ -2130,14 +2088,12 @@ For example, <code>&lt;section&gt;</code> should be wrapped
 
           
Navigation

           

-            

-              
-            
{{! /well }}
+            
           
{{! /bs-docs-example }}
 
 <ul class="nav nav-list">
@@ -2153,8 +2109,9 @@ For example, <code>&lt;section&gt;</code> should be wrapped
             

               
               

-                

-                  
+                

+                  
+                  
                 

               

             

@@ -2163,8 +2120,8 @@ For example, <code>&lt;section&gt;</code> should be wrapped
 <div class="control-group">
   <label class="control-label" for="inputIcon">Email address</label>
   <div class="controls">
-    <div class="input-prepend">
-      <span class="add-on"><i class="glyphicon-envelope"></i></span>
+    <div class="input-group">
+      <span class="input-group-addon"><i class="glyphicon-envelope"></i></span>
       <input class="span2" id="inputIcon" type="text">
     </div>
   </div>