@dataimago/css 0.1.0-alpha.15 → 0.1.0-alpha.18

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.
@@ -0,0 +1,321 @@
1
+ // @dataimago/css@0.1.0-alpha.18 dist/quarto/dataimago-light.scss · sha256:6e0e24eeabfc9524f0d4dfd70dcac22fb4b70b9c99d7a074d0354eca5c7d1603 · generated from tokens; do not edit · restore: npx -p @dataimago/css@0.1.0-alpha.18 dataimago-sync
2
+ // dataimago light theme for Quarto 1.8 — generated from the design tokens (tools/formats/quarto.mjs).
3
+ // Bootstrap Sass variables are compile-time sRGB; runtime colours come from the custom properties below.
4
+
5
+ /*-- scss:defaults --*/
6
+ $body-bg: #ededeb !default;
7
+ $body-color: #14140f !default;
8
+ $headings-color: #14140f !default;
9
+ $navbar-bg: #ededeb !default;
10
+ $link-color: #434739 !default;
11
+ $link-hover-color: #363a2e !default;
12
+ $code-color: #1f618d !default;
13
+ $code-bg: #faf2e3 !default;
14
+ $border-color: #888785 !default;
15
+ $font-family-sans-serif: Noto Sans, Fira Sans, system-ui, sans-serif !default;
16
+ $font-family-monospace: JetBrains Mono, SF Mono, Monaco, Inconsolata, monospace !default;
17
+ $headings-font-family: Josefin Sans, system-ui, sans-serif !default;
18
+ $headings-font-weight: 500 !default;
19
+ $h2-font-size: 1.875rem !default;
20
+
21
+ /*-- scss:rules --*/
22
+ // ── Design tokens (contract custom properties) ───────────────────────
23
+ :root {
24
+ --color-palette-ink-50: #f5f5f4;
25
+ --color-palette-ink-100: #e7e5e4;
26
+ --color-palette-ink-200: #d6d3d1;
27
+ --color-palette-ink-300: #a8a29e;
28
+ --color-palette-ink-400: #78716c;
29
+ --color-palette-ink-500: #57534e;
30
+ --color-palette-ink-600: #44403c;
31
+ --color-palette-ink-700: #292524;
32
+ --color-palette-ink-800: #1c1917;
33
+ --color-palette-ink-900: #0c0a09;
34
+ --color-palette-stone-50: #f7f7f6;
35
+ --color-palette-stone-100: #ededeb;
36
+ --color-palette-stone-200: #dcdcda;
37
+ --color-palette-stone-300: #c1c1bf;
38
+ --color-palette-stone-400: #a0a0a0;
39
+ --color-palette-stone-500: #7c7c7c;
40
+ --color-palette-stone-600: #5e5e5c;
41
+ --color-palette-stone-700: #424240;
42
+ --color-palette-stone-800: #292927;
43
+ --color-palette-stone-900: #14140f;
44
+ --color-palette-forest-50: #f0f1ed;
45
+ --color-palette-forest-100: #dde0d4;
46
+ --color-palette-forest-200: #bdc4ad;
47
+ --color-palette-forest-300: #98a384;
48
+ --color-palette-forest-400: #7e8a6b;
49
+ --color-palette-forest-500: #5e6749;
50
+ --color-palette-forest-600: #4d5640;
51
+ --color-palette-forest-700: #434739;
52
+ --color-palette-forest-800: #363a2e;
53
+ --color-palette-forest-900: #1f2218;
54
+ --color-palette-paper-50: #fefdfb;
55
+ --color-palette-paper-100: #fdf9f2;
56
+ --color-palette-paper-200: #faf2e3;
57
+ --color-palette-paper-300: #f5e8cf;
58
+ --color-palette-paper-400: #edd9b3;
59
+ --color-palette-paper-500: #e0c088;
60
+ --color-palette-copper-50: #fdf4ee;
61
+ --color-palette-copper-100: #fbe5d1;
62
+ --color-palette-copper-200: #f6c79c;
63
+ --color-palette-copper-300: #f0a467;
64
+ --color-palette-copper-400: #ea8441;
65
+ --color-palette-copper-500: #d46820;
66
+ --color-palette-copper-600: #b55017;
67
+ --color-palette-copper-700: #913d15;
68
+ --color-palette-copper-800: #753318;
69
+ --color-palette-copper-900: #612b16;
70
+ --color-palette-accent-50: #f0f8fc;
71
+ --color-palette-accent-300: #3498DB;
72
+ --color-palette-accent-400: #2980B9;
73
+ --color-palette-accent-500: #1f618d;
74
+ --color-palette-accent-600: #154d6f;
75
+ --color-palette-accent-700: #0f3a52;
76
+ --color-palette-presentation-blue-50: #f0f8fc;
77
+ --color-palette-presentation-blue-500: #3498DB;
78
+ --color-palette-presentation-blue-600: #2980B9;
79
+ --color-palette-presentation-blue-700: #1f618d;
80
+ --color-functional-success: #27AE60;
81
+ --color-functional-warning: #F39C12;
82
+ --color-functional-error: #E74C3C;
83
+ --color-functional-info: #3498DB;
84
+ --transition-quick: 0.15s ease;
85
+ --transition-standard: 0.25s ease-in-out;
86
+ --transition-smooth: 0.35s ease;
87
+ --transition-logo: 0.3s;
88
+ --font-family-sans: Noto Sans, Fira Sans, system-ui, sans-serif;
89
+ --font-family-mono: JetBrains Mono, SF Mono, Monaco, Inconsolata, monospace;
90
+ --font-family-display: var(--font-family-display-editorial);
91
+ --font-family-display-editorial: Josefin Sans, system-ui, sans-serif;
92
+ --font-family-display-documentation: Noto Sans, system-ui, sans-serif;
93
+ --font-family-brand: Futura, system-ui, sans-serif;
94
+ --font-family-math: Noto Sans Math, Noto Sans, system-ui, sans-serif;
95
+ --font-size-micro: 0.75rem;
96
+ --font-size-small: 0.875rem;
97
+ --font-size-base: 1rem;
98
+ --font-size-readable: 1.125rem;
99
+ --font-size-emphasis: 1.25rem;
100
+ --font-size-heading-small: 1.5rem;
101
+ --font-size-heading-medium: 1.875rem;
102
+ --font-size-heading-large: 2.25rem;
103
+ --font-size-heading-xl: 3rem;
104
+ --font-weight-extralight: 200;
105
+ --font-weight-light: 300;
106
+ --font-weight-normal: 400;
107
+ --font-weight-medium: 500;
108
+ --font-weight-semibold: 600;
109
+ --font-weight-bold: 700;
110
+ --font-weight-heading-h1: var(--font-weight-medium);
111
+ --font-weight-heading-h2: var(--font-weight-medium);
112
+ --font-weight-heading-h3: var(--font-weight-normal);
113
+ --font-weight-heading-h4: var(--font-weight-light);
114
+ --font-weight-heading-h5: var(--font-weight-light);
115
+ --font-weight-heading-h6: var(--font-weight-light);
116
+ --font-weight-heading-subtitle: var(--font-weight-semibold);
117
+ --font-style-normal: normal;
118
+ --font-style-italic: italic;
119
+ --font-style-oblique: oblique;
120
+ --font-lineHeight-tight: 1.25;
121
+ --font-lineHeight-normal: 1.5;
122
+ --font-lineHeight-relaxed: 1.625;
123
+ --font-feature-settings-display: "lnum";
124
+ --font-feature-settings-body: "normal";
125
+ --spacing-xs: 0.25rem;
126
+ --spacing-sm: 0.5rem;
127
+ --spacing-md: 1rem;
128
+ --spacing-lg: 1.5rem;
129
+ --spacing-xl: 2rem;
130
+ --spacing-2xl: 3rem;
131
+ --spacing-3xl: 4rem;
132
+ --radius-sm: 0.25rem;
133
+ --radius-md: 0.5rem;
134
+ --radius-lg: 0.75rem;
135
+ --radius-xl: 1rem;
136
+ --radius-full: 9999px;
137
+ --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
138
+ --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1);
139
+ --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1);
140
+ --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1);
141
+ --color-dataviz-okabe-ito-orange: #E69F00;
142
+ --color-dataviz-okabe-ito-sky-blue: #56B4E9;
143
+ --color-dataviz-okabe-ito-bluish-green: #009E73;
144
+ --color-dataviz-okabe-ito-yellow: #F0E442;
145
+ --color-dataviz-okabe-ito-blue: #0072B2;
146
+ --color-dataviz-okabe-ito-vermillion: #D55E00;
147
+ --color-dataviz-okabe-ito-reddish-purple: #CC79A7;
148
+ --color-dataviz-categorical-1: #E69F00;
149
+ --color-dataviz-categorical-2: #56B4E9;
150
+ --color-dataviz-categorical-3: #009E73;
151
+ --color-dataviz-categorical-4: #F0E442;
152
+ --color-dataviz-categorical-5: #0072B2;
153
+ --color-dataviz-categorical-6: #D55E00;
154
+ --color-dataviz-categorical-7: #CC79A7;
155
+ }
156
+
157
+ :root, [data-bs-theme="light"] {
158
+ --color-surface-page: #ededeb;
159
+ --color-surface-page: color(display-p3 0.9294 0.9294 0.9223);
160
+ --color-surface-page-scrolled: #ededeb;
161
+ --color-surface-page-scrolled: color(display-p3 0.9294 0.9294 0.9223);
162
+ --color-surface-elevated: #f7f7f6;
163
+ --color-surface-elevated: color(display-p3 0.9686 0.9686 0.9651);
164
+ --color-surface-sunken: #faf2e3;
165
+ --color-surface-sunken: color(display-p3 0.9749 0.9501 0.8963);
166
+ --color-surface-navbar: #ededeb;
167
+ --color-surface-navbar: color(display-p3 0.9294 0.9294 0.9223);
168
+ --color-surface-navbar-scrolled: #ededeb;
169
+ --color-surface-navbar-scrolled: color(display-p3 0.9294 0.9294 0.9223);
170
+ --color-surface-code: #faf2e3;
171
+ --color-surface-code: color(display-p3 0.9749 0.9501 0.8963);
172
+ --color-border-subtle: rgba(12, 10, 9, 0.45);
173
+ --color-border-subtle: color(display-p3 0.0457 0.0395 0.0358 / 0.45);
174
+ --color-border-moderate: rgba(12, 10, 9, 0.60);
175
+ --color-border-moderate: color(display-p3 0.0457 0.0395 0.0358 / 0.60);
176
+ --color-border-strong: rgba(12, 10, 9, 0.75);
177
+ --color-border-strong: color(display-p3 0.0457 0.0395 0.0358 / 0.75);
178
+ --color-border-card: rgba(12, 10, 9, 0.60);
179
+ --color-border-card: color(display-p3 0.0457 0.0395 0.0358 / 0.60);
180
+ --color-border-code: #d6d3d1;
181
+ --color-border-code: color(display-p3 0.8371 0.8278 0.8205);
182
+ --color-content-primary: #14140f;
183
+ --color-content-primary: color(display-p3 0.0784 0.0784 0.0608);
184
+ --color-content-secondary: #6a6a6a;
185
+ --color-content-secondary: color(display-p3 0.4157 0.4157 0.4157);
186
+ --color-content-muted: #706964;
187
+ --color-content-muted: color(display-p3 0.4345 0.4127 0.3945);
188
+ --color-content-inverse: #fdf9f2;
189
+ --color-content-inverse: color(display-p3 0.9894 0.977 0.9518);
190
+ --color-interactive-primary: #434739;
191
+ --color-interactive-primary: color(display-p3 0.2656 0.2779 0.2287);
192
+ --color-interactive-hover: #363a2e;
193
+ --color-interactive-hover: color(display-p3 0.2146 0.2269 0.1848);
194
+ --color-interactive-accent: #1f618d;
195
+ --color-interactive-accent: color(display-p3 0.198 0.375 0.5385);
196
+ --color-interactive-focus: #434739;
197
+ --color-interactive-focus: color(display-p3 0.2656 0.2779 0.2287);
198
+ --color-presentation-accent: #3498db;
199
+ --color-presentation-accent: color(display-p3 0.3208 0.588 0.8369);
200
+ --color-presentation-accent-hover: #2980b9;
201
+ --color-presentation-accent-hover: color(display-p3 0.2638 0.495 0.7068);
202
+ --color-vertical-accent-dissertation: #b87333;
203
+ --color-vertical-accent-dissertation: color(display-p3 0.7242 0.4389 0.1259);
204
+ --color-vertical-accent-rpkg: #3b82f6;
205
+ --color-vertical-accent-rpkg: color(display-p3 0.3047 0.5035 0.9338);
206
+ --color-vertical-accent-SGPc: #5a6310;
207
+ --color-vertical-accent-SGPc: color(display-p3 0.3595 0.3871 0.1309);
208
+ --color-brand-mark-red: #cc0000;
209
+ --color-brand-mark-red: color(display-p3 0.7331 0.1519 0.1019);
210
+ --contrast-high: rgb(20, 20, 16);
211
+ --contrast-readable: rgb(20, 20, 16);
212
+ --contrast-medium: #7c7c7c;
213
+ --contrast-subtle: #7c7c7c;
214
+ --shadow-subtle: 0 1px 2px 0 rgb(20 20 16 / 0.05);
215
+ --shadow-moderate: 0 4px 6px -1px rgb(20 20 16 / 0.1);
216
+ --shadow-prominent: 0 10px 15px -3px rgb(20 20 16 / 0.1);
217
+ --border-subtle: rgba(20, 20, 16, 0.47);
218
+ --border-moderate: rgba(20, 20, 16, 0.63);
219
+ --border-focus: #3498DB;
220
+ --navigation-hover-background: rgba(20, 20, 16, 0.05);
221
+ --navigation-active-background: rgba(20, 20, 16, 0.1);
222
+ --color-dataviz-okabe-ito-black: #000000;
223
+ --color-dataviz-categorical-8: #000000;
224
+ --color-dataviz-uncertainty-outer: #D6D6D6;
225
+ --color-dataviz-uncertainty-union: #9E9E9E;
226
+ --color-dataviz-uncertainty-inner: #333333;
227
+ }
228
+
229
+ // ── Quarto chrome → tokens ──────────────────────────────────────────────
230
+ body {
231
+ background-color: var(--color-surface-page);
232
+ color: var(--color-content-primary);
233
+ }
234
+
235
+ h1, h2, h3, h4, h5, h6, .title {
236
+ color: var(--color-content-primary);
237
+ }
238
+
239
+ // Links in running text are underlined: interactive.primary is about 1.9:1
240
+ // against body text in light mode, so colour cannot be the only cue (WCAG 1.4.1).
241
+ main.content :is(p, li, dd, td, blockquote, figcaption, .callout-body) a {
242
+ color: var(--color-interactive-primary);
243
+ text-decoration: underline;
244
+ text-underline-offset: 0.15em;
245
+ }
246
+
247
+ main.content :is(p, li, dd, td, blockquote, figcaption, .callout-body) a:hover {
248
+ color: var(--color-interactive-hover);
249
+ }
250
+
251
+ // Navigation and the outline stay plain.
252
+ #TOC a, nav a, .sidebar a, .navbar a, a.footnote-ref, a.anchorjs-link {
253
+ text-decoration: none;
254
+ }
255
+
256
+ :not(pre) > code {
257
+ color: var(--color-interactive-accent);
258
+ background-color: var(--color-surface-code);
259
+ }
260
+
261
+ pre, div.sourceCode {
262
+ background-color: var(--color-surface-code);
263
+ border: 1px solid var(--color-border-code);
264
+ }
265
+
266
+ // Quarto themes its popups as [data-theme~="quarto"] at compile time ($body-bg);
267
+ // match that specificity so the runtime token wins.
268
+ .tippy-box, .tippy-box[data-theme~="quarto"] {
269
+ background-color: var(--color-surface-elevated);
270
+ color: var(--color-content-primary);
271
+ border: 1px solid var(--color-border-subtle);
272
+ }
273
+
274
+ .tippy-box[data-theme~="quarto"] > .tippy-backdrop {
275
+ background-color: var(--color-surface-elevated);
276
+ }
277
+
278
+ .callout {
279
+ background-color: var(--color-surface-elevated);
280
+ border-color: var(--color-border-subtle);
281
+ }
282
+
283
+ .column-margin, .margin-aside, figcaption {
284
+ color: var(--color-content-secondary);
285
+ }
286
+
287
+ // Elevated cards carry an edge: in dark mode surface.elevated is about 1.06:1
288
+ // against surface.page, so a card without one disappears.
289
+ .di-elevated, div.abstract {
290
+ background-color: var(--color-surface-elevated);
291
+ border: 1px solid var(--color-border-subtle);
292
+ border-radius: var(--radius-md);
293
+ padding: var(--spacing-md);
294
+ }
295
+
296
+ // ===== THEME TOGGLE STYLING =====
297
+ // Light theme - show moon icon (switch to dark)
298
+
299
+ .quarto-color-scheme-toggle .bi::before {
300
+ display: inline-block !important;
301
+ height: 1rem !important;
302
+ width: 1rem !important;
303
+ content: "" !important;
304
+ vertical-align: -0.125em !important;
305
+ background-repeat: no-repeat !important;
306
+ background-size: 1rem 1rem !important;
307
+ background-color: transparent !important;
308
+ background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="%2383838F" class="bi bi-moon" viewBox="0 0 16 16"><path d="M6 .278a.768.768 0 0 1 .08.858 7.208 7.208 0 0 0-.878 3.46c0 4.021 3.278 7.277 7.318 7.277.527 0 1.04-.055 1.533-.16a.787.787 0 0 1 .81.316.733.733 0 0 1-.031.893A8.349 8.349 0 0 1 8.344 16C3.734 16 0 12.286 0 7.71 0 4.266 2.114 1.312 5.124.06A.752.752 0 0 1 6 .278z"/></svg>') !important;
309
+ transition: background-image 0.25s ease;
310
+ }
311
+
312
+ .quarto-color-scheme-toggle:hover .bi::before {
313
+ background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="%23000000" class="bi bi-moon" viewBox="0 0 16 16"><path d="M6 .278a.768.768 0 0 1 .08.858 7.208 7.208 0 0 0-.878 3.46c0 4.021 3.278 7.277 7.318 7.277.527 0 1.04-.055 1.533-.16a.787.787 0 0 1 .81.316.733.733 0 0 1-.031.893A8.349 8.349 0 0 1 8.344 16C3.734 16 0 12.286 0 7.71 0 4.266 2.114 1.312 5.124.06A.752.752 0 0 1 6 .278z"/></svg>') !important;
314
+ transition: background-image 0.25s ease;
315
+ }
316
+
317
+ @media (prefers-reduced-motion: reduce) {
318
+ .quarto-color-scheme-toggle .bi::before {
319
+ transition: none !important;
320
+ }
321
+ }
package/dist/tokens.css CHANGED
@@ -116,6 +116,20 @@
116
116
  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1);
