0
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-02-19 16:54:24 +01:00

Fix .btn-group-vertical border radius with dropdown as first element (#40488)
Some checks failed
BrowserStack / browserstack (push) Has been skipped
Bundlewatch / bundlewatch (push) Failing after 0s
CodeQL / Analyze (push) Failing after 0s
cspell / cspell (push) Failing after 0s
CSS / css (push) Failing after 0s
Docs / docs (push) Failing after 0s
JS Tests / JS Tests (push) Failing after 0s
Lint / lint (push) Failing after 0s
CSS (node-sass) / css (push) Failing after 0s
Release notes / update_release_draft (push) Has been skipped

Co-authored-by: Julien Déramond <juderamond@gmail.com>
This commit is contained in:
Tobias 2024-05-30 07:49:28 +02:00 committed by GitHub
parent 442421bcc2
commit 76ed1c6b14
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 8 additions and 3 deletions

View File

@ -135,7 +135,12 @@
@include border-bottom-radius(0);
}
> .btn ~ .btn,
// The top 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-top-radius(0);
}

View File

@ -195,8 +195,6 @@ Make a set of buttons appear vertically stacked rather than horizontally. **Spli
{{< example >}}
<div class="btn-group-vertical" role="group" aria-label="Vertical button group">
<button type="button" class="btn btn-primary">Button</button>
<button type="button" class="btn btn-primary">Button</button>
<div class="btn-group" role="group">
<button type="button" class="btn btn-primary dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
Dropdown
@ -206,6 +204,8 @@ Make a set of buttons appear vertically stacked rather than horizontally. **Spli
<li><a class="dropdown-item" href="#">Dropdown link</a></li>
</ul>
</div>
<button type="button" class="btn btn-primary">Button</button>
<button type="button" class="btn btn-primary">Button</button>
<div class="btn-group dropstart" role="group">
<button type="button" class="btn btn-primary dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
Dropdown