diff options
Diffstat (limited to 'vendor/twbs/bootstrap/scss/_button-group.scss')
-rw-r--r-- | vendor/twbs/bootstrap/scss/_button-group.scss | 66 |
1 files changed, 21 insertions, 45 deletions
diff --git a/vendor/twbs/bootstrap/scss/_button-group.scss b/vendor/twbs/bootstrap/scss/_button-group.scss index da02d7931..13aa0569a 100644 --- a/vendor/twbs/bootstrap/scss/_button-group.scss +++ b/vendor/twbs/bootstrap/scss/_button-group.scss @@ -1,5 +1,3 @@ -// stylelint-disable selector-no-qualifying-type - // Make the div behave like a button .btn-group, .btn-group-vertical { @@ -10,17 +8,17 @@ > .btn { position: relative; flex: 1 1 auto; + } - // Bring the hover, focused, and "active" buttons to the front to overlay - // the borders properly - @include hover() { - z-index: 1; - } - &:focus, - &:active, - &.active { - z-index: 1; - } + // Bring the hover, focused, and "active" buttons to the front to overlay + // the borders properly + > .btn-check:checked + .btn, + > .btn-check:focus + .btn, + > .btn:hover, + > .btn:focus, + > .btn:active, + > .btn.active { + z-index: 1; } } @@ -45,12 +43,17 @@ // Reset rounded corners > .btn:not(:last-child):not(.dropdown-toggle), > .btn-group:not(:last-child) > .btn { - @include border-right-radius(0); + @include border-end-radius(0); } - > .btn:not(:first-child), + // The left radius should be 0 if the button is: + // - the "third or more" child + // - the second child and the previous element isn't `.btn-check` (making it the first child visually) + // - part of a btn-group which isn't the first child + > .btn:nth-child(n + 3), + > :not(.btn-check) + .btn, > .btn-group:not(:first-child) > .btn { - @include border-left-radius(0); + @include border-start-radius(0); } } @@ -72,11 +75,11 @@ &::after, .dropup &::after, - .dropright &::after { + .dropend &::after { margin-left: 0; } - .dropleft &::before { + .dropstart &::before { margin-right: 0; } } @@ -129,35 +132,8 @@ @include border-bottom-radius(0); } - > .btn:not(:first-child), + > .btn ~ .btn, > .btn-group:not(:first-child) > .btn { @include border-top-radius(0); } } - - -// Checkbox and radio options -// -// In order to support the browser's form validation feedback, powered by the -// `required` attribute, we have to "hide" the inputs via `clip`. We cannot use -// `display: none;` or `visibility: hidden;` as that also hides the popover. -// Simply visually hiding the inputs via `opacity` would leave them clickable in -// certain cases which is prevented by using `clip` and `pointer-events`. -// This way, we ensure a DOM element is visible to position the popover from. -// -// See https://github.com/twbs/bootstrap/pull/12794 and -// https://github.com/twbs/bootstrap/pull/14559 for more information. - -.btn-group-toggle { - > .btn, - > .btn-group > .btn { - margin-bottom: 0; // Override default `<label>` value - - input[type="radio"], - input[type="checkbox"] { - position: absolute; - clip: rect(0, 0, 0, 0); - pointer-events: none; - } - } -} |