rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-02-17 14:54:30 +01:00
Code Issues Actions Packages Releases Activity

enable buttons in input-append and input-prepend

Browse Source
This commit is contained in:
Mark Otto 2012-03-11 23:43:19 -07:00
parent debc4b752f
commit c35b04cccd
5 changed files with 58 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
docs/assets/bootstrap.zip
View File

Binary file not shown.

17
docs/assets/css/bootstrap.css vendored
View File

@ -1021,6 +1021,11 @@ select:focus:required:invalid:focus {
vertical-align: middle;
background-color: #eeeeee;
border: 1px solid #ccc;
}
.input-prepend .add-on,
.input-append .add-on,
.input-prepend .btn,
.input-append .btn {
-webkit-border-radius: 3px 0 0 3px;
-moz-border-radius: 3px 0 0 3px;
border-radius: 3px 0 0 3px;
@ -1030,7 +1035,8 @@ select:focus:required:invalid:focus {
background-color: #a9dba9;
border-color: #46a546;
}
.input-prepend .add-on {
.input-prepend .add-on,
.input-prepend .btn {
margin-right: -1px;
}
.input-append input,
@ -1043,7 +1049,8 @@ select:focus:required:invalid:focus {
border-left-color: #eee;
border-right-color: #ccc;
}
.input-append .add-on {
.input-append .add-on,
.input-append .btn {
margin-left: -1px;
-webkit-border-radius: 0 3px 3px 0;
-moz-border-radius: 0 3px 3px 0;
@ -1056,13 +1063,15 @@ select:focus:required:invalid:focus {
-moz-border-radius: 0;
border-radius: 0;
}
.input-prepend.input-append .add-on:first-child {
.input-prepend.input-append .add-on:first-child,
.input-prepend.input-append .btn:first-child {
margin-right: -1px;
-webkit-border-radius: 3px 0 0 3px;
-moz-border-radius: 3px 0 0 3px;
border-radius: 3px 0 0 3px;
}
.input-prepend.input-append .add-on:last-child {
.input-prepend.input-append .add-on:last-child,
.input-prepend.input-append .btn:last-child {
margin-left: -1px;
-webkit-border-radius: 0 3px 3px 0;
-moz-border-radius: 0 3px 3px 0;

18
docs/base-css.html
View File

@ -1198,7 +1198,23 @@ For example, <code>section</code> should be wrapped as inline.
<div class="input-append">
<input class="span2" id="appendedInput" size="16" type="text"><span class="add-on">.00</span>
</div>
<p class="help-block">Here's more help text</p>
<span class="help-inline">Here's more help text</span>
</div>
</div>
<div class="control-group">
<label class="control-label" for="appendedPrependedInput">Append and prepend</label>
<div class="controls">
<div class="input-prepend input-append">
<span class="add-on">$</span><input class="span2" id="appendedPrependedInput" size="16" type="text"><span class="add-on">.00</span>
</div>
</div>
</div>
<div class="control-group">
<label class="control-label" for="appendedPrependedInput">Append with button</label>
<div class="controls">
<div class="input-append">
<input class="span2" id="appendedPrependedInput" size="16" type="text"><button class="btn" type="button">Go!</button>
</div>
</div>
</div>
<div class="control-group">

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

@ -1122,7 +1122,23 @@
<div class="input-append">
<input class="span2" id="appendedInput" size="16" type="text"><span class="add-on">.00</span>
</div>
<p class="help-block">{{_i}}Here's more help text{{/i}}</p>
<span class="help-inline">{{_i}}Here's more help text{{/i}}</span>
</div>
</div>
<div class="control-group">
<label class="control-label" for="appendedPrependedInput">{{_i}}Append and prepend{{/i}}</label>
<div class="controls">
<div class="input-prepend input-append">
<span class="add-on">$</span><input class="span2" id="appendedPrependedInput" size="16" type="text"><span class="add-on">.00</span>
</div>
</div>
</div>
<div class="control-group">
<label class="control-label" for="appendedPrependedInput">{{_i}}Append with button{{/i}}</label>
<div class="controls">
<div class="input-append">
<input class="span2" id="appendedPrependedInput" size="16" type="text"><button class="btn" type="button">Go!</button>
</div>
</div>
</div>
<div class="control-group">

15
less/forms.less
View File

@ -387,6 +387,9 @@ select:focus:required:invalid {
vertical-align: middle;
background-color: @grayLighter;
border: 1px solid #ccc;
}
.add-on,
.btn {
.border-radius(3px 0 0 3px);
}
.active {
@ -395,7 +398,8 @@ select:focus:required:invalid {
}
}
.input-prepend {
.add-on {
.add-on,
.btn {
margin-right: -1px;
}
}
@ -409,7 +413,8 @@ select:focus:required:invalid {
border-left-color: #eee;
border-right-color: #ccc;
}
.add-on {
.add-on,
.btn {
margin-left: -1px;
.border-radius(0 3px 3px 0);
}
@ -421,11 +426,13 @@ select:focus:required:invalid {
.uneditable-input {
.border-radius(0);
}
.add-on:first-child {
.add-on:first-child,
.btn:first-child {
margin-right: -1px;
.border-radius(3px 0 0 3px);
}
.add-on:last-child {
.add-on:last-child,
.btn:last-child {
margin-left: -1px;
.border-radius(0 3px 3px 0);
}