mirror of
https://github.com/tenrok/bootstrap.git
synced 2026-06-14 18:42:30 +03:00
docs: fix contrast color against .bg-info (#31839)
* docs(badge): ensure info badge's contrast * docs(colors): fix contrasts in example using .bg-info * Update card.md Co-authored-by: XhmikosR <xhmikosr@gmail.com>
This commit is contained in:
@@ -45,7 +45,7 @@ Use our background utility classes to quickly change the appearance of a badge.
|
||||
{{< example >}}
|
||||
{{< badge.inline >}}
|
||||
{{- range (index $.Site.Data "theme-colors") }}
|
||||
<span class="badge bg-{{ .name }}{{ if or (eq .name "light") (eq .name "warning") }} text-dark{{ end }}">{{ .name | title }}</span>{{- end -}}
|
||||
<span class="badge bg-{{ .name }}{{ if or (eq .name "light") (eq .name "warning") (eq .name "info") }} text-dark{{ end }}">{{ .name | title }}</span>{{- end -}}
|
||||
{{< /badge.inline >}}
|
||||
{{< /example >}}
|
||||
|
||||
@@ -60,6 +60,6 @@ Use the `.rounded-pill` utility class to make badges more rounded with a larger
|
||||
{{< example >}}
|
||||
{{< badge.inline >}}
|
||||
{{- range (index $.Site.Data "theme-colors") }}
|
||||
<span class="badge rounded-pill bg-{{ .name }}{{ if or (eq .name "light") (eq .name "warning") }} text-dark{{ end }}">{{ .name | title }}</span>{{- end -}}
|
||||
<span class="badge rounded-pill bg-{{ .name }}{{ if or (eq .name "light") (eq .name "warning") (eq .name "info") }} text-dark{{ end }}">{{ .name | title }}</span>{{- end -}}
|
||||
{{< /badge.inline >}}
|
||||
{{< /example >}}
|
||||
|
||||
@@ -422,7 +422,7 @@ Use [text and background utilities]({{< docsref "/utilities/colors" >}}) to chan
|
||||
{{< example >}}
|
||||
{{< card.inline >}}
|
||||
{{- range (index $.Site.Data "theme-colors") }}
|
||||
<div class="card{{ if (eq .name "info") }} text-body {{ else if not (or (eq .name "light") (eq .name "warning")) }} text-white{{ end }} bg-{{ .name }} mb-3" style="max-width: 18rem;">
|
||||
<div class="card{{ if (eq .name "info") }} text-body{{ else if not (or (eq .name "light") (eq .name "warning") (eq .name "info")) }} text-white{{ end }} bg-{{ .name }} mb-3" style="max-width: 18rem;">
|
||||
<div class="card-header">Header</div>
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">{{ .name | title }} card title</h5>
|
||||
|
||||
Reference in New Issue
Block a user