117
117
  --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1);
118
118
  --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1);
119
+ --color-dataviz-okabe-ito-orange: #E69F00;
120
+ --color-dataviz-okabe-ito-sky-blue: #56B4E9;
121
+ --color-dataviz-okabe-ito-bluish-green: #009E73;
122
+ --color-dataviz-okabe-ito-yellow: #F0E442;
123
+ --color-dataviz-okabe-ito-blue: #0072B2;
124
+ --color-dataviz-okabe-ito-vermillion: #D55E00;
125
+ --color-dataviz-okabe-ito-reddish-purple: #CC79A7;
126
+ --color-dataviz-categorical-1: #E69F00;
127
+ --color-dataviz-categorical-2: #56B4E9;
128
+ --color-dataviz-categorical-3: #009E73;
129
+ --color-dataviz-categorical-4: #F0E442;
130
+ --color-dataviz-categorical-5: #0072B2;
131
+ --color-dataviz-categorical-6: #D55E00;
132
+ --color-dataviz-categorical-7: #CC79A7;
119
133
  }
120
134
 
121
135
  :root, [data-bs-theme="light"] {
@@ -183,6 +197,11 @@
183
197
  --border-focus: #3498DB;
184
198
  --navigation-hover-background: rgba(20, 20, 16, 0.05);
185
199
  --navigation-active-background: rgba(20, 20, 16, 0.1);
200
+ --color-dataviz-okabe-ito-black: #000000;
201
+ --color-dataviz-categorical-8: #000000;
202
+ --color-dataviz-uncertainty-outer: #D6D6D6;
203
+ --color-dataviz-uncertainty-union: #9E9E9E;
204
+ --color-dataviz-uncertainty-inner: #333333;
186
205
  }
