.bs-docs-sidenote to .bs-callout

docs/javascript.html

@@ -15,7 +15,7 @@ lead: "Bring Bootstrap's components to life with over a dozen custom jQuery plug
 
     <h3 id="js-individual-compiled">Individual or compiled</h3>
     <p>Plugins can be included individually, or all at once. <strong>Do not attempt to include both.</strong> Both <strong>bootstrap.js</strong> and <strong>bootstrap.min.js</strong> contain all plugins in a single file.</p>
-    <div class="bs-docs-sidenote">
+    <div class="bs-callout">
       <h4>Plugin dependencies</h4>
       <p>Some plugins and CSS components depend on other plugins. If you include plugins individually, make sure to check for these dependencies in the docs (in notes like this one).</p>
     </div>
@@ -526,7 +526,7 @@ $('.dropdown-toggle').dropdown()
 $('#navbar-example').scrollspy()
 {% endhighlight %}
 
-          <div class="bs-docs-sidenote">
+          <div class="bs-callout">
             <h4>Resolvable ID targets required</h4>
             <p>Navbar links must have resolvable id targets. For example, a <code>&lt;a href="#home"&gt;home&lt;/a&gt;</code> must correspond to something in the DOM like <code>&lt;div id="home"&gt;&lt;/div&gt;</code>.</p>
           </div>
@@ -815,7 +815,7 @@ $('#example').tooltip(options)
              </tr>
             </tbody>
           </table>
-          <div class="bs-docs-sidenote">
+          <div class="bs-callout">
             <h4>Data attributes for individual tooltips</h4>
             <p>Options for individual tooltips can alternatively be specified through the use of data attributes, as explained above.</p>
           </div>
@@ -859,7 +859,7 @@ $('#example').tooltip(options)
         <h2>Examples</h2>
         <p>Add small overlays of content, like those on the iPad, to any element for housing secondary information. Hover over the button to trigger the popover.</p>
 
-        <div class="bs-docs-sidenote">
+        <div class="bs-callout">
           <h4>Plugin dependency</h4>
           <p>Popovers require the <a href="#tooltips">tooltip plugin</a> to be included in your version of Bootstrap.</p>
         </div>
@@ -999,7 +999,7 @@ $('#example').tooltip(options)
             </tr>
           </tbody>
         </table>
-        <div class="bs-docs-sidenote">
+        <div class="bs-callout">
           <h4>Data attributes for individual popovers</h4>
           <p>Options for individual popovers can alternatively be specified through the use of data attributes, as explained above.</p>
         </div>
@@ -1219,7 +1219,7 @@ $('.nav-tabs').button()
 
             <h4>$().button('toggle')</h4>
             <p>Toggles push state. Gives the button the appearance that it has been activated.</p>
-            <div class="bs-docs-sidenote">
+            <div class="bs-callout">
               <h4>Auto toggling</h4>
               <p>You can enable auto toggling of a button by using the <code>data-toggle</code> attribute.</p>
             </div>
@@ -1234,7 +1234,7 @@ $('.nav-tabs').button()
 <button type="button" class="btn" data-loading-text="loading stuff...">...</button>
 {% endhighlight %}
 
-            <div class="bs-docs-sidenote">
+            <div class="bs-callout">
               <h4>Cross-browser compatibility</h4>
               <p><a href="https://github.com/twitter/bootstrap/issues/793">Firefox persists the disabled state across page loads</a>. A workaround for this is to use <code>autocomplete="off"</code>.</p>
             </div>
@@ -1264,7 +1264,7 @@ $('.nav-tabs').button()
             <h3>About</h3>
             <p>Get base styles and flexible support for collapsible components like accordions and navigation.</p>
 
-            <div class="bs-docs-sidenote">
+            <div class="bs-callout">
               <h4>Plugin dependency</h4>
               <p>Collapse requires the <a href="#transitions">transitions plugin</a> to be included in your version of Bootstrap.</p>
             </div>
@@ -1531,7 +1531,7 @@ $('#myCollapsible').on('hidden', function () {
 
             <h3>Optional captions</h3>
             <p>Add captions to your slides easily with the <code>.carousel-caption</code> element within any <code>.item</code>. Place just about any optional HTML within there and it will be automatically aligned and formatted.</p>
-            <div class="bs-docs-sidenote">
+            <div class="bs-callout">
               <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>
@@ -1697,7 +1697,7 @@ $('.carousel').carousel({
 <div data-spy="affix" data-offset-top="200">...</div>
 {% endhighlight %}
 
-            <div class="bs-docs-sidenote">
+            <div class="bs-callout">
               <h4>Requires positioning</h4>
               <p>You must manage the position of a pinned element and the behavior of its immediate parent. Position is controlled by <code>affix</code>, <code>affix-top</code>, and <code>affix-bottom</code>. Remember to check for a potentially collapsed parent when the affix kicks in as it's removing content from the normal flow of the page.</p>
             </div>