20 lines
809 B
TypeScript
20 lines
809 B
TypeScript
/**
|
|
* Shared class fragments for the navigation.
|
|
*
|
|
* app.css already paints a token-driven ring on every `:focus-visible`; these
|
|
* classes restate it with the same tier-2 tokens so the ring survives any local
|
|
* `outline` override and is visible in the component source.
|
|
*/
|
|
export const FOCUS_RING =
|
|
"focus-visible:outline-[color:var(--focus-ring-color)] " +
|
|
"focus-visible:outline-[length:var(--focus-ring-width)] " +
|
|
"focus-visible:outline-offset-[var(--focus-ring-offset)]";
|
|
|
|
/** Colour/opacity transitions, driven by the motion tokens. */
|
|
export const HOVER_TRANSITION =
|
|
"transition-colors duration-[var(--motion-duration-fast)] ease-[var(--motion-ease-standard)]";
|
|
|
|
export function cx(...parts: Array<string | false | null | undefined>): string {
|
|
return parts.filter(Boolean).join(" ");
|
|
}
|