38 lines
1.6 KiB
TypeScript
38 lines
1.6 KiB
TypeScript
/// <reference types="node" />
|
|
import { readFileSync } from 'node:fs'
|
|
import { describe, expect, it } from 'vitest'
|
|
import { themes } from '../../../src/design/theme'
|
|
|
|
const css = readFileSync('src/styles.css', 'utf8')
|
|
const guidelines = readFileSync('docs/ui-design.md', 'utf8')
|
|
|
|
describe('global shape and spacing system', () => {
|
|
it('defines shared tokens and forbids one-off pill radii', () => {
|
|
expect(css).toContain('--radius-control: 8px')
|
|
expect(css).toContain('--radius-surface: 16px')
|
|
expect(css).toContain('--space-card: 24px')
|
|
expect(css).toContain('--space-section: 24px')
|
|
expect(css).not.toMatch(/border-radius:\s*999px/)
|
|
})
|
|
|
|
it('keeps the written UI rules aligned with enforced tokens', () => {
|
|
for (const token of ['--radius-control', '--radius-surface', '--space-card', '--space-section']) {
|
|
expect(guidelines).toContain(token)
|
|
}
|
|
expect(guidelines).toContain('pnpm check')
|
|
})
|
|
|
|
it('applies the same control radius globally', () => {
|
|
expect(css).toMatch(/\.ant-tag[^}]+border-radius:\s*var\(--radius-control\)/)
|
|
expect(themes.blue.token?.borderRadius).toBe(8)
|
|
expect(themes.light.token?.borderRadius).toBe(8)
|
|
})
|
|
|
|
it('gives result content consistent breathing room', () => {
|
|
expect(css).toMatch(/\.result-card\s*>\s*\.ant-card-body[^}]+gap:\s*var\(--space-section\)/)
|
|
expect(css).toMatch(/\.result-columns[^}]+gap:\s*var\(--space-section\)/)
|
|
expect(css).toMatch(/\.result-columns section[^}]+padding:\s*var\(--space-card\)/)
|
|
expect(css).toMatch(/\.result-verdict\s*\{[^}]*padding:\s*0 7px !important/)
|
|
})
|
|
})
|