@publier/shell 0.3.0 → 0.4.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.
Files changed (18) hide show
  1. package/dist/presets-BHvXbtBH.mjs +1 -0
  2. package/dist/{presets-PH6ZjfE7.d.mts → presets-Cl3HtWjB.d.mts} +1 -1
  3. package/dist/tailwind/index.d.mts +1 -1
  4. package/dist/tailwind/index.mjs +1 -1
  5. package/dist/tailwind/loader.d.mts +1 -1
  6. package/dist/tailwind/loader.mjs +1 -1
  7. package/dist/themes/atrium.css +223 -0
  8. package/dist/themes/broadsheet.css +223 -0
  9. package/dist/themes/canopy.css +223 -0
  10. package/dist/themes/folio.css +227 -0
  11. package/dist/themes/lattice.css +220 -0
  12. package/dist/themes/marigold.css +223 -0
  13. package/dist/themes/meridian.css +224 -0
  14. package/dist/themes/monolith.css +223 -0
  15. package/dist/themes/nocturne.css +223 -0
  16. package/dist/themes/prism.css +225 -0
  17. package/package.json +2 -2
  18. package/dist/presets-D_MQnAtK.mjs +0 -1
package/dist/themes/marigold.css ADDED
@@ -0,0 +1,223 @@
1
+ :root, [data-theme="light"] {
2
+ color-scheme: light;
3
+
4
+ --color-base-100: #f6eedd;
5
+ --color-base-200: #ede2cb;
6
+ --color-base-300: #cdbb96;
7
+ --color-base-content: #2a2218;
8
+ --color-primary: #f7c243;
9
+ --color-primary-content: #2a2218;
10
+ --color-secondary: #4a3f2e;
11
+ --color-secondary-content: #f6eedd;
12
+ --color-accent: #f7c243;
13
+ --color-accent-content: #2a2218;
14
+ --color-neutral: #2a2218;
15
+ --color-neutral-content: #f6eedd;
16
+ --color-error: #b3261e;
17
+ --color-error-content: #f6eedd;
18
+
19
+ --radius-selector: 9999px;
20
+ --radius-field: 12px;
21
+ --radius-box: 16px;
22
+ --border: 2px;
23
+ --depth: 0;
24
+ --noise: 0;
25
+ }
26
+
27
+ [data-theme="dark"] {
28
+ color-scheme: dark;
29
+
30
+ --color-base-100: #1f1a13;
31
+ --color-base-200: #2a241b;
32
+ --color-base-300: #3d3426;
33
+ --color-base-content: #f5eddc;
34
+ --color-primary: #f7cb58;
35
+ --color-primary-content: #1f1a13;
36
+ --color-secondary: #bcae92;
37
+ --color-secondary-content: #1f1a13;
38
+ --color-accent: #f7cb58;
39
+ --color-accent-content: #1f1a13;
40
+ --color-neutral: #f5eddc;
41
+ --color-neutral-content: #1f1a13;
42
+ --color-error: #f2796e;
43
+ --color-error-content: #1f1a13;
44
+
45
+ --radius-selector: 9999px;
46
+ --radius-field: 12px;
47
+ --radius-box: 16px;
48
+ --border: 2px;
49
+ --depth: 0;
50
+ --noise: 0;
51
+ }
52
+
53
+ @media (prefers-color-scheme: dark) {
54
+ :root:not([data-theme]) {
55
+ color-scheme: dark;
56
+
57
+ --color-base-100: #1f1a13;
58
+ --color-base-200: #2a241b;
59
+ --color-base-300: #3d3426;
60
+ --color-base-content: #f5eddc;
61
+ --color-primary: #f7cb58;
62
+ --color-primary-content: #1f1a13;
63
+ --color-secondary: #bcae92;
64
+ --color-secondary-content: #1f1a13;
65
+ --color-accent: #f7cb58;
66
+ --color-accent-content: #1f1a13;
67
+ --color-neutral: #f5eddc;
68
+ --color-neutral-content: #1f1a13;
69
+ --color-error: #f2796e;
70
+ --color-error-content: #1f1a13;
71
+
72
+ --radius-selector: 9999px;
73
+ --radius-field: 12px;
74
+ --radius-box: 16px;
75
+ --border: 2px;
76
+ --depth: 0;
77
+ --noise: 0;
78
+ }
79
+ }
80
+
81
+ :root {
82
+
83
+ --publier-scale-display-xl-size: 4rem;
84
+ --publier-scale-display-xl-weight: 800;
85
+ --publier-scale-display-xl-line-height: 1.05;
86
+ --publier-scale-display-xl-tracking: -0.03em;
87
+ --publier-scale-display-lg-size: 3rem;
88
+ --publier-scale-display-lg-weight: 800;
89
+ --publier-scale-display-lg-line-height: 1.1;
90
+ --publier-scale-display-lg-tracking: -0.025em;
91
+ --publier-scale-display-md-size: 2.25rem;
92
+ --publier-scale-display-md-weight: 700;
93
+ --publier-scale-display-md-line-height: 1.15;
94
+ --publier-scale-display-md-tracking: -0.02em;
95
+ --publier-scale-heading-lg-size: 1.75rem;
96
+ --publier-scale-heading-lg-weight: 700;
97
+ --publier-scale-heading-lg-line-height: 1.25;
98
+ --publier-scale-heading-lg-tracking: -0.01em;
99
+ --publier-scale-heading-md-size: 1.375rem;
100
+ --publier-scale-heading-md-weight: 700;
101
+ --publier-scale-heading-md-line-height: 1.3;
102
+ --publier-scale-heading-md-tracking: 0;
103
+ --publier-scale-heading-sm-size: 1.125rem;
104
+ --publier-scale-heading-sm-weight: 700;
105
+ --publier-scale-heading-sm-line-height: 1.35;
106
+ --publier-scale-heading-sm-tracking: 0;
107
+ --publier-scale-title-size: 1rem;
108
+ --publier-scale-title-weight: 700;
109
+ --publier-scale-title-line-height: 1.4;
110
+ --publier-scale-title-tracking: 0;
111
+ --publier-scale-body-lg-size: 1.125rem;
112
+ --publier-scale-body-lg-weight: 400;
113
+ --publier-scale-body-lg-line-height: 1.6;
114
+ --publier-scale-body-lg-tracking: 0;
115
+ --publier-scale-body-md-size: 1rem;
116
+ --publier-scale-body-md-weight: 400;
117
+ --publier-scale-body-md-line-height: 1.5;
118
+ --publier-scale-body-md-tracking: 0;
119
+ --publier-scale-body-sm-size: 0.875rem;
120
+ --publier-scale-body-sm-weight: 400;
121
+ --publier-scale-body-sm-line-height: 1.45;
122
+ --publier-scale-body-sm-tracking: 0;
123
+ --publier-scale-caption-size: 0.8125rem;
124
+ --publier-scale-caption-weight: 500;
125
+ --publier-scale-caption-line-height: 1.4;
126
+ --publier-scale-caption-tracking: 0;
127
+ --publier-scale-label-size: 0.875rem;
128
+ --publier-scale-label-weight: 600;
129
+ --publier-scale-label-line-height: 1.3;
130
+ --publier-scale-label-tracking: 0;
131
+ --publier-scale-button-size: 0.9375rem;
132
+ --publier-scale-button-weight: 700;
133
+ --publier-scale-button-line-height: 1.2;
134
+ --publier-scale-button-tracking: 0;
135
+ --publier-scale-code-size: 0.875rem;
136
+ --publier-scale-code-weight: 400;
137
+ --publier-scale-code-line-height: 1.6;
138
+ --publier-scale-code-tracking: 0;
139
+
140
+ --publier-font-weight-body: 400;
141
+ --publier-font-weight-heading: 700;
142
+
143
+ --publier-space-xxs: 0.125rem;
144
+ --publier-space-xs: 0.25rem;
145
+ --publier-space-sm: 0.5rem;
146
+ --publier-space-md: 0.75rem;
147
+ --publier-space-base: 1rem;
148
+ --publier-space-lg: 1.5rem;
149
+ --publier-space-xl: 2rem;
150
+ --publier-space-xxl: 3rem;
151
+ --publier-space-section: 4.5rem;
152
+
153
+ --publier-radius-button: 12px;
154
+ --publier-radius-control: 12px;
155
+ --publier-radius-card: 16px;
156
+ --publier-radius-panel: 24px;
157
+ --publier-radius-chip: 9999px;
158
+ --publier-control-radius: 12px;
159
+ --publier-surface-radius: 16px;
160
+ --publier-card-radius: 16px;
161
+ --publier-nav-item-radius: 12px;
162
+ --publier-code-block-radius: 12px;
163
+ --publier-code-inline-radius: 6px;
164
+
165
+ --publier-elevation-flat: none;
166
+ --publier-elevation-raised: 0 0 0 2px #2a2218, 0 4px 0 0 #2a2218;
167
+ --publier-elevation-overlay: 0 0 0 2px #2a2218, 0 6px 0 0 #2a2218;
168
+
169
+ --publier-motion-duration-fast: 120ms;
170
+ --publier-motion-duration-base: 180ms;
171
+ --publier-motion-duration-slow: 280ms;
172
+ --publier-motion-easing: cubic-bezier(0.34, 1.4, 0.64, 1);
173
+
174
+ --publier-nav-height: 4rem;
175
+ --publier-page-max-width: 47.5rem;
176
+ --publier-layout-width: 1240px;
177
+ --publier-shadow-color: 42 34 24;
178
+ }
179
+
180
+ :root,
181
+ :root[data-theme="light"] {
182
+ --color-pl-muted: #675a44;
183
+ --color-pl-muted-bg: #e4d6ba;
184
+ --color-pl-subtle: #675a44;
185
+ --color-pl-card: #fffaef;
186
+ --color-pl-card-hover: #fffaef;
187
+ --color-pl-popover: #fffaef;
188
+ --color-pl-border: #cdbb96;
189
+ --color-pl-border-strong: #2a2218;
190
+ --color-pl-ring: #2a2218;
191
+ --color-pl-sidebar-accent: #ede2cb;
192
+ --color-pl-sidebar-active: #fdedc9;
193
+ --color-pl-sidebar-active-fg: #2a2218;
194
+
195
+ --menu-active-bg: var(--color-pl-sidebar-active);
196
+ --menu-active-color: var(--color-pl-sidebar-active-fg);
197
+ --menu-hover-bg: var(--color-pl-sidebar-accent);
198
+ --menu-hover-color: var(--color-pl-sidebar-accent-fg);
199
+ }
200
+
201
+ :root[data-theme="dark"],
202
+ .dark {
203
+ --color-pl-muted: #bcae92;
204
+ --color-pl-muted-bg: #2a241b;
205
+ --color-pl-subtle: #bcae92;
206
+ --color-pl-card: #2a241b;
207
+ --color-pl-card-hover: #2a241b;
208
+ --color-pl-popover: #2a241b;
209
+ --color-pl-border: #3d3426;
210
+ --color-pl-border-strong: #5a4d38;
211
+ --color-pl-ring: #f5eddc;
212
+ --color-pl-sidebar-accent: #2a241b;
213
+ --color-pl-sidebar-active: color-mix(in oklch, #f7cb58 16%, transparent);
214
+ --color-pl-sidebar-active-fg: #f7cb58;
215
+
216
+ --publier-elevation-raised: 0 0 0 2px #5a4d38, 0 4px 0 0 #5a4d38;
217
+ --publier-elevation-overlay: 0 0 0 2px #5a4d38, 0 6px 0 0 #5a4d38;
218
+
219
+ --menu-active-bg: var(--color-pl-sidebar-active);
220
+ --menu-active-color: var(--color-pl-sidebar-active-fg);
221
+ --menu-hover-bg: var(--color-pl-sidebar-accent);
222
+ --menu-hover-color: var(--color-pl-sidebar-accent-fg);
223
+ }
package/dist/themes/meridian.css ADDED
@@ -0,0 +1,224 @@
1
+ :root, [data-theme="light"] {
2
+ color-scheme: light;
3
+
4
+ --color-base-100: #ffffff;
5
+ --color-base-200: #f6f9fc;
6
+ --color-base-300: #eef2f6;
7
+ --color-base-content: #0d253d;
8
+ --color-primary: #6636d1;
9
+ --color-primary-content: #ffffff;
10
+ --color-secondary: #273951;
11
+ --color-secondary-content: #ffffff;
12
+ --color-accent: #6636d1;
13
+ --color-accent-content: #ffffff;
14
+ --color-neutral: #0d253d;
15
+ --color-neutral-content: #ffffff;
16
+ --color-error: #c62828;
17
+ --color-error-content: #ffffff;
18
+
19
+ --radius-selector: 9999px;
20
+ --radius-field: 6px;
21
+ --radius-box: 12px;
22
+ --border: 1px;
23
+ --depth: 0;
24
+ --noise: 0;
25
+ }
26
+
27
+ [data-theme="dark"] {
28
+ color-scheme: dark;
29
+
30
+ --color-base-100: #0b1220;
31
+ --color-base-200: #131b2d;
32
+ --color-base-300: #22304a;
33
+ --color-base-content: #e6edf5;
34
+ --color-primary: #bdadff;
35
+ --color-primary-content: #0b1220;
36
+ --color-secondary: #9aa8bd;
37
+ --color-secondary-content: #0b1220;
38
+ --color-accent: #bdadff;
39
+ --color-accent-content: #0b1220;
40
+ --color-neutral: #e6edf5;
41
+ --color-neutral-content: #0b1220;
42
+ --color-error: #f87171;
43
+ --color-error-content: #0b1220;
44
+
45
+ --radius-selector: 9999px;
46
+ --radius-field: 6px;
47
+ --radius-box: 12px;
48
+ --border: 1px;
49
+ --depth: 0;
50
+ --noise: 0;
51
+ }
52
+
53
+ @media (prefers-color-scheme: dark) {
54
+ :root:not([data-theme]) {
55
+ color-scheme: dark;
56
+
57
+ --color-base-100: #0b1220;
58
+ --color-base-200: #131b2d;
59
+ --color-base-300: #22304a;
60
+ --color-base-content: #e6edf5;
61
+ --color-primary: #bdadff;
62
+ --color-primary-content: #0b1220;
63
+ --color-secondary: #9aa8bd;
64
+ --color-secondary-content: #0b1220;
65
+ --color-accent: #bdadff;
66
+ --color-accent-content: #0b1220;
67
+ --color-neutral: #e6edf5;
68
+ --color-neutral-content: #0b1220;
69
+ --color-error: #f87171;
70
+ --color-error-content: #0b1220;
71
+
72
+ --radius-selector: 9999px;
73
+ --radius-field: 6px;
74
+ --radius-box: 12px;
75
+ --border: 1px;
76
+ --depth: 0;
77
+ --noise: 0;
78
+ }
79
+ }
80
+
81
+ :root {
82
+
83
+ --publier-scale-display-xl-size: 3.5rem;
84
+ --publier-scale-display-xl-weight: 300;
85
+ --publier-scale-display-xl-line-height: 1.03;
86
+ --publier-scale-display-xl-tracking: -1.4px;
87
+ --publier-scale-display-lg-size: 2.75rem;
88
+ --publier-scale-display-lg-weight: 300;
89
+ --publier-scale-display-lg-line-height: 1.08;
90
+ --publier-scale-display-lg-tracking: -0.9px;
91
+ --publier-scale-display-md-size: 2rem;
92
+ --publier-scale-display-md-weight: 300;
93
+ --publier-scale-display-md-line-height: 1.12;
94
+ --publier-scale-display-md-tracking: -0.5px;
95
+ --publier-scale-heading-lg-size: 1.5rem;
96
+ --publier-scale-heading-lg-weight: 400;
97
+ --publier-scale-heading-lg-line-height: 1.2;
98
+ --publier-scale-heading-lg-tracking: -0.3px;
99
+ --publier-scale-heading-md-size: 1.25rem;
100
+ --publier-scale-heading-md-weight: 400;
101
+ --publier-scale-heading-md-line-height: 1.3;
102
+ --publier-scale-heading-md-tracking: -0.2px;
103
+ --publier-scale-heading-sm-size: 1.125rem;
104
+ --publier-scale-heading-sm-weight: 500;
105
+ --publier-scale-heading-sm-line-height: 1.35;
106
+ --publier-scale-heading-sm-tracking: -0.1px;
107
+ --publier-scale-title-size: 1rem;
108
+ --publier-scale-title-weight: 500;
109
+ --publier-scale-title-line-height: 1.4;
110
+ --publier-scale-title-tracking: 0;
111
+ --publier-scale-body-lg-size: 1.125rem;
112
+ --publier-scale-body-lg-weight: 300;
113
+ --publier-scale-body-lg-line-height: 1.55;
114
+ --publier-scale-body-lg-tracking: 0;
115
+ --publier-scale-body-md-size: 1rem;
116
+ --publier-scale-body-md-weight: 400;
117
+ --publier-scale-body-md-line-height: 1.5;
118
+ --publier-scale-body-md-tracking: 0;
119
+ --publier-scale-body-sm-size: 0.875rem;
120
+ --publier-scale-body-sm-weight: 400;
121
+ --publier-scale-body-sm-line-height: 1.43;
122
+ --publier-scale-body-sm-tracking: 0;
123
+ --publier-scale-caption-size: 0.8125rem;
124
+ --publier-scale-caption-weight: 400;
125
+ --publier-scale-caption-line-height: 1.4;
126
+ --publier-scale-caption-tracking: 0;
127
+ --publier-scale-label-size: 0.875rem;
128
+ --publier-scale-label-weight: 500;
129
+ --publier-scale-label-line-height: 1.29;
130
+ --publier-scale-label-tracking: 0;
131
+ --publier-scale-button-size: 0.9375rem;
132
+ --publier-scale-button-weight: 500;
133
+ --publier-scale-button-line-height: 1.2;
134
+ --publier-scale-button-tracking: 0;
135
+ --publier-scale-code-size: 0.875rem;
136
+ --publier-scale-code-weight: 400;
137
+ --publier-scale-code-line-height: 1.6;
138
+ --publier-scale-code-tracking: 0;
139
+
140
+ --publier-font-weight-body: 400;
141
+ --publier-font-weight-heading: 400;
142
+
143
+ --publier-space-xxs: 0.125rem;
144
+ --publier-space-xs: 0.25rem;
145
+ --publier-space-sm: 0.5rem;
146
+ --publier-space-md: 0.75rem;
147
+ --publier-space-base: 1rem;
148
+ --publier-space-lg: 1.5rem;
149
+ --publier-space-xl: 2rem;
150
+ --publier-space-xxl: 3rem;
151
+ --publier-space-section: 4rem;
152
+
153
+ --publier-radius-button: 9999px;
154
+ --publier-radius-control: 6px;
155
+ --publier-radius-card: 12px;
156
+ --publier-radius-panel: 16px;
157
+ --publier-radius-chip: 9999px;
158
+ --publier-control-radius: 6px;
159
+ --publier-surface-radius: 12px;
160
+ --publier-card-radius: 12px;
161
+ --publier-nav-item-radius: 6px;
162
+ --publier-code-block-radius: 6px;
163
+ --publier-code-inline-radius: 4px;
164
+
165
+ --publier-elevation-flat: none;
166
+ --publier-elevation-raised: 0 1px 2px rgb(13 37 61 / 0.04), 0 6px 16px -4px rgb(13 37 61 / 0.08);
167
+ --publier-elevation-overlay:
168
+ 0 2px 4px rgb(13 37 61 / 0.05), 0 16px 32px -8px rgb(13 37 61 / 0.14);
169
+
170
+ --publier-motion-duration-fast: 120ms;
171
+ --publier-motion-duration-base: 180ms;
172
+ --publier-motion-duration-slow: 280ms;
173
+ --publier-motion-easing: cubic-bezier(0.2, 0, 0, 1);
174
+
175
+ --publier-nav-height: 4.5rem;
176
+ --publier-page-max-width: 45rem;
177
+ --publier-layout-width: 1200px;
178
+ --publier-shadow-color: 13 37 61;
179
+ }
180
+
181
+ :root,
182
+ :root[data-theme="light"] {
183
+ --color-pl-muted: #5b6b82;
184
+ --color-pl-muted-bg: #eef2f7;
185
+ --color-pl-subtle: #5b6b82;
186
+ --color-pl-card: #ffffff;
187
+ --color-pl-card-hover: #ffffff;
188
+ --color-pl-popover: #ffffff;
189
+ --color-pl-border: #e3e8ee;
190
+ --color-pl-border-strong: #c4cfdc;
191
+ --color-pl-ring: #6636d1;
192
+ --color-pl-sidebar-accent: #f6f9fc;
193
+ --color-pl-sidebar-active: #f4f3ff;
194
+ --color-pl-sidebar-active-fg: #6636d1;
195
+
196
+ --menu-active-bg: var(--color-pl-sidebar-active);
197
+ --menu-active-color: var(--color-pl-sidebar-active-fg);
198
+ --menu-hover-bg: var(--color-pl-sidebar-accent);
199
+ --menu-hover-color: var(--color-pl-sidebar-accent-fg);
200
+ }
201
+
202
+ :root[data-theme="dark"],
203
+ .dark {
204
+ --color-pl-muted: #9aa8bd;
205
+ --color-pl-muted-bg: #131b2d;
206
+ --color-pl-subtle: #9aa8bd;
207
+ --color-pl-card: #131b2d;
208
+ --color-pl-card-hover: #131b2d;
209
+ --color-pl-popover: #131b2d;
210
+ --color-pl-border: #22304a;
211
+ --color-pl-border-strong: #33425f;
212
+ --color-pl-ring: #bdadff;
213
+ --color-pl-sidebar-accent: #131b2d;
214
+ --color-pl-sidebar-active: color-mix(in oklch, #bdadff 16%, transparent);
215
+ --color-pl-sidebar-active-fg: #bdadff;
216
+
217
+ --publier-elevation-raised: 0 0 0 1px #22304a, 0 6px 16px -4px rgb(0 0 0 / 0.4);
218
+ --publier-elevation-overlay: 0 0 0 1px #22304a, 0 16px 32px -8px rgb(0 0 0 / 0.5);
219
+
220
+ --menu-active-bg: var(--color-pl-sidebar-active);
221
+ --menu-active-color: var(--color-pl-sidebar-active-fg);
222
+ --menu-hover-bg: var(--color-pl-sidebar-accent);
223
+ --menu-hover-color: var(--color-pl-sidebar-accent-fg);
224
+ }
package/dist/themes/monolith.css ADDED
@@ -0,0 +1,223 @@
1
+ :root, [data-theme="light"] {
2
+ color-scheme: light;
3
+
4
+ --color-base-100: #ffffff;
5
+ --color-base-200: #fafafa;
6
+ --color-base-300: #ebebeb;
7
+ --color-base-content: #171717;
8
+ --color-primary: #171717;
9
+ --color-primary-content: #ffffff;
10
+ --color-secondary: #4d4d4d;
11
+ --color-secondary-content: #ffffff;
12
+ --color-accent: #171717;
13
+ --color-accent-content: #ffffff;
14
+ --color-neutral: #171717;
15
+ --color-neutral-content: #ffffff;
16
+ --color-error: #c50000;
17
+ --color-error-content: #ffffff;
18
+
19
+ --radius-selector: 0px;
20
+ --radius-field: 0px;
21
+ --radius-box: 0px;
22
+ --border: 1px;
23
+ --depth: 0;
24
+ --noise: 0;
25
+ }
26
+
27
+ [data-theme="dark"] {
28
+ color-scheme: dark;
29
+
30
+ --color-base-100: #0a0a0a;
31
+ --color-base-200: #161616;
32
+ --color-base-300: #2e2e2e;
33
+ --color-base-content: #ededed;
34
+ --color-primary: #ededed;
35
+ --color-primary-content: #0a0a0a;
36
+ --color-secondary: #a1a1a1;
37
+ --color-secondary-content: #0a0a0a;
38
+ --color-accent: #ededed;
39
+ --color-accent-content: #0a0a0a;
40
+ --color-neutral: #ededed;
41
+ --color-neutral-content: #0a0a0a;
42
+ --color-error: #ff5b4f;
43
+ --color-error-content: #0a0a0a;
44
+
45
+ --radius-selector: 0px;
46
+ --radius-field: 0px;
47
+ --radius-box: 0px;
48
+ --border: 1px;
49
+ --depth: 0;
50
+ --noise: 0;
51
+ }
52
+
53
+ @media (prefers-color-scheme: dark) {
54
+ :root:not([data-theme]) {
55
+ color-scheme: dark;
56
+
57
+ --color-base-100: #0a0a0a;
58
+ --color-base-200: #161616;
59
+ --color-base-300: #2e2e2e;
60
+ --color-base-content: #ededed;
61
+ --color-primary: #ededed;
62
+ --color-primary-content: #0a0a0a;
63
+ --color-secondary: #a1a1a1;
64
+ --color-secondary-content: #0a0a0a;
65
+ --color-accent: #ededed;
66
+ --color-accent-content: #0a0a0a;
67
+ --color-neutral: #ededed;
68
+ --color-neutral-content: #0a0a0a;
69
+ --color-error: #ff5b4f;
70
+ --color-error-content: #0a0a0a;
71
+
72
+ --radius-selector: 0px;
73
+ --radius-field: 0px;
74
+ --radius-box: 0px;
75
+ --border: 1px;
76
+ --depth: 0;
77
+ --noise: 0;
78
+ }
79
+ }
80
+
81
+ :root {
82
+
83
+ --publier-scale-display-xl-size: 3.5rem;
84
+ --publier-scale-display-xl-weight: 600;
85
+ --publier-scale-display-xl-line-height: 1.05;
86
+ --publier-scale-display-xl-tracking: -0.03em;
87
+ --publier-scale-display-lg-size: 2.75rem;
88
+ --publier-scale-display-lg-weight: 600;
89
+ --publier-scale-display-lg-line-height: 1.08;
90
+ --publier-scale-display-lg-tracking: -0.03em;
91
+ --publier-scale-display-md-size: 2rem;
92
+ --publier-scale-display-md-weight: 600;
93
+ --publier-scale-display-md-line-height: 1.15;
94
+ --publier-scale-display-md-tracking: -0.02em;
95
+ --publier-scale-heading-lg-size: 1.75rem;
96
+ --publier-scale-heading-lg-weight: 600;
97
+ --publier-scale-heading-lg-line-height: 1.2;
98
+ --publier-scale-heading-lg-tracking: -0.02em;
99
+ --publier-scale-heading-md-size: 1.375rem;
100
+ --publier-scale-heading-md-weight: 600;
101
+ --publier-scale-heading-md-line-height: 1.25;
102
+ --publier-scale-heading-md-tracking: -0.01em;
103
+ --publier-scale-heading-sm-size: 1.125rem;
104
+ --publier-scale-heading-sm-weight: 600;
105
+ --publier-scale-heading-sm-line-height: 1.3;
106
+ --publier-scale-heading-sm-tracking: -0.01em;
107
+ --publier-scale-title-size: 1rem;
108
+ --publier-scale-title-weight: 600;
109
+ --publier-scale-title-line-height: 1.4;
110
+ --publier-scale-title-tracking: -0.01em;
111
+ --publier-scale-body-lg-size: 1.125rem;
112
+ --publier-scale-body-lg-weight: 400;
113
+ --publier-scale-body-lg-line-height: 1.55;
114
+ --publier-scale-body-lg-tracking: 0;
115
+ --publier-scale-body-md-size: 1rem;
116
+ --publier-scale-body-md-weight: 400;
117
+ --publier-scale-body-md-line-height: 1.5;
118
+ --publier-scale-body-md-tracking: 0;
119
+ --publier-scale-body-sm-size: 0.875rem;
120
+ --publier-scale-body-sm-weight: 400;
121
+ --publier-scale-body-sm-line-height: 1.43;
122
+ --publier-scale-body-sm-tracking: -0.01em;
123
+ --publier-scale-caption-size: 0.75rem;
124
+ --publier-scale-caption-weight: 400;
125
+ --publier-scale-caption-line-height: 1.33;
126
+ --publier-scale-caption-tracking: 0;
127
+ --publier-scale-label-size: 0.8125rem;
128
+ --publier-scale-label-weight: 500;
129
+ --publier-scale-label-line-height: 1.3;
130
+ --publier-scale-label-tracking: 0;
131
+ --publier-scale-button-size: 0.875rem;
132
+ --publier-scale-button-weight: 500;
133
+ --publier-scale-button-line-height: 1.3;
134
+ --publier-scale-button-tracking: 0;
135
+ --publier-scale-code-size: 0.8125rem;
136
+ --publier-scale-code-weight: 400;
137
+ --publier-scale-code-line-height: 1.6;
138
+ --publier-scale-code-tracking: 0;
139
+
140
+ --publier-font-weight-body: 400;
141
+ --publier-font-weight-heading: 600;
142
+
143
+ --publier-space-xxs: 0.125rem;
144
+ --publier-space-xs: 0.25rem;
145
+ --publier-space-sm: 0.5rem;
146
+ --publier-space-md: 0.75rem;
147
+ --publier-space-base: 1rem;
148
+ --publier-space-lg: 1.5rem;
149
+ --publier-space-xl: 2rem;
150
+ --publier-space-xxl: 3rem;
151
+ --publier-space-section: 6rem;
152
+
153
+ --publier-radius-button: 0px;
154
+ --publier-radius-control: 0px;
155
+ --publier-radius-card: 0px;
156
+ --publier-radius-panel: 0px;
157
+ --publier-radius-chip: 0px;
158
+ --publier-control-radius: 0px;
159
+ --publier-surface-radius: 0px;
160
+ --publier-card-radius: 0px;
161
+ --publier-nav-item-radius: 0px;
162
+ --publier-code-block-radius: 0px;
163
+ --publier-code-inline-radius: 0px;
164
+
165
+ --publier-elevation-flat: none;
166
+ --publier-elevation-raised: 0 0 0 1px #ebebeb;
167
+ --publier-elevation-overlay: 0 1px 0 0 rgb(0 0 0 / 0.06), 0 8px 24px rgb(0 0 0 / 0.08);
168
+
169
+ --publier-motion-duration-fast: 100ms;
170
+ --publier-motion-duration-base: 150ms;
171
+ --publier-motion-duration-slow: 200ms;
172
+ --publier-motion-easing: cubic-bezier(0.2, 0, 0, 1);
173
+
174
+ --publier-nav-height: 4rem;
175
+ --publier-page-max-width: 45rem;
176
+ --publier-layout-width: 1200px;
177
+ --publier-shadow-color: 0 0 0;
178
+ }
179
+
180
+ :root,
181
+ :root[data-theme="light"] {
182
+ --color-pl-muted: #666666;
183
+ --color-pl-muted-bg: #f5f5f5;
184
+ --color-pl-subtle: #666666;
185
+ --color-pl-card: #ffffff;
186
+ --color-pl-card-hover: #ffffff;
187
+ --color-pl-popover: #ffffff;
188
+ --color-pl-border: #ebebeb;
189
+ --color-pl-border-strong: #a1a1a1;
190
+ --color-pl-ring: #171717;
191
+ --color-pl-sidebar-accent: #fafafa;
192
+ --color-pl-sidebar-active: #f2f2f2;
193
+ --color-pl-sidebar-active-fg: #171717;
194
+
195
+ --menu-active-bg: var(--color-pl-sidebar-active);
196
+ --menu-active-color: var(--color-pl-sidebar-active-fg);
197
+ --menu-hover-bg: var(--color-pl-sidebar-accent);
198
+ --menu-hover-color: var(--color-pl-sidebar-accent-fg);
199
+ }
200
+
201
+ :root[data-theme="dark"],
202
+ .dark {
203
+ --color-pl-muted: #a1a1a1;
204
+ --color-pl-muted-bg: #1f1f1f;
205
+ --color-pl-subtle: #a1a1a1;
206
+ --color-pl-card: #161616;
207
+ --color-pl-card-hover: #161616;
208
+ --color-pl-popover: #161616;
209
+ --color-pl-border: #2e2e2e;
210
+ --color-pl-border-strong: #4a4a4a;
211
+ --color-pl-ring: #ededed;
212
+ --color-pl-sidebar-accent: #161616;
213
+ --color-pl-sidebar-active: #1f1f1f;
214
+ --color-pl-sidebar-active-fg: #ededed;
215
+
216
+ --publier-elevation-raised: 0 0 0 1px #2e2e2e;
217
+ --publier-elevation-overlay: 0 0 0 1px #2e2e2e, 0 8px 24px rgb(0 0 0 / 0.5);
218
+
219
+ --menu-active-bg: var(--color-pl-sidebar-active);
220
+ --menu-active-color: var(--color-pl-sidebar-active-fg);
221
+ --menu-hover-bg: var(--color-pl-sidebar-accent);
222
+ --menu-hover-color: var(--color-pl-sidebar-accent-fg);
223
+ }