187
206
 
188
207
  [data-bs-theme="dark"] {
@@ -250,10 +269,15 @@
250
269
  --border-focus: #4FC3F7;
251
270
  --navigation-hover-background: rgba(237, 237, 235, 0.05);
252
271
  --navigation-active-background: rgba(237, 237, 235, 0.1);
272
+ --color-dataviz-okabe-ito-black: #FDF9F2;
273
+ --color-dataviz-categorical-8: #FDF9F2;
274
+ --color-dataviz-uncertainty-outer: #333333;
275
+ --color-dataviz-uncertainty-union: #6B6B6B;
276
+ --color-dataviz-uncertainty-inner: #D6D6D6;
253
277
  }
254
278
 
255
279
  @media (prefers-color-scheme: dark) {
256
- :root {
280
+ :root:where(:not([data-bs-theme="light"])) {
257
281
  --color-surface-page: #141410;
258
282
  --color-surface-page: color(display-p3 0.0784 0.0784 0.0643);
259
283
  --color-surface-page-scrolled: #141410;
@@ -318,5 +342,10 @@
318
342
  --border-focus: #4FC3F7;
319
343
  --navigation-hover-background: rgba(237, 237, 235, 0.05);
320
344
  --navigation-active-background: rgba(237, 237, 235, 0.1);
345
+ --color-dataviz-okabe-ito-black: #FDF9F2;
346
+ --color-dataviz-categorical-8: #FDF9F2;
347
+ --color-dataviz-uncertainty-outer: #333333;
348
+ --color-dataviz-uncertainty-union: #6B6B6B;
349
+ --color-dataviz-uncertainty-inner: #D6D6D6;
321
350
  }
322
351
  }
package/dist/tokens.scss CHANGED
@@ -116,6 +116,20 @@
116
116
  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1);
