rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2024-12-10 22:24:19 +01:00
Code Issues Actions Packages Releases Activity

enable support for form states on select elements

Browse Source
This commit is contained in:
Mark Otto 2012-01-25 11:35:08 -08:00
parent a4b8cc2a9c
commit 58d08a2db3
5 changed files with 37 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
bootstrap.css vendored
View File

@ -6,7 +6,7 @@
* http://www.apache.org/licenses/LICENSE-2.0 * http://www.apache.org/licenses/LICENSE-2.0
* *
* Designed and built with all the love in the world @twitter by @mdo and @fat. * Designed and built with all the love in the world @twitter by @mdo and @fat.
* Date: Wed Jan 25 11:27:15 PST 2012 * Date: Wed Jan 25 11:31:57 PST 2012
*/ */
article, article,
aside, aside,
@ -715,11 +715,11 @@ textarea[readonly] {
.control-group.warning > label, .control-group.warning .help-block, .control-group.warning .help-inline { .control-group.warning > label, .control-group.warning .help-block, .control-group.warning .help-inline {
color: #c09853; color: #c09853;
} }
.control-group.warning input, .control-group.warning textarea { .control-group.warning input, .control-group.warning select, .control-group.warning textarea {
color: #c09853; color: #c09853;
border-color: #c09853; border-color: #c09853;
} }
.control-group.warning input:focus, .control-group.warning textarea:focus { .control-group.warning input:focus, .control-group.warning select:focus, .control-group.warning textarea:focus {
border-color: #a47e3c; border-color: #a47e3c;
-webkit-box-shadow: 0 0 6px #dbc59e; -webkit-box-shadow: 0 0 6px #dbc59e;
-moz-box-shadow: 0 0 6px #dbc59e; -moz-box-shadow: 0 0 6px #dbc59e;
@ -733,11 +733,11 @@ textarea[readonly] {
.control-group.error > label, .control-group.error .help-block, .control-group.error .help-inline { .control-group.error > label, .control-group.error .help-block, .control-group.error .help-inline {
color: #b94a48; color: #b94a48;
} }
.control-group.error input, .control-group.error textarea { .control-group.error input, .control-group.error select, .control-group.error textarea {
color: #b94a48; color: #b94a48;
border-color: #b94a48; border-color: #b94a48;
} }
.control-group.error input:focus, .control-group.error textarea:focus { .control-group.error input:focus, .control-group.error select:focus, .control-group.error textarea:focus {
border-color: #953b39; border-color: #953b39;
-webkit-box-shadow: 0 0 6px #d59392; -webkit-box-shadow: 0 0 6px #d59392;
-moz-box-shadow: 0 0 6px #d59392; -moz-box-shadow: 0 0 6px #d59392;
@ -751,11 +751,11 @@ textarea[readonly] {
.control-group.success > label, .control-group.success .help-block, .control-group.success .help-inline { .control-group.success > label, .control-group.success .help-block, .control-group.success .help-inline {
color: #468847; color: #468847;
} }
.control-group.success input, .control-group.success textarea { .control-group.success input, .control-group.success select, .control-group.success textarea {
color: #468847; color: #468847;
border-color: #468847; border-color: #468847;
} }
.control-group.success input:focus, .control-group.success textarea:focus { .control-group.success input:focus, .control-group.success select:focus, .control-group.success textarea:focus {
border-color: #356635; border-color: #356635;
-webkit-box-shadow: 0 0 6px #7aba7b; -webkit-box-shadow: 0 0 6px #7aba7b;
-moz-box-shadow: 0 0 6px #7aba7b; -moz-box-shadow: 0 0 6px #7aba7b;

6
bootstrap.min.css vendored
View File

@ -145,13 +145,13 @@ select.span11{width:870px;}
select.span12{width:950px;} select.span12{width:950px;}
input[disabled],select[disabled],textarea[disabled],input[readonly],select[readonly],textarea[readonly]{background-color:#f5f5f5;border-color:#ddd;cursor:not-allowed;} input[disabled],select[disabled],textarea[disabled],input[readonly],select[readonly],textarea[readonly]{background-color:#f5f5f5;border-color:#ddd;cursor:not-allowed;}
.control-group.warning>label,.control-group.warning .help-block,.control-group.warning .help-inline{color:#c09853;} .control-group.warning>label,.control-group.warning .help-block,.control-group.warning .help-inline{color:#c09853;}
.control-group.warning input,.control-group.warning textarea{color:#c09853;border-color:#c09853;}.control-group.warning input:focus,.control-group.warning textarea:focus{border-color:#a47e3c;-webkit-box-shadow:0 0 6px #dbc59e;-moz-box-shadow:0 0 6px #dbc59e;box-shadow:0 0 6px #dbc59e;} .control-group.warning input,.control-group.warning select,.control-group.warning textarea{color:#c09853;border-color:#c09853;}.control-group.warning input:focus,.control-group.warning select:focus,.control-group.warning textarea:focus{border-color:#a47e3c;-webkit-box-shadow:0 0 6px #dbc59e;-moz-box-shadow:0 0 6px #dbc59e;box-shadow:0 0 6px #dbc59e;}
.control-group.warning .input-prepend .add-on,.control-group.warning .input-append .add-on{color:#c09853;background-color:#fcf8e3;border-color:#c09853;} .control-group.warning .input-prepend .add-on,.control-group.warning .input-append .add-on{color:#c09853;background-color:#fcf8e3;border-color:#c09853;}
.control-group.error>label,.control-group.error .help-block,.control-group.error .help-inline{color:#b94a48;} .control-group.error>label,.control-group.error .help-block,.control-group.error .help-inline{color:#b94a48;}
.control-group.error input,.control-group.error textarea{color:#b94a48;border-color:#b94a48;}.control-group.error input:focus,.control-group.error textarea:focus{border-color:#953b39;-webkit-box-shadow:0 0 6px #d59392;-moz-box-shadow:0 0 6px #d59392;box-shadow:0 0 6px #d59392;} .control-group.error input,.control-group.error select,.control-group.error textarea{color:#b94a48;border-color:#b94a48;}.control-group.error input:focus,.control-group.error select:focus,.control-group.error textarea:focus{border-color:#953b39;-webkit-box-shadow:0 0 6px #d59392;-moz-box-shadow:0 0 6px #d59392;box-shadow:0 0 6px #d59392;}
.control-group.error .input-prepend .add-on,.control-group.error .input-append .add-on{color:#b94a48;background-color:#f2dede;border-color:#b94a48;} .control-group.error .input-prepend .add-on,.control-group.error .input-append .add-on{color:#b94a48;background-color:#f2dede;border-color:#b94a48;}
.control-group.success>label,.control-group.success .help-block,.control-group.success .help-inline{color:#468847;} .control-group.success>label,.control-group.success .help-block,.control-group.success .help-inline{color:#468847;}
.control-group.success input,.control-group.success textarea{color:#468847;border-color:#468847;}.control-group.success input:focus,.control-group.success textarea:focus{border-color:#356635;-webkit-box-shadow:0 0 6px #7aba7b;-moz-box-shadow:0 0 6px #7aba7b;box-shadow:0 0 6px #7aba7b;} .control-group.success input,.control-group.success select,.control-group.success textarea{color:#468847;border-color:#468847;}.control-group.success input:focus,.control-group.success select:focus,.control-group.success textarea:focus{border-color:#356635;-webkit-box-shadow:0 0 6px #7aba7b;-moz-box-shadow:0 0 6px #7aba7b;box-shadow:0 0 6px #7aba7b;}
.control-group.success .input-prepend .add-on,.control-group.success .input-append .add-on{color:#468847;background-color:#dff0d8;border-color:#468847;} .control-group.success .input-prepend .add-on,.control-group.success .input-append .add-on{color:#468847;background-color:#dff0d8;border-color:#468847;}
input:focus:required:invalid,textarea:focus:required:invalid,select:focus:required:invalid{color:#b94a48;border-color:#ee5f5b;}input:focus:required:invalid:focus,textarea:focus:required:invalid:focus,select:focus:required:invalid:focus{border-color:#e9322d;-webkit-box-shadow:0 0 6px #f8b9b7;-moz-box-shadow:0 0 6px #f8b9b7;box-shadow:0 0 6px #f8b9b7;} input:focus:required:invalid,textarea:focus:required:invalid,select:focus:required:invalid{color:#b94a48;border-color:#ee5f5b;}input:focus:required:invalid:focus,textarea:focus:required:invalid:focus,select:focus:required:invalid:focus{border-color:#e9322d;-webkit-box-shadow:0 0 6px #f8b9b7;-moz-box-shadow:0 0 6px #f8b9b7;box-shadow:0 0 6px #f8b9b7;}
.form-actions{padding:17px 20px 18px;margin-top:18px;margin-bottom:18px;background-color:#f5f5f5;border-top:1px solid #ddd;} .form-actions{padding:17px 20px 18px;margin-top:18px;margin-bottom:18px;background-color:#f5f5f5;border-top:1px solid #ddd;}

13
docs/base-css.html
View File

@ -1066,6 +1066,19 @@
<span class="help-inline">Woohoo!</span> <span class="help-inline">Woohoo!</span>
</div> </div>
</fieldset> </fieldset>
<fieldset class="control-group success">
<label class="control-label" for="selectError">Select with success</label>
<div class="controls">
<select name="selectError">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
</select>
<span class="help-inline">Woohoo!</span>
</div>
</fieldset>
<fieldset class="form-actions"> <fieldset class="form-actions">
<button type="submit" class="btn primary">Save changes</button> <button type="submit" class="btn primary">Save changes</button>
<button type="reset" class="btn">Cancel</button> <button type="reset" class="btn">Cancel</button>

13
docs/templates/pages/base-css.mustache vendored
View File

@ -1002,6 +1002,19 @@
<span class="help-inline">{{_i}}Woohoo!{{/i}}</span> <span class="help-inline">{{_i}}Woohoo!{{/i}}</span>
</div> </div>
</fieldset> </fieldset>
<fieldset class="control-group success">
<label class="control-label" for="selectError">{{_i}}Select with success{{/i}}</label>
<div class="controls">
<select name="selectError">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
</select>
<span class="help-inline">{{_i}}Woohoo!{{/i}}</span>
</div>
</fieldset>
<fieldset class="form-actions"> <fieldset class="form-actions">
<button type="submit" class="btn primary">{{_i}}Save changes{{/i}}</button> <button type="submit" class="btn primary">{{_i}}Save changes{{/i}}</button>
<button type="reset" class="btn">{{_i}}Cancel{{/i}}</button> <button type="reset" class="btn">{{_i}}Cancel{{/i}}</button>

1
lib/forms.less
View File

@ -283,6 +283,7 @@ textarea[readonly] {
} }
// Style inputs accordingly // Style inputs accordingly
input, input,
select,
textarea { textarea {
color: @textColor; color: @textColor;
border-color: @borderColor; border-color: @borderColor;