Ilia Mashkov
8eee815e9a
Dark mode unchanged. Targets that were reported as "barely visible" in light theme: Surfaces / dividers - --color-border-subtle (light) bumped from rgb(0 0 0 / 0.05) to --neutral-300 (matches the Input underline variant's border color and yields a visible hairline on bg-surface / bg-paper). - New bg-subtle utility (same color as border-subtle but as background-color) — used by Divider component and the TypographyMenu inline column separator. Replaces ad-hoc 'bg-black/5 dark:bg-white/10' and 'bg-black/10 dark:bg-white/10' bands. - FontSearch + ComparisonView Search wrapper borders switched from hand-written 'border-swiss-black/5 dark:border-white/10' to border-subtle so they participate in the palette. Muted text - Button tertiary inactive text (light) bumped neutral-400 → neutral-600 (~2.7:1 → ~7.5:1 contrast). Covers the A/B toggle and the font-list rows in the sidebar. - Label/TechText muted variant (light) bumped neutral-400 → neutral-600. Covers the ComboControl value text. - Link text aligned to neutral-500 / neutral-400 (subtle but visible). No behavior changes; pure styling.
35 lines
930 B
TypeScript
35 lines
930 B
TypeScript
/**
|
|
* Shared config.
|
|
* Import from here in each component to keep maps DRY.
|
|
*/
|
|
|
|
export type LabelFont = 'mono' | 'primary';
|
|
|
|
export type LabelVariant =
|
|
| 'default'
|
|
| 'accent'
|
|
| 'muted'
|
|
| 'success'
|
|
| 'warning'
|
|
| 'error';
|
|
|
|
export type LabelSize = 'xs' | 'sm' | 'md' | 'lg';
|
|
|
|
export const labelSizeConfig: Record<LabelSize, string> = {
|
|
xs: 'text-4xs',
|
|
sm: 'text-3xs md:text-2xs',
|
|
md: 'text-2xs md:text-xs',
|
|
lg: 'text-sm',
|
|
};
|
|
|
|
export const labelVariantConfig: Record<LabelVariant, string> = {
|
|
default: 'text-neutral-900 dark:text-neutral-100',
|
|
accent: 'text-brand',
|
|
/* Light mode bumped from neutral-400 (~2.7:1 contrast, barely visible)
|
|
to neutral-600 (~7.5:1). Dark mode unchanged. */
|
|
muted: 'text-neutral-600 dark:text-neutral-500',
|
|
success: 'text-green-600 dark:text-green-400',
|
|
warning: 'text-yellow-600 dark:text-yellow-400',
|
|
error: 'text-brand',
|
|
};
|