fixes #5127: add @inputHeight to replace static instances of '30px' throughout forms

This commit is contained in:
Mark Otto 2012-09-20 11:45:59 -07:00
parent 532ee08213
commit c92a75999f
4 changed files with 10 additions and 9 deletions

View File

@ -1148,14 +1148,14 @@ textarea::-webkit-input-placeholder {
.radio,
.checkbox {
min-height: 18px;
padding-left: 18px;
min-height: 20px;
padding-left: 20px;
}
.radio input[type="radio"],
.checkbox input[type="checkbox"] {
float: left;
margin-left: -18px;
margin-left: -20px;
}
.controls > .radio:first-child,

View File

@ -154,9 +154,9 @@ input[type="checkbox"] {
// Set the height of select and file controls to match text inputs
select,
input[type="file"] {
height: 30px; /* In IE7, the height of the select element cannot be changed by height, only font-size */
height: @inputHeight; /* In IE7, the height of the select element cannot be changed by height, only font-size */
*margin-top: 4px; /* For IE7, add top margin to align select with labels */
line-height: 30px;
line-height: @inputHeight;
}
// Make select elements obey height by applying a border
@ -223,13 +223,13 @@ textarea {
// Indent the labels to position radios/checkboxes as hanging
.radio,
.checkbox {
min-height: 18px; // clear the floating input if there is no label text
padding-left: 18px;
min-height: @baseLineHeight; // clear the floating input if there is no label text
padding-left: 20px;
}
.radio input[type="radio"],
.checkbox input[type="checkbox"] {
float: left;
margin-left: -18px;
margin-left: -20px;
}
// Move the options list down to align with labels

View File

@ -154,7 +154,7 @@
.input-block-level {
display: block;
width: 100%;
min-height: 30px; // Make inputs at least the height of their button counterpart
min-height: @inputHeight; // Make inputs at least the height of their button counterpart (base line-height + padding + border)
.box-sizing(border-box); // Makes inputs behave like true block-level elements
}

View File

@ -114,6 +114,7 @@
@inputBorderRadius: @baseBorderRadius;
@inputDisabledBackground: @grayLighter;
@formActionsBackground: #f5f5f5;
@inputHeight: @baseLineHeight + 10px; // base line-height + 8px vertical padding + 2px top/bottom border
// Dropdowns