117
117
  --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1);
118
118
  --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1);
119
+ --color-dataviz-okabe-ito-orange: #E69F00;
120
+ --color-dataviz-okabe-ito-sky-blue: #56B4E9;
121
+ --color-dataviz-okabe-ito-bluish-green: #009E73;
122
+ --color-dataviz-okabe-ito-yellow: #F0E442;
123
+ --color-dataviz-okabe-ito-blue: #0072B2;
124
+ --color-dataviz-okabe-ito-vermillion: #D55E00;
125
+ --color-dataviz-okabe-ito-reddish-purple: #CC79A7;
126
+ --color-dataviz-categorical-1: #E69F00;
127
+ --color-dataviz-categorical-2: #56B4E9;
128
+ --color-dataviz-categorical-3: #009E73;
129
+ --color-dataviz-categorical-4: #F0E442;
130
+ --color-dataviz-categorical-5: #0072B2;
131
+ --color-dataviz-categorical-6: #D55E00;
132
+ --color-dataviz-categorical-7: #CC79A7;
119
133
  }
120
134
 
121
135
  :root, [data-bs-theme="light"] {
@@ -183,6 +197,11 @@
183
197
  --border-focus: #3498DB;
184
198
  --navigation-hover-background: rgba(20, 20, 16, 0.05);
185
199
  --navigation-active-background: rgba(20, 20, 16, 0.1);
200
+ --color-dataviz-okabe-ito-black: #000000;
201
+ --color-dataviz-categorical-8: #000000;
202
+ --color-dataviz-uncertainty-outer: #D6D6D6;
203
+ --color-dataviz-uncertainty-union: #9E9E9E;
204
+ --color-dataviz-uncertainty-inner: #333333;
186
205
  }
