rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-01-30 22:52:24 +01:00
Code Issues Actions Packages Releases Activity

Add a new test use case

Browse Source
This commit is contained in:
Julien Déramond 2024-12-29 21:44:28 +01:00
parent 059bb59e66
commit 761d57e2aa
No known key found for this signature in database
GPG Key ID: EE5F274EA1F477FA
1 changed files with 19 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
site/content/docs/5.3/components/close-button.md
View File

@ -12,7 +12,7 @@ toc: true
<button type="button" class="btn-close" aria-label="Close"></button> <button type="button" class="btn-close" aria-label="Close"></button>
{{< /example >}} {{< /example >}}
## Dark Close Button ## Dark Variant
{{< example >}} {{< example >}}
<div class="bg-dark p-2"> <div class="bg-dark p-2">
@ -55,3 +55,21 @@ toc: true
</div> </div>
</div> </div>
{{< /example >}} {{< /example >}}
## Toast and Close Button issue
Forcing `data-bs-theme="light"` didn't work in dark mode. Now, the cross button is always dark.
{{< example >}}
<div class="toast" role="alert" aria-live="assertive" aria-atomic="true">
<div class="toast-header bg-warning" data-bs-theme="light">
<img src="..." class="rounded me-2" alt="...">
<strong class="me-auto">Warning!</strong>
<small>11 mins ago</small>
<button type="button" class="btn-close" data-bs-dismiss="toast" aria-label="Close"></button>
</div>
<div class="toast-body">
This is a warning message.
</div>
</div>
{{< /example >}}