js/webawesome
1
0
Fork 0
mirror of https://github.com/shoelace-style/webawesome.git synced 2026-01-12 04:09:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

Delete clamped-colors.njk

Browse Source 
No longer necessary
This commit is contained in:
Lea Verou
2025-02-20 14:35:49 -05:00
parent d574aef103
commit c77acdbcd5
1 changed files with 0 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
docs/docs/experimental/clamped-colors.njk
View File

@@ -1,47 +0,0 @@
---
title: Clamped brand tokens
layout: block
---
{% set tints = ['max-40', 'max-50', 'max-60', 'min-40', 'min-50', 'min-60'] %}
{% for hue in hues %}
<link href="/dist/styles/brand/{{ hue }}.css" rel="stylesheet">
{% endfor %}
<table class="colors">
<thead>
<tr>
<th></th>
<th class="core-column">Core tint</th>
{% for tint in tints -%}
<th>{{ tint }}</th>
{%- endfor %}
</tr>
</thead>
{% for hue in hues -%}
<tr class="wa-brand-{{ hue }}">
<th>{{ hue | capitalize }}</th>
<td class="core-column">
<div class="color swatch" style="background-color: var(--wa-color-brand); color: var(--wa-color-brand-on);">
{{ palettes[paletteId][hue].maxChromaTint }}
<wa-copy-button value="--wa-color-brand" copy-label="--wa-color-brand"></wa-copy-button>
</div>
</td>
{% for tint in tints -%}
<td>
<div class="color swatch" style="background-color: var(--wa-color-brand-{{ tint }})">
<wa-copy-button value="--wa-color-brand-{{ tint }}" copy-label="--wa-color-brand-{{ tint }}"></wa-copy-button>
</div>
</td>
{%- endfor -%}
</tr>
{%- endfor %}
</table>
<style>
.core-column .color.swatch::before {
counter-reset: key var(--wa-color-brand-key);
content: counter(key);
}
</style>