Marcel Raddatz
f2071ca5d8
Adds --color-ring-today, --color-ring-selected, --opacity-dimmed, 9 protein gradient tokens and 5 cuisine gradient tokens as @theme custom properties, integrating into the existing token layer. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
78 lines
1.6 KiB
TypeScript
78 lines
1.6 KiB
TypeScript
import { describe, it, expect } from 'vitest';
|
|
import { readFileSync } from 'node:fs';
|
|
import { resolve } from 'node:path';
|
|
|
|
const css = readFileSync(resolve(__dirname, '../../app.css'), 'utf-8');
|
|
|
|
const requiredTokens = [
|
|
// Fonts
|
|
'--font-display',
|
|
'--font-sans',
|
|
'--font-mono',
|
|
// Neutrals
|
|
'--color-page',
|
|
'--color-surface',
|
|
'--color-subtle',
|
|
'--color-border',
|
|
'--color-text',
|
|
'--color-text-muted',
|
|
// Green scale
|
|
'--green-tint',
|
|
'--green-light',
|
|
'--green',
|
|
'--green-dark',
|
|
'--green-deeper',
|
|
// Yellow scale
|
|
'--yellow-tint',
|
|
'--yellow-light',
|
|
'--yellow',
|
|
'--yellow-dark',
|
|
'--yellow-text',
|
|
// Status
|
|
'--color-error',
|
|
// Spacing
|
|
'--space-1',
|
|
'--space-4',
|
|
'--space-8',
|
|
'--space-12',
|
|
'--space-16',
|
|
'--space-20',
|
|
// Radii
|
|
'--radius-xs',
|
|
'--radius-sm',
|
|
'--radius-md',
|
|
'--radius-lg',
|
|
'--radius-xl',
|
|
'--radius-full',
|
|
// Shadows
|
|
'--shadow-card',
|
|
'--shadow-raised',
|
|
'--shadow-overlay',
|
|
// Planner flip-tile semantic tokens
|
|
'--color-ring-today',
|
|
'--color-ring-selected',
|
|
'--opacity-dimmed',
|
|
// Protein gradient tokens
|
|
'--gradient-protein-haehnchen',
|
|
'--gradient-protein-rind',
|
|
'--gradient-protein-fisch',
|
|
'--gradient-protein-tofu',
|
|
'--gradient-protein-veg',
|
|
'--gradient-protein-schwein',
|
|
'--gradient-protein-lamm',
|
|
'--gradient-protein-ei',
|
|
'--gradient-protein-huelsenfruechte',
|
|
// Cuisine gradient tokens
|
|
'--gradient-cuisine-italienisch',
|
|
'--gradient-cuisine-asiatisch',
|
|
'--gradient-cuisine-indisch',
|
|
'--gradient-cuisine-mexikanisch',
|
|
'--gradient-cuisine-mediterran'
|
|
];
|
|
|
|
describe('design token completeness', () => {
|
|
it.each(requiredTokens)('%s is defined in app.css', (token) => {
|
|
expect(css).toContain(token);
|
|
});
|
|
});
|