2
0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-05-15 11:59:39 +03:00

Add light badges from #35408

This commit is contained in:
Mark Otto
2021-11-29 16:44:25 -08:00
parent dbecbf079d
commit e521bd4473
2 changed files with 28 additions and 0 deletions
+10
View File
@@ -1,3 +1,13 @@
// Light badges
@each $color, $value in $theme-colors {
$badge-light-bg: shift-color($value, -80%);
.badge-light-#{$color} {
background-color: $badge-light-bg;
}
}
// Light buttons
@each $color, $value in $theme-colors {
$btn-light-bg: shift-color($value, -80%);
$btn-light-border: shift-color($value, -80%);
+18
View File
@@ -7,6 +7,24 @@ group: extend
## Components
### Light badges
{{< example >}}
{{< badge.inline >}}
{{- range (index $.Site.Data "theme-colors") }}
<span class="badge badge-light-{{ .name }} text-dark">{{ .name | title }}</span>{{- end -}}
{{< /badge.inline >}}
{{< /example >}}
```scss
@each $color, $value in $theme-colors {
$badge-light-bg: shift-color($value, -80%);
.badge-light-#{$color} {
background-color: $badge-light-bg;
}
}
```
### Light buttons
{{< example >}}