diff options
| author | fat <[email protected]> | 2013-07-17 19:33:49 -0700 |
|---|---|---|
| committer | fat <[email protected]> | 2013-07-17 19:33:49 -0700 |
| commit | 5396c40877eed11a21e4c0934b691e95b8e35be2 (patch) | |
| tree | e60293c637b232e733025df9cb1eda3cb92adbee /docs/components.html | |
| parent | f97dd5af493f532046a3782b12dea5354c947597 (diff) | |
| parent | 542e03ae3a2209b87e4db999b6ea869faf9293a9 (diff) | |
| download | bootstrap-5396c40877eed11a21e4c0934b691e95b8e35be2.tar.xz bootstrap-5396c40877eed11a21e4c0934b691e95b8e35be2.zip | |
Merge branch '3.0.0-wip' of github.com:twitter/bootstrap into 3.0.0-wip
Diffstat (limited to 'docs/components.html')
| -rw-r--r-- | docs/components.html | 30 |
1 files changed, 21 insertions, 9 deletions
diff --git a/docs/components.html b/docs/components.html index cf504ebfa..365eeb0d6 100644 --- a/docs/components.html +++ b/docs/components.html @@ -167,7 +167,13 @@ lead: "Dozens of reusable components built to provide iconography, dropdowns, na {% endhighlight %} <h3 id="btn-groups-justified">Justified button groups</h3> - <p>Make a group of buttons stretch at the same size to span the entire width of its parent. <strong>This only works with <code><a></code> elements</strong> as the <code><button></code> doesn't pick up these styles.</p> + <p>Make a group of buttons stretch at the same size to span the entire width of its parent.</p> + + <div class="bs-callout bs-callout-warning"> + <h4>Element-specific usage</h4> + <p>This only works with <code><a></code> elements as the <code><button></code> doesn't pick up these styles.</p> + </div> + <div class="bs-example"> <div class="btn-group btn-group-justified"> <a href="#" class="btn btn-default">Left</a> @@ -193,7 +199,7 @@ lead: "Dozens of reusable components built to provide iconography, dropdowns, na </div> <p class="lead">Use any button to trigger a dropdown menu by placing it within a <code>.btn-group</code> and providing the proper menu markup.</p> - <div class="bs-callout"> + <div class="bs-callout bs-callout-danger"> <h4>Plugin dependency</h4> <p>Button dropdowns require the <a href="/javascript/#dropdowns">dropdown plugin</a> to be included in your version of Bootstrap.</p> </div> @@ -530,7 +536,7 @@ lead: "Dozens of reusable components built to provide iconography, dropdowns, na <h3 id="nav-disabled-links">Disabled state</h3> <p>For any nav component (tabs, pills, or list), add <code>.disabled</code> for <strong>gray links and no hover effects</strong>.</p> - <div class="bs-callout"> + <div class="bs-callout bs-callout-warning"> <h4>Link functionality not impacted</h4> <p>This class will only change the <code><a></code>'s appearance, not its functionality. Use custom JavaScript to disable links here.</p> </div> @@ -814,7 +820,7 @@ lead: "Dozens of reusable components built to provide iconography, dropdowns, na </div> {% endhighlight %} - <div class="bs-callout"> + <div class="bs-callout bs-callout-danger"> <h4>Body padding required</h4> <p>The fixed navbar will overlay your other content, unless you add <code>padding</code> to the top of the <code><body></code>. Try out your own values or use our snippet below. Tip: By default, the navbar is 50px high.</p> {% highlight css %} @@ -843,7 +849,7 @@ body { padding-top: 70px; } </div> {% endhighlight %} - <div class="bs-callout"> + <div class="bs-callout bs-callout-danger"> <h4>Body padding required</h4> <p>The fixed navbar will overlay your other content, unless you add <code>padding</code> to the bottom of the <code><body></code>. Try out your own values or use our snippet below. Tip: By default, the navbar is 50px high.</p> {% highlight css %} @@ -944,7 +950,7 @@ body { padding-bottom: 70px; } </div><!-- /.navbar --> {% endhighlight %} - <div class="bs-callout"> + <div class="bs-callout bs-callout-danger"> <h4>Plugin dependency</h4> <p>The responsive navbar requires the <a href="/javascript/#collapse">collapse plugin</a> to be included in your version of Bootstrap.</p> </div> @@ -1261,7 +1267,7 @@ body { padding-bottom: 70px; } <h4>Self collapsing</h4> <p>When there are no new or unread items, badges will simply collapse (via CSS's <code>:empty</code> selector) provided no content exists within.</p> - <div class="bs-callout"> + <div class="bs-callout bs-callout-danger"> <h4>Cross-browser compatibility</h4> <p>Badges won't self collapse in Internet Explorer 8 because it lacks support for the <code>:empty</code> selector.</p> </div> @@ -1455,7 +1461,13 @@ body { padding-bottom: 70px; } <p class="lead">Provide contextual feedback messages for typical user actions with the handful of available and flexible alert messages. For inline dismissal, use the <a href="/javascript/#js-alerts">alerts jQuery plugin</a>.</p> <h3 id="alerts-default">Default alert</h3> - <p>Wrap any text and an optional dismiss button in <code>.alert</code> for a basic warning alert message. <strong>To ensure proper behavior across all devices</strong>, be sure to use <code><button></code> element with the <code>data-dismiss="alert"</code> data attribute.</p> + <p>Wrap any text and an optional dismiss button in <code>.alert</code> for a basic warning alert message.</p> + + <div class="bs-callout bs-callout-warning"> + <h4>Ensure proper behavior across all devices</h4> + <p>Be sure to use the <code><button></code> element with the <code>data-dismiss="alert"</code> data attribute.</p> + </div> + <div class="bs-example"> <div class="alert"> <button type="button" class="close" data-dismiss="alert">×</button> @@ -1548,7 +1560,7 @@ body { padding-bottom: 70px; } </div> <p class="lead">Provide up-to-date feedback on the progress of a workflow or action with simple yet flexible progress bars.</p> - <div class="bs-callout"> + <div class="bs-callout bs-callout-danger"> <h4>Cross-browser compatibility</h4> <p>Progress bars use CSS3 transitions and animations to achieve some of their effects. These features are not supported in Internet Explorer 9 and below or older versions of Firefox. Opera 12 does not support animations.</p> </div> |
