diff options
| author | Mark Otto <markdotto@gmail.com> | 2022-09-12 05:33:05 +0300 |
|---|---|---|
| committer | Mark Otto <markdotto@gmail.com> | 2022-11-11 21:27:17 +0300 |
| commit | 3fc5cd2644ffc57b17e1a32ccb4b1ca22d11aedf (patch) | |
| tree | 9b2a91c491666ad374b1c37528d316a27d9e92d5 | |
| parent | 0a698e0354873a5fcefc4781d7617111e30efb14 (diff) | |
Test out a deprecated-in badge
| -rw-r--r-- | site/content/docs/5.2/components/dropdowns.md | 6 | ||||
| -rw-r--r-- | site/layouts/shortcodes/deprecated-in.html | 5 |
2 files changed, 11 insertions, 0 deletions
diff --git a/site/content/docs/5.2/components/dropdowns.md b/site/content/docs/5.2/components/dropdowns.md index 2670a534e1..57623026b4 100644 --- a/site/content/docs/5.2/components/dropdowns.md +++ b/site/content/docs/5.2/components/dropdowns.md @@ -349,8 +349,14 @@ 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 warning >}} +**Heads up!** Dark variants for components were deprecated in v5.3.0 with the introduction of color modes. Instead of adding `.dropdown-menu-dark`, set `data-bs-theme="dark"` on the root element, a parent wrapper, or the component itself. +{{< /callout >}} + {{< example >}} <div class="dropdown"> <button class="btn btn-secondary dropdown-toggle" type="button" data-bs-toggle="dropdown" aria-expanded="false"> diff --git a/site/layouts/shortcodes/deprecated-in.html b/site/layouts/shortcodes/deprecated-in.html new file mode 100644 index 0000000000..7280c11cc2 --- /dev/null +++ b/site/layouts/shortcodes/deprecated-in.html @@ -0,0 +1,5 @@ +{{- /* Outputs badge to identify the first version something was added */ -}} + +{{- $version := .Get 0 -}} + +<small class="d-inline-flex mb-3 px-2 py-1 fw-semibold text-emphasis bg-warning bg-opacity-10 border border-warning border-opacity-10 rounded-2">Deprecated in v{{ $version }}</small> |