mirror of
https://github.com/twbs/bootstrap.git
synced 2024-11-29 11:24:18 +01:00
Readd focused example of inputs to docs; clean up alerts section
This commit is contained in:
parent
32bcbe5671
commit
97975c5fcf
@ -443,6 +443,19 @@ section > ul li {
|
||||
|
||||
|
||||
|
||||
/* Misc docs stuff
|
||||
-------------------------------------------------- */
|
||||
|
||||
/* Pseudo :focus state for showing how it looks in the docs */
|
||||
input.focused {
|
||||
border-color: rgba(82,168,236,.8);
|
||||
outline: 0;
|
||||
outline: thin dotted \9; /* IE6-9 */
|
||||
-moz-box-shadow: 0 0 8px rgba(82,168,236,.6);
|
||||
box-shadow: 0 0 8px rgba(82,168,236,.6);
|
||||
}
|
||||
|
||||
|
||||
/* Responsive variations
|
||||
-------------------------------------------------- */
|
||||
|
||||
|
@ -1578,9 +1578,6 @@
|
||||
<p>Use the <a href="./javascript.html#alerts">alerts jQuery plugin</a> for quick and easy dismissal of alerts.</p>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
<h2>Options</h2>
|
||||
<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">
|
||||
@ -1599,51 +1596,28 @@
|
||||
</pre>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
<h2>Contextual alternatives</h2>
|
||||
<p>Add optional classes to change an alert's connotation.</p>
|
||||
|
||||
<h3>Error or danger</h3>
|
||||
<div class="bs-docs-example">
|
||||
<div class="alert alert-error">
|
||||
<button type="button" class="close" data-dismiss="alert">×</button>
|
||||
<strong>Oh snap!</strong> Change a few things up and try submitting again.
|
||||
</div>
|
||||
</div>
|
||||
<pre class="prettyprint linenums">
|
||||
<div class="alert alert-error">
|
||||
...
|
||||
</div>
|
||||
</pre>
|
||||
|
||||
<h3>Success</h3>
|
||||
<div class="bs-docs-example">
|
||||
<div class="alert alert-success">
|
||||
<button type="button" class="close" data-dismiss="alert">×</button>
|
||||
<strong>Well done!</strong> You successfully read this important alert message.
|
||||
</div>
|
||||
</div>
|
||||
<pre class="prettyprint linenums">
|
||||
<div class="alert alert-success">
|
||||
...
|
||||
</div>
|
||||
</pre>
|
||||
|
||||
<h3>Information</h3>
|
||||
<div class="bs-docs-example">
|
||||
<div class="alert alert-info">
|
||||
<button type="button" class="close" data-dismiss="alert">×</button>
|
||||
<strong>Heads up!</strong> This alert needs your attention, but it's not super important.
|
||||
</div>
|
||||
</div>
|
||||
<pre class="prettyprint linenums">
|
||||
<div class="alert alert-info">
|
||||
...
|
||||
</div>
|
||||
<div class="alert alert-error">... </div>
|
||||
<div class="alert alert-success">...</div>
|
||||
<div class="alert alert-info">...</div>
|
||||
</pre>
|
||||
|
||||
</section>
|
||||
|
||||
|
||||
|
@ -1590,10 +1590,10 @@ For example, <code>&lt;section&gt;</code> should be wrapped
|
||||
<h3 id="forms-input-focus">Input focus</h3>
|
||||
<p>We remove the default <code>outline</code> styles on some form controls and apply a <code>box-shadow</code> in its place for <code>:focus</code>.</p>
|
||||
<form class="bs-docs-example form-inline">
|
||||
<input class="input-xlarge focused" id="focusedInput" type="text" value="This is focused...">
|
||||
<input class="focused" id="focusedInput" type="text" value="This is focused...">
|
||||
</form>
|
||||
<pre class="prettyprint linenums">
|
||||
<input class="input-xlarge" id="focusedInput" type="text" value="This is focused...">
|
||||
<input id="focusedInput" type="text" value="This is focused...">
|
||||
</pre>
|
||||
|
||||
<h3 id="forms-invalid-inputs">Invalid inputs</h3>
|
||||
|
32
docs/templates/pages/components.mustache
vendored
32
docs/templates/pages/components.mustache
vendored
@ -1509,9 +1509,6 @@
|
||||
<p>Use the <a href="./javascript.html#alerts">alerts jQuery plugin</a> for quick and easy dismissal of alerts.</p>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
<h2>Options</h2>
|
||||
<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">
|
||||
@ -1530,51 +1527,28 @@
|
||||
</pre>
|
||||
|
||||
|
||||
<hr class="bs-docs-separator">
|
||||
|
||||
|
||||
<h2>Contextual alternatives</h2>
|
||||
<p>Add optional classes to change an alert's connotation.</p>
|
||||
|
||||
<h3>Error or danger</h3>
|
||||
<div class="bs-docs-example">
|
||||
<div class="alert alert-error">
|
||||
<button type="button" class="close" data-dismiss="alert">×</button>
|
||||
<strong>Oh snap!</strong> Change a few things up and try submitting again.
|
||||
</div>
|
||||
</div>
|
||||
<pre class="prettyprint linenums">
|
||||
<div class="alert alert-error">
|
||||
...
|
||||
</div>
|
||||
</pre>
|
||||
|
||||
<h3>Success</h3>
|
||||
<div class="bs-docs-example">
|
||||
<div class="alert alert-success">
|
||||
<button type="button" class="close" data-dismiss="alert">×</button>
|
||||
<strong>Well done!</strong> You successfully read this important alert message.
|
||||
</div>
|
||||
</div>
|
||||
<pre class="prettyprint linenums">
|
||||
<div class="alert alert-success">
|
||||
...
|
||||
</div>
|
||||
</pre>
|
||||
|
||||
<h3>Information</h3>
|
||||
<div class="bs-docs-example">
|
||||
<div class="alert alert-info">
|
||||
<button type="button" class="close" data-dismiss="alert">×</button>
|
||||
<strong>Heads up!</strong> This alert needs your attention, but it's not super important.
|
||||
</div>
|
||||
</div>
|
||||
<pre class="prettyprint linenums">
|
||||
<div class="alert alert-info">
|
||||
...
|
||||
</div>
|
||||
<div class="alert alert-error">... </div>
|
||||
<div class="alert alert-success">...</div>
|
||||
<div class="alert alert-info">...</div>
|
||||
</pre>
|
||||
|
||||
</section>
|
||||
|
||||
|
||||
|
4
docs/templates/pages/css.mustache
vendored
4
docs/templates/pages/css.mustache
vendored
@ -1529,10 +1529,10 @@ For example, <code>&lt;section&gt;</code> should be wrapped
|
||||
<h3 id="forms-input-focus">Input focus</h3>
|
||||
<p>We remove the default <code>outline</code> styles on some form controls and apply a <code>box-shadow</code> in its place for <code>:focus</code>.</p>
|
||||
<form class="bs-docs-example form-inline">
|
||||
<input class="input-xlarge focused" id="focusedInput" type="text" value="This is focused...">
|
||||
<input class="focused" id="focusedInput" type="text" value="This is focused...">
|
||||
</form>
|
||||
<pre class="prettyprint linenums">
|
||||
<input class="input-xlarge" id="focusedInput" type="text" value="This is focused...">
|
||||
<input id="focusedInput" type="text" value="This is focused...">
|
||||
</pre>
|
||||
|
||||
<h3 id="forms-invalid-inputs">Invalid inputs</h3>
|
||||
|
Loading…
Reference in New Issue
Block a user