All files variants.ts

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
 
 
 
 
 
 
1x
 
 
 
 
 
 
 
 
 
 
1x
 
 
 
 
 
 
 
 
 
/**
 * Named Tailwind class recipes built only from Glimme tokens. UI components
 * should compose these instead of re-typing utility strings, so the design
 * language stays consistent and centrally editable.
 */
 
export const textVariants = {
  display: "font-display text-display text-text",
  title1: "font-display text-title1 text-text",
  title2: "font-display text-title2 text-text",
  title3: "font-sans text-title3 font-semibold text-text",
  body: "font-sans text-body text-text",
  bodyMuted: "font-sans text-body text-text-muted",
  callout: "font-sans text-callout text-text",
  caption: "font-sans text-caption text-text-muted",
} as const;
 
export const surfaceVariants = {
  screen: "flex-1 bg-bg",
  card: "bg-surface rounded-card p-5",
  cardMuted: "bg-surface-muted rounded-card p-5",
  pill: "rounded-pill px-4 py-2",
} as const;
 
export type TextVariant = keyof typeof textVariants;
export type SurfaceVariant = keyof typeof surfaceVariants;