fix(web): promote bg-accent-tint to a real Tailwind utility
Replaces the :global scoped-style workaround in AdminSidebar with a proper accent.tint color tier in tailwind.config.js. Tailwind generates bg-accent-tint deterministically; the global class no longer leaks from a single component. Future consumers (e.g. /admin/requests tab counts) get the same utility.
This commit is contained in:
@@ -57,12 +57,3 @@
|
|||||||
</ul>
|
</ul>
|
||||||
</nav>
|
</nav>
|
||||||
</aside>
|
</aside>
|
||||||
|
|
||||||
<style>
|
|
||||||
/* "12% accent-tinted bg" — the design-system rule for active nav state.
|
|
||||||
:global is required because the class is composed inside a templated
|
|
||||||
class string the Svelte scoped-CSS pass can't see. */
|
|
||||||
:global(.bg-accent-tint) {
|
|
||||||
background: color-mix(in srgb, var(--fs-accent) 12%, transparent);
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|||||||
@@ -22,7 +22,10 @@ export default {
|
|||||||
secondary: 'var(--fs-bronze)',
|
secondary: 'var(--fs-bronze)',
|
||||||
destructive: 'var(--fs-oxblood)'
|
destructive: 'var(--fs-oxblood)'
|
||||||
},
|
},
|
||||||
accent: 'var(--fs-accent)',
|
accent: {
|
||||||
|
DEFAULT: 'var(--fs-accent)',
|
||||||
|
tint: 'color-mix(in srgb, var(--fs-accent) 12%, transparent)'
|
||||||
|
},
|
||||||
warning: 'var(--fs-warning)',
|
warning: 'var(--fs-warning)',
|
||||||
error: 'var(--fs-error)',
|
error: 'var(--fs-error)',
|
||||||
info: 'var(--fs-info)'
|
info: 'var(--fs-info)'
|
||||||
|
|||||||
Reference in New Issue
Block a user