187
206
 
188
207
  [data-bs-theme="dark"] {
@@ -250,10 +269,15 @@
250
269
  --border-focus: #4FC3F7;
251
270
  --navigation-hover-background: rgba(237, 237, 235, 0.05);
252
271
  --navigation-active-background: rgba(237, 237, 235, 0.1);
272
+ --color-dataviz-okabe-ito-black: #FDF9F2;
273
+ --color-dataviz-categorical-8: #FDF9F2;
274
+ --color-dataviz-uncertainty-outer: #333333;
275
+ --color-dataviz-uncertainty-union: #6B6B6B;
276
+ --color-dataviz-uncertainty-inner: #D6D6D6;
253
277
  }
254
278
 
255
279
  @media (prefers-color-scheme: dark) {
256
- :root {
280
+ :root:where(:not([data-bs-theme="light"])) {
257
281
  --color-surface-page: #141410;
258
282
  --color-surface-page: color(display-p3 0.0784 0.0784 0.0643);
259
283
  --color-surface-page-scrolled: #141410;
@@ -318,5 +342,10 @@
318
342
  --border-focus: #4FC3F7;
319
343
  --navigation-hover-background: rgba(237, 237, 235, 0.05);
320
344
  --navigation-active-background: rgba(237, 237, 235, 0.1);
345
+ --color-dataviz-okabe-ito-black: #FDF9F2;
346
+ --color-dataviz-categorical-8: #FDF9F2;
347
+ --color-dataviz-uncertainty-outer: #333333;
348
+ --color-dataviz-uncertainty-union: #6B6B6B;
349
+ --color-dataviz-uncertainty-inner: #D6D6D6;
321
350
  }
322
351
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dataimago/css",
3
- "version": "0.1.0-alpha.15",
3
+ "version": "0.1.0-alpha.18",
4
4
  "description": "Compiled CSS and Tailwind preset for the dataimago ethical AI design system",
5
5
  "license": "MIT",
6
6
  "repository": {
@@ -18,14 +18,21 @@
18
18
  "./dataimago.min.css": "./dist/dataimago.min.css",
19
19
  "./tokens.css": "./dist/tokens.css",
20
20
  "./tailwind-preset": "./dist/tailwind-preset.js",
21
+ "./quarto/*": "./dist/quarto/*",
22
+ "./latex/*": "./dist/latex/*",
23
+ "./dataviz/*": "./dist/dataviz/*",
24
+ "./outputs.json": "./dist/outputs.json",
21
25
  "./package.json": "./package.json"
22
26
  },
27
+ "bin": {
28
+ "dataimago-sync": "./dist/bin/dataimago-sync.mjs"
29
+ },
23
30
  "files": [
24
31
  "dist",
25
32
  "README.md"
26
33
  ],
27
34
  "dependencies": {
28
- "@dataimago/tokens": "^0.1.0-alpha.15"
35
+ "@dataimago/tokens": "^0.1.0-alpha.18"
29
36
  },
30
37
  "devDependencies": {
31
38
  "sass": "^1.69.0"