@lemmo-lab/tokens 1.0.1 → 2.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/dist/css/themes/index.css +1 -1
- package/dist/css/themes/light.css +57 -190
- package/dist/css/themes/midnight.css +66 -142
- package/dist/css/themes/neon.css +63 -139
- package/dist/css/variables.css +286 -575
- package/dist/js/tokens.d.ts +1 -1
- package/dist/js/tokens.js +398 -180
- package/dist/tailwind/preset.js +13 -11
- package/package.json +1 -2
- package/dist/css/system-design/lemmo.breakpoints.css +0 -19
- package/dist/css/system-design/lemmo.colors.css +0 -196
- package/dist/css/system-design/lemmo.elevation.css +0 -23
- package/dist/css/system-design/lemmo.gradients.css +0 -62
- package/dist/css/system-design/lemmo.motion.css +0 -28
- package/dist/css/system-design/lemmo.radius.css +0 -27
- package/dist/css/system-design/lemmo.sizes.css +0 -54
- package/dist/css/system-design/lemmo.spacing.css +0 -42
- package/dist/css/system-design/lemmo.strokes.css +0 -18
- package/dist/css/system-design/lemmo.tokens.css +0 -14
- package/dist/css/system-design/lemmo.typography.css +0 -120
|
@@ -1,120 +0,0 @@
|
|
|
1
|
-
/* ------------------------------------------------------------------ */
|
|
2
|
-
/* Import webfont declarations and typography base rules */
|
|
3
|
-
/* ------------------------------------------------------------------ */
|
|
4
|
-
@import "../fonts/fonts.css";
|
|
5
|
-
|
|
6
|
-
:root {
|
|
7
|
-
/* ------------------------------------------------------------------ */
|
|
8
|
-
/* Families (Bilingual Brand Typography) */
|
|
9
|
-
/* English default: Satoshi for body/numerals, Oddval for headings */
|
|
10
|
-
/* Persian: IRANSans for body, Morabba for headings */
|
|
11
|
-
/* Numbers always render in Satoshi via tabular-nums / [data-numeric] */
|
|
12
|
-
/* ------------------------------------------------------------------ */
|
|
13
|
-
--lemmo-font-body: 'Satoshi', sans-serif;
|
|
14
|
-
--lemmo-font-heading: 'Oddval', 'Satoshi', sans-serif;
|
|
15
|
-
--lemmo-font-display: 'Oddval', 'Satoshi', sans-serif;
|
|
16
|
-
--lemmo-font-numeric: 'Satoshi', sans-serif;
|
|
17
|
-
--lemmo-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
|
|
18
|
-
|
|
19
|
-
/* Explicit per-language font tokens */
|
|
20
|
-
--lemmo-font-body-en: 'Satoshi', sans-serif;
|
|
21
|
-
--lemmo-font-heading-en: 'Oddval', 'Satoshi', sans-serif;
|
|
22
|
-
--lemmo-font-body-fa: 'IRANSans', sans-serif;
|
|
23
|
-
--lemmo-font-heading-fa: 'Morabba', sans-serif;
|
|
24
|
-
|
|
25
|
-
/* Line-height corrective factor (Persian fonts need ~10-15% more leading) */
|
|
26
|
-
--lemmo-leading-factor: 1;
|
|
27
|
-
|
|
28
|
-
/* Generic aliases matching frontend design-system */
|
|
29
|
-
--font-heading: var(--lemmo-font-heading);
|
|
30
|
-
--font-body: var(--lemmo-font-body);
|
|
31
|
-
--font-numeric: var(--lemmo-font-numeric);
|
|
32
|
-
--leading-factor: var(--lemmo-leading-factor);
|
|
33
|
-
|
|
34
|
-
/* ------------------------------------------------------------------ */
|
|
35
|
-
/* Weights */
|
|
36
|
-
/* ------------------------------------------------------------------ */
|
|
37
|
-
--lemmo-font-weight-regular: 400;
|
|
38
|
-
--lemmo-font-weight-medium: 500;
|
|
39
|
-
--lemmo-font-weight-semi-bold: 600;
|
|
40
|
-
--lemmo-font-weight-bold: 700;
|
|
41
|
-
--lemmo-font-weight-black: 900;
|
|
42
|
-
--lemmo-font-weight-cta: 510; /* Medium -> SemiBold CTA buttons */
|
|
43
|
-
|
|
44
|
-
/* ------------------------------------------------------------------ */
|
|
45
|
-
/* Type size ladder (rem) */
|
|
46
|
-
/* ------------------------------------------------------------------ */
|
|
47
|
-
--lemmo-type-size-050: .625rem; /* 10 px */
|
|
48
|
-
--lemmo-type-size-100: .75rem; /* 12 px */
|
|
49
|
-
--lemmo-type-size-200: .875rem; /* 14 px — body default */
|
|
50
|
-
--lemmo-type-size-300: 1rem; /* 16 px */
|
|
51
|
-
--lemmo-type-size-400: 1.125rem; /* 18 px */
|
|
52
|
-
--lemmo-type-size-500: 1.25rem; /* 20 px */
|
|
53
|
-
--lemmo-type-size-600: 1.5rem; /* 24 px */
|
|
54
|
-
--lemmo-type-size-700: 1.75rem; /* 28 px */
|
|
55
|
-
--lemmo-type-size-800: 2rem; /* 32 px */
|
|
56
|
-
--lemmo-type-size-900: 2.25rem; /* 36 px */
|
|
57
|
-
--lemmo-type-size-1000: 2.5rem; /* 40 px */
|
|
58
|
-
--lemmo-type-size-1100: 3rem; /* 48 px */
|
|
59
|
-
--lemmo-type-size-1200: 3.5rem; /* 56 px */
|
|
60
|
-
--lemmo-type-size-1300: 4rem; /* 64 px — hero h-xl */
|
|
61
|
-
--lemmo-type-size-1400: 4.5rem; /* 72 px */
|
|
62
|
-
|
|
63
|
-
/* ------------------------------------------------------------------ */
|
|
64
|
-
/* Line heights (absolute rem, not unitless) */
|
|
65
|
-
/* ------------------------------------------------------------------ */
|
|
66
|
-
--lemmo-type-leading-300: 1rem; /* 16 px */
|
|
67
|
-
--lemmo-type-leading-400: 1.125rem; /* 18 px */
|
|
68
|
-
--lemmo-type-leading-500: 1.25rem; /* 20 px — body default */
|
|
69
|
-
--lemmo-type-leading-600: 1.5rem; /* 24 px */
|
|
70
|
-
--lemmo-type-leading-700: 1.75rem; /* 28 px */
|
|
71
|
-
--lemmo-type-leading-800: 2rem; /* 32 px */
|
|
72
|
-
--lemmo-type-leading-900: 2.25rem; /* 36 px */
|
|
73
|
-
--lemmo-type-leading-1000: 2.5rem; /* 40 px */
|
|
74
|
-
--lemmo-type-leading-1100: 2.75rem; /* 44 px — derived */
|
|
75
|
-
--lemmo-type-leading-1200: 3rem; /* 48 px — derived */
|
|
76
|
-
--lemmo-type-leading-1300: 4rem; /* 64 px — derived */
|
|
77
|
-
--lemmo-type-leading-1400: 4.5rem; /* 72 px — derived */
|
|
78
|
-
|
|
79
|
-
/* ------------------------------------------------------------------ */
|
|
80
|
-
/* Letter spacing */
|
|
81
|
-
/* ------------------------------------------------------------------ */
|
|
82
|
-
--lemmo-type-track-none: 0;
|
|
83
|
-
--lemmo-type-track-slight: -0.025rem; /* fine label compression */
|
|
84
|
-
--lemmo-type-track-tight: -0.075rem; /* tight captions */
|
|
85
|
-
--lemmo-type-track-loose: 0.00625rem; /* body default drift */
|
|
86
|
-
--lemmo-type-track-wide: 0.0125rem; /* wide-set labels */
|
|
87
|
-
--lemmo-type-track-xxs: -0.3px; /* 10px badge/semibold */
|
|
88
|
-
--lemmo-type-track-5xl: -1.2px; /* 48px display */
|
|
89
|
-
--lemmo-type-track-heading: -2%; /* h-xl hero */
|
|
90
|
-
--lemmo-type-track-caps: -4%; /* caps-bold */
|
|
91
|
-
--lemmo-type-track-label: 0.2px; /* gloss badge text */
|
|
92
|
-
--lemmo-type-track-caption: 0.08rem; /* uppercase savings banner */
|
|
93
|
-
--lemmo-type-track-table-head: -0.56px; /* table header bold */
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
/* ------------------------------------------------------------------ */
|
|
97
|
-
/* Language rule — automatic font switching via [lang='fa'] */
|
|
98
|
-
/* ------------------------------------------------------------------ */
|
|
99
|
-
:root[lang='fa'],
|
|
100
|
-
[lang='fa'] {
|
|
101
|
-
--lemmo-font-body: var(--lemmo-font-body-fa);
|
|
102
|
-
--lemmo-font-heading: var(--lemmo-font-heading-fa);
|
|
103
|
-
--lemmo-font-display: var(--lemmo-font-heading-fa);
|
|
104
|
-
--lemmo-leading-factor: 1.15;
|
|
105
|
-
|
|
106
|
-
--font-heading: var(--lemmo-font-heading-fa);
|
|
107
|
-
--font-body: var(--lemmo-font-body-fa);
|
|
108
|
-
--leading-factor: 1.15;
|
|
109
|
-
}
|
|
110
|
-
|
|
111
|
-
/* ------------------------------------------------------------------ */
|
|
112
|
-
/* Numerals rule — numbers always render in Satoshi (LTR + isolated) */
|
|
113
|
-
/* ------------------------------------------------------------------ */
|
|
114
|
-
.tabular-nums,
|
|
115
|
-
[data-numeric] {
|
|
116
|
-
font-family: var(--lemmo-font-numeric);
|
|
117
|
-
font-feature-settings: 'tnum' 1;
|
|
118
|
-
direction: ltr;
|
|
119
|
-
unicode-bidi: isolate;
|
|
120
|
-
}
|