Skip to content

B
bootstrap
Commit 9716b73f authored by Blake Embrey's avatar Blake Embrey
Browse files
Options

Make the border-radius on input-groups to be overrides instead of resets on every size.

parent d5e6bbba
Hide whitespace changes
Inline Side-by-side
Showing with 32 additions and 128 deletions
docs/assets/css/bootstrap.css
View file @ 9716b73f
...@@ -1637,20 +1637,11 @@ select:focus:invalid:focus { ...@@ -1637,20 +1637,11 @@ select:focus:invalid:focus {
.input-group-btn, .input-group-btn,
.input-group input { .input-group input {
display: table-cell; display: table-cell;
/*margin: 0;*/
border-radius: 0;
}
.input-group-addon.input-small,
.input-group-btn.input-small,
.input-group input.input-small {
border-radius: 0;
} }
.input-group-addon.input-large, .input-group-addon:not(:first-child):not(:last-child),
.input-group-btn.input-large, .input-group-btn:not(:first-child):not(:last-child),
.input-group input.input-large { .input-group input:not(:first-child):not(:last-child) {
border-radius: 0; border-radius: 0;
} }
...@@ -1669,6 +1660,7 @@ select:focus:invalid:focus { ...@@ -1669,6 +1660,7 @@ select:focus:invalid:focus {
text-shadow: 0 1px 0 #fff; text-shadow: 0 1px 0 #fff;
background-color: #eeeeee; background-color: #eeeeee;
border: 1px solid #ccc; border: 1px solid #ccc;
border-radius: 4px;
-webkit-box-sizing: border-box; -webkit-box-sizing: border-box;
-moz-box-sizing: border-box; -moz-box-sizing: border-box;
box-sizing: border-box; box-sizing: border-box;
...@@ -1677,29 +1669,21 @@ select:focus:invalid:focus { ...@@ -1677,29 +1669,21 @@ select:focus:invalid:focus {
.input-group-addon.input-small { .input-group-addon.input-small {
padding: 2px 10px; padding: 2px 10px;
font-size: 11.9px; font-size: 11.9px;
border-radius: 3px;
} }
.input-group-addon.input-large { .input-group-addon.input-large {
padding: 11px 14px; padding: 11px 14px;
font-size: 17.5px; font-size: 17.5px;
border-radius: 6px;
} }
.input-group input:first-child, .input-group input:first-child,
.input-group-addon:first-child { .input-group-addon:first-child,
border-bottom-left-radius: 4px; .input-group-btn:first-child > .btn:first-child,
border-top-left-radius: 4px; .input-group-btn:first-child > .dropdown-toggle:first-child {
} border-top-right-radius: 0;
border-bottom-right-radius: 0;
.input-group input:first-child.input-small,
.input-group-addon:first-child.input-small {
border-bottom-left-radius: 3px;
border-top-left-radius: 3px;
}
.input-group input:first-child.input-large,
.input-group-addon:first-child.input-large {
border-bottom-left-radius: 6px;
border-top-left-radius: 6px;
} }
.input-group-addon:first-child { .input-group-addon:first-child {
...@@ -1707,21 +1691,11 @@ select:focus:invalid:focus { ...@@ -1707,21 +1691,11 @@ select:focus:invalid:focus {
} }
.input-group input:last-child, .input-group input:last-child,
.input-group-addon:last-child { .input-group-addon:last-child,
border-top-right-radius: 4px; .input-group-btn:last-child > .btn:last-child,
border-bottom-right-radius: 4px; .input-group-btn:last-child > .dropdown-toggle {
} border-bottom-left-radius: 0;
border-top-left-radius: 0;
.input-group input:last-child.input-small,
.input-group-addon:last-child.input-small {
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
}
.input-group input:last-child.input-large,
.input-group-addon:last-child.input-large {
border-top-right-radius: 6px;
border-bottom-right-radius: 6px;
} }
.input-group-addon:last-child { .input-group-addon:last-child {
...@@ -1736,7 +1710,6 @@ select:focus:invalid:focus { ...@@ -1736,7 +1710,6 @@ select:focus:invalid:focus {
.input-group-btn > .btn { .input-group-btn > .btn {
position: relative; position: relative;
float: left; float: left;
border-radius: 0;
} }
.input-group-btn > .btn + .btn { .input-group-btn > .btn + .btn {
...@@ -1748,42 +1721,6 @@ select:focus:invalid:focus { ...@@ -1748,42 +1721,6 @@ select:focus:invalid:focus {
z-index: 2; z-index: 2;
} }
.input-group-btn:first-child > .btn:first-child,
.input-group-btn:first-child > .dropdown-toggle:first-child {
border-bottom-left-radius: 4px;
border-top-left-radius: 4px;
}
.input-group-btn:first-child > .btn:first-child.btn-large,
.input-group-btn:first-child > .dropdown-toggle:first-child.btn-large {
border-bottom-left-radius: 6px;
border-top-left-radius: 6px;
}
.input-group-btn:first-child > .btn:first-child.btn-small,
.input-group-btn:first-child > .dropdown-toggle:first-child.btn-small {
border-bottom-left-radius: 3px;
border-top-left-radius: 3px;
}
.input-group-btn:last-child > .btn:last-child,
.input-group-btn:last-child > .dropdown-toggle {
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}
.input-group-btn:last-child > .btn:last-child.btn-large,
.input-group-btn:last-child > .dropdown-toggle.btn-large {
border-top-right-radius: 6px;
border-bottom-right-radius: 6px;
}
.input-group-btn:last-child > .btn:last-child.btn-small,
.input-group-btn:last-child > .dropdown-toggle.btn-small {
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
}
.form-inline input, .form-inline input,
.form-inline select, .form-inline select,
.form-inline textarea, .form-inline textarea,
......
less/forms.less
View file @ 9716b73f
...@@ -407,12 +407,8 @@ select:focus:invalid { ...@@ -407,12 +407,8 @@ select:focus:invalid {
.input-group-btn, .input-group-btn,
.input-group input { .input-group input {
display: table-cell; display: table-cell;
/*margin: 0;*/
border-radius: 0; &:not(:first-child):not(:last-child) {
&.input-small {
border-radius: 0;
}
&.input-large {
border-radius: 0; border-radius: 0;
} }
} }
...@@ -435,40 +431,35 @@ select:focus:invalid { ...@@ -435,40 +431,35 @@ select:focus:invalid {
text-shadow: 0 1px 0 #fff; text-shadow: 0 1px 0 #fff;
background-color: @gray-lighter; background-color: @gray-lighter;
border: 1px solid #ccc; border: 1px solid #ccc;
border-radius: @border-radius-base;
&.input-small { &.input-small {
padding: @padding-small; padding: @padding-small;
font-size: @font-size-small; font-size: @font-size-small;
border-radius: @border-radius-small;
} }
&.input-large { &.input-large {
padding: @padding-large; padding: @padding-large;
font-size: @font-size-large; font-size: @font-size-large;
border-radius: @border-radius-large;
} }
} }
// Reset rounded corners // Reset rounded corners
.input-group input:first-child, .input-group input:first-child,
.input-group-addon:first-child { .input-group-addon:first-child,
.border-left-radius(@border-radius-base); .input-group-btn:first-child > .btn:first-child,
&.input-small { .input-group-btn:first-child > .dropdown-toggle:first-child {
.border-left-radius(@border-radius-small); .border-right-radius(0);
}
&.input-large {
.border-left-radius(@border-radius-large);
}
} }
.input-group-addon:first-child { .input-group-addon:first-child {
border-right: 0; border-right: 0;
} }
.input-group input:last-child, .input-group input:last-child,
.input-group-addon:last-child { .input-group-addon:last-child,
.border-right-radius(@border-radius-base); .input-group-btn:last-child > .btn:last-child,
&.input-small { .input-group-btn:last-child > .dropdown-toggle {
.border-right-radius(@border-radius-small); .border-left-radius(0);
}
&.input-large {
.border-right-radius(@border-radius-large);
}
} }
.input-group-addon:last-child { .input-group-addon:last-child {
border-left: 0; border-left: 0;
...@@ -483,7 +474,6 @@ select:focus:invalid { ...@@ -483,7 +474,6 @@ select:focus:invalid {
.input-group-btn > .btn { .input-group-btn > .btn {
position: relative; position: relative;
float: left; // Collapse white-space float: left; // Collapse white-space
border-radius: 0;
+ .btn { + .btn {
margin-left: -1px; margin-left: -1px;
} }
...@@ -494,29 +484,6 @@ select:focus:invalid { ...@@ -494,29 +484,6 @@ select:focus:invalid {
} }
} }
// Prepended buttons
.input-group-btn:first-child {
// Round the left corners only
> .btn:first-child,
> .dropdown-toggle:first-child {
.border-left-radius(@border-radius-base);
&.btn-large { .border-left-radius(@border-radius-large); }
&.btn-small { .border-left-radius(@border-radius-small); }
}
}
// Appended buttons
.input-group-btn:last-child {
// Round the right corners only
> .btn:last-child,
> .dropdown-toggle {
.border-right-radius(@border-radius-base);
&.btn-large { .border-right-radius(@border-radius-large); }
&.btn-small { .border-right-radius(@border-radius-small); }
}
}
// Inline forms // Inline forms
// -------------------------------------------------- // --------------------------------------------------
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment