mirrors/bootstrap
2
0
Fork 0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-06-11 18:02:28 +03:00
Code Activity

Update docs for color and bg utilities

Browse Source 
- Split colors from background utilities with new docs page
- Add Sass docs for both pages
This commit is contained in:
Mark Otto
2021-01-17 00:06:19 +02:00
committed by XhmikosR
parent 14cfb7af93
commit 88be1ce502
12 changed files with 147 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files
site/content/docs/5.0/components/card.md
+1 -1
View File
@@ -417,7 +417,7 @@ Cards include various options for customizing their backgrounds, borders, and co
### Background and color
Use [text and background utilities]({{< docsref "/utilities/colors" >}}) to change the appearance of a card.
Use [text color]({{< docsref "/utilities/colors" >}}) and [background utilities]({{< docsref "/utilities/background" >}}) to change the appearance of a card.
{{< example >}}
{{< card.inline >}}
site/content/docs/5.0/components/navbar.md
+1 -1
View File
@@ -74,7 +74,7 @@ Here's an example of all the sub-components included in a responsive light-theme
</nav>
{{< /example >}}
This example uses [color]({{< docsref "/utilities/colors" >}}) (`bg-light`) and [spacing]({{< docsref "/utilities/spacing" >}}) (`my-2`, `my-lg-0`, `me-sm-0`, `my-sm-0`) utility classes.
This example uses [background]({{< docsref "/utilities/background" >}}) (`bg-light`) and [spacing]({{< docsref "/utilities/spacing" >}}) (`my-2`, `my-lg-0`, `me-sm-0`, `my-sm-0`) utility classes.
### Brand
site/content/docs/5.0/components/toasts.md
+1 -1
View File
@@ -162,7 +162,7 @@ Alternatively, you can also add additional controls and components to toasts.
### Color schemes
Building on the above example, you can create different toast color schemes with our [color utilities]({{< docsref "/utilities/colors" >}}). Here we've added `.bg-primary` and `.text-white` to the `.toast`, and then added `.btn-close-white` to our close button. For a crisp edge, we remove the default border with `.border-0`.
Building on the above example, you can create different toast color schemes with our [color]({{< docsref "/utilities/colors" >}}) and [background]({{< docsref "/utilities/background" >}}). Here we've added `.bg-primary` and `.text-white` to the `.toast`, and then added `.btn-close-white` to our close button. For a crisp edge, we remove the default border with `.border-0`.
{{< example class="bg-light" >}}
<div class="toast align-items-center text-white bg-primary border-0" role="alert" aria-live="assertive" aria-atomic="true">