.bs-docs-example to .bs-example

docs/assets/css/docs.css

@@ -211,7 +211,7 @@ body {
 -------------------------------------------------- */
 
 /* Base class */
-.bs-docs-example {
+.bs-example {
   position: relative;
   padding: 39px 14px 14px;
   margin-bottom: -1px;
@@ -220,7 +220,7 @@ body {
   border-top-right-radius: 4px;
 }
 /* Echo out a label for the example */
-.bs-docs-example:after {
+.bs-example:after {
   content: "Example";
   position: absolute;
   top: -1px;
@@ -236,56 +236,56 @@ body {
 }
 
 /* Tweak display of the examples */
-.bs-docs-example + .prettyprint,
-.bs-docs-example + .highlight {
+.bs-example + .prettyprint,
+.bs-example + .highlight {
   margin-top: 0;
   border-top-left-radius: 0;
   border-top-right-radius: 0;
 }
 
 /* Tweak content of examples for optimum awesome */
-.bs-docs-example > p:last-child,
-.bs-docs-example > ul:last-child,
-.bs-docs-example > ol:last-child,
-.bs-docs-example > blockquote:last-child,
-.bs-docs-example > input:last-child,
-.bs-docs-example > select:last-child,
-.bs-docs-example > textarea:last-child,
-.bs-docs-example > .table:last-child,
-.bs-docs-example > .jumbotron:last-child,
-.bs-docs-example > .alert:last-child,
-.bs-docs-example > .panel:last-child,
-.bs-docs-example > .list-group:last-child,
-.bs-docs-example > .well:last-child {
+.bs-example > p:last-child,
+.bs-example > ul:last-child,
+.bs-example > ol:last-child,
+.bs-example > blockquote:last-child,
+.bs-example > input:last-child,
+.bs-example > select:last-child,
+.bs-example > textarea:last-child,
+.bs-example > .table:last-child,
+.bs-example > .jumbotron:last-child,
+.bs-example > .alert:last-child,
+.bs-example > .panel:last-child,
+.bs-example > .list-group:last-child,
+.bs-example > .well:last-child {
   margin-bottom: 0;
 }
 
 /* Typography */
-.bs-docs-example-type .table td {
+.bs-example-type .table td {
   color: #999;
   vertical-align: middle;
   border-color: ;
 }
-.bs-docs-example-type .table td,
-.bs-docs-example-type .table th {
+.bs-example-type .table td,
+.bs-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 {
+.bs-example-type .table tr:first-child td,
+.bs-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 {
+.bs-example-type h1,
+.bs-example-type h2,
+.bs-example-type h3,
+.bs-example-type h4,
+.bs-example-type h5,
+.bs-example-type h6 {
   margin: 0;
 }
 
 /* List groups */
-.bs-docs-example > .list-group {
+.bs-example > .list-group {
   max-width: 400px;
 }
 
@@ -331,10 +331,10 @@ body {
 }
 
 /* Example modals */
-.bs-docs-example-modal {
+.bs-example-modal {
   background-color: #f5f5f5;
 }
-.bs-docs-example-modal .modal {
+.bs-example-modal .modal {
   position: relative;
   top: auto;
   right: auto;
@@ -343,29 +343,29 @@ body {
   z-index: 1;
   display: block;
 }
-.bs-docs-example-modal .modal-dialog {
+.bs-example-modal .modal-dialog {
   left: auto;
   margin-left: auto;
   margin-right: auto;
 }
 
 /* Example dropdowns */
-.bs-docs-example > .dropdown > .dropdown-menu,
-.bs-docs-example-submenu > .pull-left > .dropup > .dropdown-menu,
-.bs-docs-example-submenu > .pull-left > .dropdown > .dropdown-menu {
+.bs-example > .dropdown > .dropdown-menu,
+.bs-example-submenu > .pull-left > .dropup > .dropdown-menu,
+.bs-example-submenu > .pull-left > .dropdown > .dropdown-menu {
   position: static;
   display: block;
   margin-bottom: 5px;
 }
-.bs-docs-example-submenu {
+.bs-example-submenu {
   min-height: 230px;
 }
-.bs-docs-example-submenu > .pull-left + .pull-left {
+.bs-example-submenu > .pull-left + .pull-left {
   margin-left: 20px;
 }
 
 /* Example tabbable tabs */
-.bs-docs-example-tabs .nav-tabs {
+.bs-example-tabs .nav-tabs {
   margin-bottom: 15px;
 }
 
@@ -381,11 +381,11 @@ body {
 }
 
 /* Popovers */
-.bs-docs-example-popover {
+.bs-example-popover {
   padding-bottom: 24px;
   background-color: #f9f9f9;
 }
-.bs-docs-example-popover .popover {
+.bs-example-popover .popover {
   position: relative;
   display: block;
   float: left;
@@ -398,10 +398,10 @@ body {
 /* Example templates
 -------------------------------------------------- */
 
-.bs-docs-examples h4 {
+.bs-examples h4 {
   margin-bottom: 5px;
 }
-.bs-docs-examples p {
+.bs-examples p {
   margin-bottom: 20px;
 }
 
@@ -629,7 +629,7 @@ input.focused {
 
 /* Hide code snippets on mobile devices */
 @media screen and (max-width: 480px) {
-  .bs-docs-example {
+  .bs-example {
     border-radius: 4px;
   }
   .highlight {

docs/javascript.html

@@ -101,7 +101,7 @@ $('#myModal').on('show', function (e) {
 
     <h3>Static example</h3>
     <p>A rendered modal with header, body, and set of actions in the footer.</p>
-    <div class="bs-docs-example bs-docs-example-modal">
+    <div class="bs-example bs-example-modal">
       <div class="modal">
         <div class="modal-dialog">
           <div class="modal-content">
@@ -183,7 +183,7 @@ $('#myModal').on('show', function (e) {
       </div><!-- /.modal-dalog -->
     </div><!-- /.modal -->
 
-    <div class="bs-docs-example" style="padding-bottom: 24px;">
+    <div class="bs-example" style="padding-bottom: 24px;">
       <a data-toggle="modal" href="#myModal" class="btn btn-primary btn-large">Launch demo modal</a>
     </div><!-- /example -->
 {% highlight html %}
@@ -337,7 +337,7 @@ $('#myModal').on('hidden', function () {
           <p>Add dropdown menus to nearly anything with this simple plugin, including the navbar, tabs, and pills.</p>
 
           <h3>Within a navbar</h3>
-          <div class="bs-docs-example">
+          <div class="bs-example">
             <div id="navbar-example" class="navbar navbar-static">
               <div class="navbar-inner">
                 <div class="container" style="width: auto;">
@@ -382,7 +382,7 @@ $('#myModal').on('hidden', function () {
           </div> <!-- /example -->
 
           <h3>Within tabs</h3>
-          <div class="bs-docs-example">
+          <div class="bs-example">
             <ul class="nav nav-pills">
               <li class="active"><a href="#">Regular link</a></li>
               <li class="dropdown">
@@ -472,7 +472,7 @@ $('.dropdown-toggle').dropdown()
 
           <h2>Example in navbar</h2>
           <p>The ScrollSpy plugin is for automatically updating nav targets based on scroll position. Scroll the area below the navbar and watch the active class change. The dropdown sub items will be highlighted as well.</p>
-          <div class="bs-docs-example">
+          <div class="bs-example">
             <div id="navbar-example" class="navbar navbar-static">
               <div class="navbar-inner">
                 <div class="container" style="width: auto;">
@@ -591,7 +591,7 @@ $('[data-spy="scroll"]').each(function () {
 
           <h2>Example tabs</h2>
           <p>Add quick, dynamic tab functionality to transition through panes of local content, even via dropdown menus.</p>
-          <div class="bs-docs-example bs-docs-example-tabs">
+          <div class="bs-example bs-example-tabs">
             <ul id="myTab" class="nav nav-tabs">
               <li class="active"><a href="#home" data-toggle="tab">Home</a></li>
               <li><a href="#profile" data-toggle="tab">Profile</a></li>
@@ -719,13 +719,13 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
           <h2>Examples</h2>
           <p>Inspired by the excellent jQuery.tipsy plugin written by Jason Frame; Tooltips are an updated version, which don't rely on images, use CSS3 for animations, and data-attributes for local title storage.</p>
           <p>Hover over the links below to see tooltips:</p>
-          <div class="bs-docs-example tooltip-demo">
+          <div class="bs-example tooltip-demo">
             <p class="muted" style="margin-bottom: 0;">Tight pants next level keffiyeh <a href="#" data-toggle="tooltip" title="Default tooltip">you probably</a> haven't heard of them. Photo booth beard raw denim letterpress vegan messenger bag stumptown. Farm-to-table seitan, mcsweeney's fixie sustainable quinoa 8-bit american apparel <a href="#" data-toggle="tooltip" title="Another tooltip">have a</a> terry richardson vinyl chambray. Beard stumptown, cardigans banh mi lomo thundercats. Tofu biodiesel williamsburg marfa, four loko mcsweeney's cleanse vegan chambray. A really ironic artisan <a href="#" data-toggle="tooltip" title="Another one here too">whatever keytar</a>, scenester farm-to-table banksy Austin <a href="#" data-toggle="tooltip" title="The last tip!">twitter handle</a> freegan cred raw denim single-origin coffee viral.
             </p>
           </div><!-- /example -->
 
           <h3>Four directions</h3>
-          <div class="bs-docs-example tooltip-demo">
+          <div class="bs-example tooltip-demo">
             <ul class="bs-docs-tooltip-examples">
               <li><a href="#" data-toggle="tooltip" data-placement="top" title="Tooltip on top">Tooltip on top</a></li>
               <li><a href="#" data-toggle="tooltip" data-placement="right" title="Tooltip on right">Tooltip on right</a></li>
@@ -866,7 +866,7 @@ $('#example').tooltip(options)
 
         <h3>Static popover</h3>
         <p>Four options are available: top, right, bottom, and left aligned.</p>
-        <div class="bs-docs-example bs-docs-example-popover">
+        <div class="bs-example bs-example-popover">
           <div class="popover top">
             <div class="arrow"></div>
             <h3 class="popover-title">Popover top</h3>
@@ -903,12 +903,12 @@ $('#example').tooltip(options)
         </div>
 
         <h3>Live demo</h3>
-        <div class="bs-docs-example" style="padding-bottom: 24px;">
+        <div class="bs-example" style="padding-bottom: 24px;">
           <a href="#" class="btn btn-large btn-danger" data-toggle="popover" title="A Title" data-content="And here's some amazing content. It's very engaging. right?">Click to toggle popover</a>
         </div>
 
         <h4>Four directions</h4>
-        <div class="bs-docs-example tooltip-demo">
+        <div class="bs-example tooltip-demo">
           <ul class="bs-docs-tooltip-examples">
             <li><a href="#" class="btn" data-toggle="popover" data-placement="top" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." title="Popover on top">Popover on top</a></li>
             <li><a href="#" class="btn" data-toggle="popover" data-placement="right" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." title="Popover on right">Popover on right</a></li>
@@ -1040,14 +1040,14 @@ $('#example').tooltip(options)
 
         <h2>Example alerts</h2>
         <p>Add dismiss functionality to all alert messages with this plugin.</p>
-        <div class="bs-docs-example">
+        <div class="bs-example">
           <div class="alert fade in">
             <button type="button" class="close" data-dismiss="alert">&times;</button>
             <strong>Holy guacamole!</strong> Best check yo self, you're not looking too good.
           </div>
         </div><!-- /example -->
 
-        <div class="bs-docs-example">
+        <div class="bs-example">
           <div class="alert alert-block alert-error fade in">
             <button type="button" class="close" data-dismiss="alert">&times;</button>
             <h4>Oh snap! You got an error!</h4>
@@ -1121,7 +1121,7 @@ $('#my-alert').bind('closed', function () {
 
             <h4>Stateful</h4>
             <p>Add <code>data-loading-text="Loading..."</code> to use a loading state on a button.</p>
-            <div class="bs-docs-example" style="padding-bottom: 24px;">
+            <div class="bs-example" style="padding-bottom: 24px;">
               <button type="button" id="fat-btn" data-loading-text="Loading..." class="btn btn-primary">
                 Loading state
               </button>
@@ -1134,7 +1134,7 @@ $('#my-alert').bind('closed', function () {
 
             <h4>Single toggle</h4>
             <p>Add <code>data-toggle="button"</code> to activate toggling on a single button.</p>
-            <div class="bs-docs-example" style="padding-bottom: 24px;">
+            <div class="bs-example" style="padding-bottom: 24px;">
               <button type="button" class="btn btn-primary" data-toggle="button">Single toggle</button>
             </div><!-- /example -->
 {% highlight html %}
@@ -1143,7 +1143,7 @@ $('#my-alert').bind('closed', function () {
 
             <h4>Checkbox</h4>
             <p>Add <code>data-toggle="buttons-checkbox"</code> for checkbox style toggling on btn-group.</p>
-            <div class="bs-docs-example" style="padding-bottom: 24px;">
+            <div class="bs-example" style="padding-bottom: 24px;">
               <div class="btn-group" data-toggle="buttons-checkbox">
                 <label class="btn btn-primary">
                   <input type="checkbox"> Option 1
@@ -1172,7 +1172,7 @@ $('#my-alert').bind('closed', function () {
 
             <h4>Radio</h4>
             <p>Add <code>data-toggle="buttons-radio"</code> for radio style toggling on btn-group.</p>
-            <div class="bs-docs-example" style="padding-bottom: 24px;">
+            <div class="bs-example" style="padding-bottom: 24px;">
               <div class="btn-group" data-toggle="buttons-radio">
                 <label class="btn btn-primary">
                   <input type="radio" name="options" id="option1"> Option 1
@@ -1272,7 +1272,7 @@ $('.nav-tabs').button()
             <h2>Example accordion</h2>
             <p>Using the collapse plugin, we built a simple accordion style widget:</p>
 
-            <div class="bs-docs-example">
+            <div class="bs-example">
               <div class="accordion" id="accordion2">
                 <div class="accordion-group">
                   <div class="accordion-heading">
@@ -1473,7 +1473,7 @@ $('#myCollapsible').on('hidden', function () {
 
             <h2>Examples</h2>
             <p>The slideshow below shows a generic plugin and component for cycling through elements like a carousel.</p>
-            <div class="bs-docs-example">
+            <div class="bs-example">
               <div id="carousel-example-generic" class="carousel slide bs-docs-carousel-example">
                 <ol class="carousel-indicators">
                   <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
@@ -1535,7 +1535,7 @@ $('#myCollapsible').on('hidden', function () {
               <h4>Responsive visibility</h4>
               <p><strong>Captions are hidden by default</strong> and will show up only with viewports greater than 768px wide.</p>
             </div>
-            <div class="bs-docs-example">
+            <div class="bs-example">
               <div id="carousel-example-captions" class="carousel slide bs-docs-carousel-example">
                 <ol class="carousel-indicators">
                   <li data-target="#carousel-example-captions" data-slide-to="0" class="active"></li>

docs/welcome.html

@@ -116,7 +116,7 @@ lead: "Welcome to the Bootstrap documentation, the living, interactive style and
 {% endhighlight %}
 
     <h3>Examples</h3>
-    <div class="row bs-docs-examples">
+    <div class="row bs-examples">
       <div class="col col-lg-4">
         <a class="thumbnail" href="/examples/starter-template/" target="_blank">
           <img src="/assets/img/examples/bootstrap-example-starter.png" alt="">