Add light badges from #35408

2026-06-11 18:02:28 +03:00 · 2021-11-29 16:44:25 -08:00
parent dbecbf079d
commit e521bd4473
2 changed files with 28 additions and 0 deletions
@@ -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 >}}