rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-02-06 04:08:22 +01:00
Code Issues Actions Packages Releases Activity

update forms help-block

Browse Source
This commit is contained in:
Mark Otto 2012-02-21 13:43:13 -08:00
parent d908731566
commit 664a5c4438
5 changed files with 21 additions and 8 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.

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

@ -855,11 +855,12 @@ input:focus:required:invalid:focus, textarea:focus:required:invalid:focus, selec
::-webkit-input-placeholder { ::-webkit-input-placeholder {
color: #999999; color: #999999;
} }
.help-block, .help-inline {
color: #555555;
}
.help-block { .help-block {
display: block; display: block;
margin-top: 5px; margin-bottom: 9px;
margin-bottom: 0;
color: #999999;
} }
.help-inline { .help-inline {
display: inline-block; display: inline-block;
@ -867,7 +868,6 @@ input:focus:required:invalid:focus, textarea:focus:required:invalid:focus, selec
/* IE7 inline-block hack */ /* IE7 inline-block hack */
*zoom: 1; *zoom: 1;
margin-bottom: 9px;
vertical-align: middle; vertical-align: middle;
padding-left: 5px; padding-left: 5px;
} }
@ -1044,6 +1044,10 @@ legend + .control-group {
.form-horizontal .controls { .form-horizontal .controls {
margin-left: 160px; margin-left: 160px;
} }
.form-horizontal .help-block {
margin-top: 9px;
margin-bottom: 0;
}
.form-horizontal .form-actions { .form-horizontal .form-actions {
padding-left: 160px; padding-left: 160px;
} }

1
docs/base-css.html
View File

@ -864,6 +864,7 @@ For example, <code>section</code> should be wrapped as inline.
<form class="well"> <form class="well">
<label>Label name</label> <label>Label name</label>
<input type="text" class="span3" placeholder="Type something…"> <span class="help-inline">Associated help text!</span> <input type="text" class="span3" placeholder="Type something…"> <span class="help-inline">Associated help text!</span>
<p class="help-block">Example block-level help text here.</p>
<label class="checkbox"> <label class="checkbox">
<input type="checkbox"> Check me out <input type="checkbox"> Check me out
</label> </label>

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

@ -788,6 +788,7 @@
<form class="well"> <form class="well">
<label>{{_i}}Label name{{/i}}</label> <label>{{_i}}Label name{{/i}}</label>
<input type="text" class="span3" placeholder="{{_i}}Type something…{{/i}}"> <span class="help-inline">Associated help text!</span> <input type="text" class="span3" placeholder="{{_i}}Type something…{{/i}}"> <span class="help-inline">Associated help text!</span>
<p class="help-block">{{_i}}Example block-level help text here.{{/i}}</p>
<label class="checkbox"> <label class="checkbox">
<input type="checkbox"> {{_i}}Check me out{{/i}} <input type="checkbox"> {{_i}}Check me out{{/i}}
</label> </label>

15
less/forms.less
View File

@ -335,17 +335,19 @@ select:focus:required:invalid {
// HELP TEXT // HELP TEXT
// --------- // ---------
.help-block,
.help-inline {
color: @gray; // lighten the text some for contrast
}
.help-block { .help-block {
display: block; // account for any element using help-block display: block; // account for any element using help-block
margin-top: 5px; margin-bottom: @baseLineHeight / 2;
margin-bottom: 0;
color: @grayLight;
} }
.help-inline { .help-inline {
display: inline-block; display: inline-block;
.ie7-inline-block(); .ie7-inline-block();
margin-bottom: 9px;
vertical-align: middle; vertical-align: middle;
padding-left: 5px; padding-left: 5px;
} }
@ -528,6 +530,11 @@ legend + .control-group {
.controls { .controls {
margin-left: 160px; margin-left: 160px;
} }
// Remove bottom margin on block level help text since that's accounted for on .control-group
.help-block {
margin-top: @baseLineHeight / 2;
margin-bottom: 0;
}
// Move over buttons in .form-actions to align with .controls // Move over buttons in .form-actions to align with .controls
.form-actions { .form-actions {
padding-left: 160px; padding-left: 160px;