diff options
| author | Mark Otto <[email protected]> | 2013-02-05 01:07:43 -0800 |
|---|---|---|
| committer | Mark Otto <[email protected]> | 2013-02-05 01:07:43 -0800 |
| commit | 3949623eeee7315932f49cd13c5428241b690e9f (patch) | |
| tree | 00416d2166a7954360e8d3677e48c04c5098b621 /docs/components.html | |
| parent | 238566b4451e69c5558e0d48df7b02bfe871df6b (diff) | |
| download | bootstrap-3949623eeee7315932f49cd13c5428241b690e9f.tar.xz bootstrap-3949623eeee7315932f49cd13c5428241b690e9f.zip | |
simpler alerts docs
Diffstat (limited to 'docs/components.html')
| -rw-r--r-- | docs/components.html | 23 |
1 files changed, 6 insertions, 17 deletions
diff --git a/docs/components.html b/docs/components.html index b169164ad..2198145ec 100644 --- a/docs/components.html +++ b/docs/components.html @@ -1454,11 +1454,12 @@ ================================================== --> <section id="alerts"> <div class="page-header"> - <h1>Alerts <small>Styles for contextual feedback messages</small></h1> + <h1>Alerts</h1> </div> + <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.html#alerts">alerts jQuery plugin</a>.</p> - <h2>Default alert</h2> - <p>Wrap any text and an optional dismiss button in <code>.alert</code> for a basic warning alert message.</p> + <h3>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> <div class="bs-docs-example"> <div class="alert"> <button type="button" class="close" data-dismiss="alert">×</button> @@ -1472,17 +1473,7 @@ </div> </pre> - <h3>Dismiss buttons</h3> - <p>Mobile Safari and Mobile Opera browsers, in addition to the <code>data-dismiss="alert"</code> attribute, require an <code>href="#"</code> for the dismissal of alerts when using an <code><a></code> tag.</p> - <pre class="prettyprint linenums"><a href="#" class="close" data-dismiss="alert">&times;</a></pre> - <p>Alternatively, you may use a <code><button></code> element with the data attribute, which we have opted to do for our docs. When using <code><button></code>, you must include <code>type="button"</code> or your forms may not submit.</p> - <pre class="prettyprint linenums"><button type="button" class="close" data-dismiss="alert">&times;</button></pre> - - <h3>Dismiss alerts via JavaScript</h3> - <p>Use the <a href="./javascript.html#alerts">alerts jQuery plugin</a> for quick and easy dismissal of alerts.</p> - - - <h2>Options</h2> + <h3>Block alerts</h3> <p>For longer messages, increase the padding on the top and bottom of the alert wrapper by adding <code>.alert-block</code>.</p> <div class="bs-docs-example"> <div class="alert alert-block"> @@ -1499,10 +1490,8 @@ </div> </pre> - - <h2>Contextual alternatives</h2> + <h3>Contextual alternatives</h3> <p>Add optional classes to change an alert's connotation.</p> - <div class="bs-docs-example"> <div class="alert alert-error"> <button type="button" class="close" data-dismiss="alert">×</button> |
