diff options
Diffstat (limited to 'site/content/docs/5.2/components/dropdowns.md')
| -rw-r--r-- | site/content/docs/5.2/components/dropdowns.md | 10 |
1 files changed, 10 insertions, 0 deletions
diff --git a/site/content/docs/5.2/components/dropdowns.md b/site/content/docs/5.2/components/dropdowns.md index cd243a792..b7dae56ab 100644 --- a/site/content/docs/5.2/components/dropdowns.md +++ b/site/content/docs/5.2/components/dropdowns.md @@ -349,8 +349,12 @@ Button dropdowns work with buttons of all sizes, including default and split dro ## Dark dropdowns +{{< deprecated-in "5.3.0" >}} + Opt into darker dropdowns to match a dark navbar or custom style by adding `.dropdown-menu-dark` onto an existing `.dropdown-menu`. No changes are required to the dropdown items. +{{< callout-deprecated-dark-variants "dropdown-menu" >}} + {{< example >}} <div class="dropdown"> <button class="btn btn-secondary dropdown-toggle" type="button" data-bs-toggle="dropdown" aria-expanded="false"> @@ -998,6 +1002,12 @@ As part of Bootstrap's evolving CSS variables approach, dropdowns now use local {{< scss-docs name="dropdown-css-vars" file="scss/_dropdown.scss" >}} +{{< callout info >}} +Dropdown items include at least one variable that is not set on `.dropdown`. This allows you to provide a new value while Bootstrap defaults to a fallback value. + +- `--bs-dropdown-item-border-radius` +{{< /callout >}} + Customization through CSS variables can be seen on the `.dropdown-menu-dark` class where we override specific values without adding duplicate CSS selectors. {{< scss-docs name="dropdown-dark-css-vars" file="scss/_dropdown.scss" >}} |