colors: add text shades
All checks were successful
/ build (push) Successful in 9s

This commit is contained in:
kritzl 2025-02-17 00:56:31 +01:00
commit 82ad79d97c
Signed by: kritzl
SSH key fingerprint: SHA256:5BmINP9VjZWaUk5Z+2CTut1KFhwLtd0ZynMekKbtViM
6 changed files with 76 additions and 10 deletions

View file

@ -61,7 +61,7 @@
</section>
<section aria-labelledby="label-dark-shades">
<span id="label-dark-shades">Shades</span>
<span id="label-dark-shades">Background Shades</span>
<div aria-labelledby="label-dark-swatch-shade-1" class="swatch-container">
<div class="swatch" style="--swatch-color: var(--color-dark-shade-1)"></div>
@ -84,6 +84,30 @@
</div>
</section>
<section aria-labelledby="label-dark-texts">
<span id="label-dark-texts">Text Shades</span>
<div aria-labelledby="label-dark-swatch-text-1" class="swatch-container">
<div class="swatch" style="--swatch-color: var(--color-dark-text-1)"></div>
<span id="label-dark-swatch-text-1">#b2a0cb</span>
</div>
<div aria-labelledby="label-dark-swatch-text-2" class="swatch-container">
<div class="swatch" style="--swatch-color: var(--color-dark-text-2)"></div>
<span id="label-dark-swatch-text-2">#957eb5</span>
</div>
<div aria-labelledby="label-dark-swatch-text-3" class="swatch-container">
<div class="swatch" style="--swatch-color: var(--color-dark-text-3)"></div>
<span id="label-dark-swatch-text-3">#7a60a0</span>
</div>
<div aria-labelledby="label-dark-swatch-text-4" class="swatch-container">
<div class="swatch" style="--swatch-color: var(--color-dark-text-4)"></div>
<span id="label-dark-swatch-text-4">#61468b</span>
</div>
</section>
<section aria-labelledby="label-dark-primary-secondary">
<span id="label-dark-primary-secondary">Primary &amp; Secondary</span>
@ -150,7 +174,7 @@
</section>
<section aria-labelledby="label-light-shades">
<span id="label-light-shades">Shades</span>
<span id="label-light-shades">Background Shades</span>
<div aria-labelledby="label-light-swatch-shade-1" class="swatch-container">
<div class="swatch" style="--swatch-color: var(--color-light-shade-1)"></div>
@ -173,6 +197,30 @@
</div>
</section>
<section aria-labelledby="label-light-texts">
<span id="label-light-texts">Text Shades</span>
<div aria-labelledby="label-light-swatch-text-1" class="swatch-container">
<div class="swatch" style="--swatch-color: var(--color-light-text-1)"></div>
<span id="label-light-swatch-text-1">#26114b</span>
</div>
<div aria-labelledby="label-light-swatch-text-2" class="swatch-container">
<div class="swatch" style="--swatch-color: var(--color-light-text-2)"></div>
<span id="label-light-swatch-text-2">#371f60</span>
</div>
<div aria-labelledby="label-light-swatch-text-3" class="swatch-container">
<div class="swatch" style="--swatch-color: var(--color-light-text-3)"></div>
<span id="label-light-swatch-text-3">#4b3176</span>
</div>
<div aria-labelledby="label-light-swatch-text-4" class="swatch-container">
<div class="swatch" style="--swatch-color: var(--color-light-text-4)"></div>
<span id="label-light-swatch-text-4">#61468b</span>
</div>
</section>
<section aria-labelledby="label-light-primary-secondary">
<span id="label-light-primary-secondary">Primary &amp; Secondary</span>