mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-28 07:39:57 +02:00
Code Issues Releases Wiki Activity

Fix input group border radius issue (#25075) (#25076)

Browse Source 
* Fix input group border radius issue (#25075)

* Remove migration note

- All buttons In input group do not have to be the same element now.

* lint
This commit is contained in:
ysds
2017-12-27 07:23:07 +09:00
committed by Mark Otto
parent be6fbf5387
commit 8c6011ab4f
2 changed files with 19 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
scss/_input-group.scss
View File

@@ -33,9 +33,8 @@
.form-control,
.custom-select {
&:not(:first-child):not(:last-of-type) { @include border-radius(0); }
&:first-child { @include border-right-radius(0); }
&:last-of-type:not(:first-child) { @include border-left-radius(0); }
&:not(:last-child) { @include border-right-radius(0); }
&:not(:first-child) { @include border-left-radius(0); }
}
// Custom file inputs have more complex markup, thus requiring different
@@ -44,12 +43,10 @@
display: flex;
align-items: center;
&:not(:first-child):not(:last-of-type) .custom-file-control,
&:not(:first-child):not(:last-of-type) .custom-file-control::before { @include border-radius(0); }
&:first-child .custom-file-control,
&:first-child .custom-file-control::before { @include border-right-radius(0); }
&:last-of-type:not(:first-child) .custom-file-control,
&:last-of-type:not(:first-child) .custom-file-control::before { @include border-left-radius(0); }
&:not(:last-child) .custom-file-control,
&:not(:last-child) .custom-file-control::before { @include border-right-radius(0); }
&:not(:first-child) .custom-file-control,
&:not(:first-child) .custom-file-control::before { @include border-left-radius(0); }
}
}
@@ -139,28 +136,21 @@
// border-radius values when extending. They're more specific than we'd like
// with the `.input-group >` part, but without it, we cannot override the sizing.
.input-group > .input-group-prepend > .btn,
.input-group > .input-group-prepend > .input-group-text {
// All prepended buttons have no right border-radius
.input-group > .input-group-prepend > .input-group-text,
.input-group > .input-group-append:not(:last-child) > .btn,
.input-group > .input-group-append:not(:last-child) > .input-group-text,
.input-group > .input-group-append:last-child > .btn:not(:last-child):not(.dropdown-toggle),
.input-group > .input-group-append:last-child > .input-group-text:not(:last-child) {
@include border-right-radius(0);
+ .btn,
+ .input-group-text {
@include border-left-radius(0);
}
}
// We separate out the button and input resets here because `.input-group-text`
// can be any HTML element, but buttons are always inputs, buttons, or anchors.
.input-group > .input-group-append {
// Everything but the last one have no rounded corners
.btn:not(:last-of-type),
.input-group-text:not(:last-child) {
@include border-radius(0);
}
.btn:last-of-type,
.input-group-text:last-child {
@include border-left-radius(0);
}
.input-group > .input-group-append > .btn,
.input-group > .input-group-append > .input-group-text,
.input-group > .input-group-prepend:not(:first-child) > .btn,
.input-group > .input-group-prepend:not(:first-child) > .input-group-text,
.input-group > .input-group-prepend:first-child > .btn:not(:first-child),
.input-group > .input-group-prepend:first-child > .input-group-text:not(:first-child) {
@include border-left-radius(0);
}