mirror of
https://github.com/tenrok/bootstrap.git
synced 2026-05-24 14:04:09 +03:00
more tests for form styles; includes lightening help text
This commit is contained in:
+28
-21
@@ -3,10 +3,9 @@
|
||||
// --------------------------------------------------
|
||||
|
||||
|
||||
// General styles
|
||||
// Non-controls
|
||||
// -------------------------
|
||||
|
||||
|
||||
form {
|
||||
margin: 0 0 @baseLineHeight;
|
||||
}
|
||||
@@ -30,8 +29,9 @@ legend {
|
||||
}
|
||||
|
||||
label {
|
||||
display: block;
|
||||
display: inline-block;
|
||||
margin-bottom: 5px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
// Form controls
|
||||
@@ -65,7 +65,10 @@ input[type="color"],
|
||||
color: @gray;
|
||||
vertical-align: middle;
|
||||
background-color: @inputBackground;
|
||||
border: 1px solid @inputBorder;
|
||||
border-radius: @inputBorderRadius;
|
||||
.box-shadow(inset 0 1px 1px rgba(0,0,0,.075));
|
||||
.transition(~"border linear .2s, box-shadow linear .2s");
|
||||
}
|
||||
|
||||
// Reset appearance properties for textual inputs and textarea
|
||||
@@ -77,6 +80,17 @@ textarea,
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
// Reset width of input images, buttons, radios, checkboxes
|
||||
input[type="file"],
|
||||
input[type="image"],
|
||||
input[type="submit"],
|
||||
input[type="reset"],
|
||||
input[type="button"],
|
||||
input[type="radio"],
|
||||
input[type="checkbox"] {
|
||||
width: auto; // Override of generic input selector
|
||||
}
|
||||
|
||||
// Reset height since textareas have rows
|
||||
textarea {
|
||||
height: auto;
|
||||
@@ -99,10 +113,6 @@ input[type="search"],
|
||||
input[type="tel"],
|
||||
input[type="color"],
|
||||
.uneditable-input {
|
||||
border: 1px solid @inputBorder;
|
||||
.box-shadow(inset 0 1px 1px rgba(0,0,0,.075));
|
||||
.transition(~"border linear .2s, box-shadow linear .2s");
|
||||
|
||||
// Focus state
|
||||
&:focus {
|
||||
border-color: rgba(82,168,236,.8);
|
||||
@@ -120,17 +130,6 @@ input[type="checkbox"] {
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
// Reset width of input images, buttons, radios, checkboxes
|
||||
input[type="file"],
|
||||
input[type="image"],
|
||||
input[type="submit"],
|
||||
input[type="reset"],
|
||||
input[type="button"],
|
||||
input[type="radio"],
|
||||
input[type="checkbox"] {
|
||||
width: auto; // Override of generic input selector
|
||||
}
|
||||
|
||||
// Set the height of select and file controls to match text inputs
|
||||
select,
|
||||
input[type="file"] {
|
||||
@@ -201,9 +200,14 @@ textarea {
|
||||
// Indent the labels to position radios/checkboxes as hanging
|
||||
.radio,
|
||||
.checkbox {
|
||||
display: block;
|
||||
min-height: @baseLineHeight; // clear the floating input if there is no label text
|
||||
padding-left: 20px;
|
||||
}
|
||||
.radio label,
|
||||
.checkbox label {
|
||||
font-weight: normal;
|
||||
}
|
||||
.radio input[type="radio"],
|
||||
.checkbox input[type="checkbox"] {
|
||||
float: left;
|
||||
@@ -401,7 +405,7 @@ select:focus:invalid {
|
||||
|
||||
.help-block,
|
||||
.help-inline {
|
||||
color: lighten(@textColor, 15%); // lighten the text some for contrast
|
||||
color: lighten(@textColor, 25%); // lighten the text some for contrast
|
||||
}
|
||||
|
||||
.help-block {
|
||||
@@ -618,9 +622,12 @@ input.search-query {
|
||||
.form-search .checkbox,
|
||||
.form-inline .radio,
|
||||
.form-inline .checkbox {
|
||||
display: inline-block;
|
||||
padding-left: 0;
|
||||
margin-bottom: 0;
|
||||
vertical-align: middle;
|
||||
label {
|
||||
margin-bottom: 0;
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
// Remove float and margin, set to inline-block
|
||||
.form-search .radio input[type="radio"],
|
||||
|
||||
Reference in New Issue
Block a user