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

Contrast colors added to theme-colors (#30044)

Browse Source 
* Contrast colors added to theme-colors

* redundant colors removed froms docs, theme-colors refactor

* Add spaces for consistency

* Adapt to the recent changes

Co-authored-by: Sead Memic <sead.memic@intracto.com>
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
This commit is contained in:
Sead Memic
2020-10-31 07:21:31 +01:00
committed by GitHub
parent 241f910dc5
commit 9cedf5b81e
5 changed files with 11 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
site/content/docs/5.0/components/badge.md
+2 -2
View File
@@ -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") (eq .name "info") }} text-dark{{ end }}">{{ .name | title }}</span>{{- end -}}
<span class="badge bg-{{ .name }}{{ with .contrast_color }} text-{{ . }}{{ 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") (eq .name "info") }} text-dark{{ end }}">{{ .name | title }}</span>{{- end -}}
<span class="badge rounded-pill bg-{{ .name }}{{ with .contrast_color }} text-{{ . }}{{ end }}">{{ .name | title }}</span>{{- end -}}
{{< /badge.inline >}}
{{< /example >}}
site/content/docs/5.0/components/card.md
+2 -2
View File
@@ -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") (eq .name "info")) }} text-white{{ end }} bg-{{ .name }} mb-3" style="max-width: 18rem;">
<div class="card{{ if .contrast_color }} text-{{ .contrast_color }}{{ else }} 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>
@@ -446,7 +446,7 @@ Use [border utilities]({{< docsref "/utilities/borders" >}}) to change just the
{{- range (index $.Site.Data "theme-colors") }}
<div class="card border-{{ .name }} mb-3" style="max-width: 18rem;">
<div class="card-header">Header</div>
<div class="card-body{{ if not (or (eq .name "light") (eq .name "warning") (eq .name "info")) }} text-{{ .name }}{{ end }}">
<div class="card-body{{ if not .contrast_color }} text-{{ .name }}{{ end }}">
<h5 class="card-title">{{ .name | title }} card title</h5>
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
</div>