@webority/theme 0.99.0 → 0.100.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 +9 -9
- package/dist/published-theme.json +8 -31
- package/dist/purge-safelist.json +1 -0
- package/dist/webority-theme.css +1 -1
- package/index.scss +4 -3
- package/package.json +6 -3
- package/scss/_bootstrap.generated.scss +18 -0
- package/scss/_components.scss +38 -38
- package/scss/_marketing.scss +8 -8
- package/scss/_tokens.generated.scss +831 -0
- package/scss/_tokens.scss +4 -638
- package/scss/_variables.scss +7 -12
- package/scss/_wui-components.scss +1 -1
- package/scss/_wui-residual.scss +8 -0
- package/scss/wui/_avatar-picker.scss +2 -2
- package/scss/wui/_calendar.scss +6 -6
- package/scss/wui/_card.scss +1 -1
- package/scss/wui/_carousel.scss +2 -2
- package/scss/wui/_chart-card.scss +2 -2
- package/scss/wui/_chart.scss +8 -8
- package/scss/wui/_chat.scss +2 -2
- package/scss/wui/_choice.scss +78 -78
- package/scss/wui/_code-block.scss +2 -2
- package/scss/wui/_command-palette.scss +9 -9
- package/scss/wui/_comment-thread.scss +5 -5
- package/scss/wui/_consent-banner.scss +2 -2
- package/scss/wui/_controls.scss +52 -52
- package/scss/wui/_data.scss +38 -38
- package/scss/wui/_disclosure.scss +6 -6
- package/scss/wui/_display.scss +51 -51
- package/scss/wui/_dock.scss +4 -4
- package/scss/wui/_drawer.scss +3 -3
- package/scss/wui/_file-viewer.scss +2 -2
- package/scss/wui/_filter-popover.scss +1 -1
- package/scss/wui/_floating.scss +1 -1
- package/scss/wui/_flow.scss +60 -60
- package/scss/wui/_groups.scss +7 -7
- package/scss/wui/_hover-card.scss +1 -1
- package/scss/wui/_image-crop.scss +3 -3
- package/scss/wui/_interaction.scss +3 -3
- package/scss/wui/_kanban.scss +4 -4
- package/scss/wui/_lightbox.scss +2 -2
- package/scss/wui/_media.scss +28 -28
- package/scss/wui/_mention-input.scss +4 -4
- package/scss/wui/_menu-motion.scss +1 -1
- package/scss/wui/_modal-remote.scss +2 -2
- package/scss/wui/_navigation-menu.scss +4 -4
- package/scss/wui/_navigation.scss +25 -25
- package/scss/wui/_notification-center.scss +4 -4
- package/scss/wui/_onboarding-checklist.scss +2 -2
- package/scss/wui/_overlays.scss +21 -21
- package/scss/wui/_pending.scss +1 -1
- package/scss/wui/_rich-text.scss +7 -7
- package/scss/wui/_rolling-number.scss +1 -1
- package/scss/wui/_score-scale.scss +1 -1
- package/scss/wui/_sections.scss +8 -8
- package/scss/wui/_shell-parts.scss +15 -15
- package/scss/wui/_shell.scss +20 -20
- package/scss/wui/_shortcuts.scss +1 -1
- package/scss/wui/_sortable.scss +2 -2
- package/scss/wui/_split-view.scss +4 -4
- package/scss/wui/_theme-toggle.scss +1 -1
- package/scss/wui/_tone-pill.scss +2 -2
- package/scss/wui/_toolbar.scss +2 -2
- package/scss/wui/_tree.scss +3 -3
- package/scss/wui/_typography.scss +6 -6
- package/scss/wui/_utilities.scss +27 -19
- package/scss/wui/_whats-new.scss +4 -4
- package/scss/wui/_workspace.scss +16 -16
- package/scss/wui/tour/_advance.scss +1 -1
- package/scss/wui/tour/_base.scss +1 -1
- package/scss/wui/tour/_end.scss +1 -1
- package/scss/wui/tour/_motion.scss +1 -1
- package/token-meanings.json +56 -64
- package/scss/_wui-aliases.scss +0 -495
package/README.md
CHANGED
|
@@ -18,8 +18,7 @@ load-bearing**:
|
|
|
18
18
|
@import "your-brand/variables"; // your $primary, fonts, etc.
|
|
19
19
|
@import "@webority/theme/scss/variables"; // library defaults (yours win)
|
|
20
20
|
@import "bootstrap/scss/bootstrap";
|
|
21
|
-
@import "@webority/theme/scss/tokens"; // --wui-* tokens
|
|
22
|
-
@import "@webority/theme/scss/wui-aliases"; // --color-* / --radius-* aliases
|
|
21
|
+
@import "@webority/theme/scss/tokens"; // --wui-* and --color-* tokens
|
|
23
22
|
@import "@webority/theme/scss/components"; // portal / control chrome
|
|
24
23
|
@import "@webority/theme/scss/wui-components";
|
|
25
24
|
// Optional — marketing sites only (heroes, section-y, pill CTAs, reveal motion):
|
|
@@ -28,8 +27,9 @@ load-bearing**:
|
|
|
28
27
|
// @import "@webority/theme/scss/flags";
|
|
29
28
|
```
|
|
30
29
|
|
|
31
|
-
Importing part of the core chain is a bug: skipping `
|
|
32
|
-
`--
|
|
30
|
+
Importing part of the core chain is a bug: skipping `tokens` leaves every
|
|
31
|
+
`--wui-*` reference unresolved. The names are the 0.89.0 names only; a pre-0.89.0 name is gone and
|
|
32
|
+
`webority upgrade 0.89.0 --path <folder>` moves a product onto the new ones.
|
|
33
33
|
|
|
34
34
|
### Country flags are opt-in
|
|
35
35
|
|
|
@@ -135,8 +135,8 @@ focusable child. The purge safelist keeps these three classes.
|
|
|
135
135
|
## Token meanings
|
|
136
136
|
|
|
137
137
|
`@webority/theme/token-meanings.json` maps each published `--wui-*` and `--color-*` token to one sentence saying
|
|
138
|
-
what it is for. The sentence is the
|
|
139
|
-
|
|
138
|
+
what it is for. The sentence is the token's description in `packages/tokens/src/source/meaning.tokens.json`, and the
|
|
139
|
+
file carries the same sentence under the token's name; the Canvas theme
|
|
140
140
|
export fails when a published token has no entry there.
|
|
141
141
|
|
|
142
142
|
## Dark mode
|
|
@@ -167,7 +167,7 @@ resolved theme to `data-bs-theme` and keeps it in step when the device changes.
|
|
|
167
167
|
|
|
168
168
|
### Implementation
|
|
169
169
|
|
|
170
|
-
Both patterns use the same
|
|
170
|
+
Both patterns use the same dark-token block (generated into `scss/_tokens.generated.scss`),
|
|
171
171
|
so the compiled dark CSS is byte-identical whether toggled manually or via system preference.
|
|
172
172
|
|
|
173
173
|
Token remap includes:
|
|
@@ -233,12 +233,12 @@ Three layers. Do not collapse product art direction into the shared package.
|
|
|
233
233
|
|
|
234
234
|
Anti-over-correction checklist. When thinning the package (e.g. marketing extract), **keep**:
|
|
235
235
|
|
|
236
|
-
### Tokens & system (`scss/_variables`, `_tokens`, `_wui-
|
|
236
|
+
### Tokens & system (`scss/_variables`, `_tokens`, generated `_tokens.generated` and `_bootstrap.generated`, `_wui-residual`)
|
|
237
237
|
|
|
238
238
|
- Theme colors + `wui-brand-primary`; body/text/surface/border ramps
|
|
239
239
|
- Radius ladder that differs from Bootstrap; spacer map extensions (6+)
|
|
240
240
|
- Status ramps: fills **and** `-text` / danger-strong
|
|
241
|
-
- Control heights (`--wui-control-
|
|
241
|
+
- Control heights (`--wui-control-sm|md|lg`: sm 32, md 36, lg 44; md is 44 on phone-width and touch screens) and one disabled opacity (`--wui-disabled-opacity`); flat in-page elevation; overlay shadows only
|
|
242
242
|
- Z-index scale (`--wui-z-*`); dark-mode `--bs-*` / RGB bridges
|
|
243
243
|
- Focus: no input glow (`$input-focus-box-shadow: none`); fields keep a soft brand border and also draw the shared keyboard ring
|
|
244
244
|
|
|
@@ -64,10 +64,6 @@
|
|
|
64
64
|
"light": "#e34948",
|
|
65
65
|
"dark": "#e66767"
|
|
66
66
|
},
|
|
67
|
-
"chart-axis": {
|
|
68
|
-
"light": "#C4CADA",
|
|
69
|
-
"dark": "#3a414f"
|
|
70
|
-
},
|
|
71
67
|
"chart-diverging-high": {
|
|
72
68
|
"light": "#2a78d6",
|
|
73
69
|
"dark": "#3987e5"
|
|
@@ -80,14 +76,6 @@
|
|
|
80
76
|
"light": "#c4cada",
|
|
81
77
|
"dark": "#3a414f"
|
|
82
78
|
},
|
|
83
|
-
"chart-grid": {
|
|
84
|
-
"light": "#EBEDF3",
|
|
85
|
-
"dark": "#2a2f3a"
|
|
86
|
-
},
|
|
87
|
-
"chart-label": {
|
|
88
|
-
"light": "#626A82",
|
|
89
|
-
"dark": "#8a90a0"
|
|
90
|
-
},
|
|
91
79
|
"chart-neutral": {
|
|
92
80
|
"light": "#99a1b7",
|
|
93
81
|
"dark": "#5d6475"
|
|
@@ -273,8 +261,8 @@
|
|
|
273
261
|
"dark": "#6366F1"
|
|
274
262
|
},
|
|
275
263
|
"primary-ink": {
|
|
276
|
-
"light": "#
|
|
277
|
-
"dark": "#
|
|
264
|
+
"light": "#4F46E5",
|
|
265
|
+
"dark": "#4F46E5"
|
|
278
266
|
},
|
|
279
267
|
"primary-pressed": {
|
|
280
268
|
"light": "#4338CA",
|
|
@@ -432,18 +420,16 @@
|
|
|
432
420
|
"radius": {
|
|
433
421
|
"lg": 14,
|
|
434
422
|
"md": 10,
|
|
423
|
+
"none": 0,
|
|
435
424
|
"pill": 9999,
|
|
436
425
|
"sm": 8,
|
|
437
426
|
"xl": 16
|
|
438
427
|
},
|
|
439
428
|
"shadow": {
|
|
440
429
|
"card": "none",
|
|
441
|
-
"
|
|
442
|
-
"
|
|
443
|
-
"
|
|
444
|
-
"overlay-lg": "0 24px 60px -16px rgba(7, 20, 55, 0.28)",
|
|
445
|
-
"thumb": "0 2px 6px rgba(0, 0, 0, 0.1)",
|
|
446
|
-
"thumb-hover": "0 2px 12px rgba(0, 0, 0, 0.2)"
|
|
430
|
+
"drawer": "0px 24px 60px -16px rgba(7, 20, 55, 0.28)",
|
|
431
|
+
"modal": "0px 24px 60px -16px rgba(7, 20, 55, 0.28)",
|
|
432
|
+
"popover": "0px 8px 28px -6px rgba(7, 20, 55, 0.14)"
|
|
447
433
|
},
|
|
448
434
|
"font": {
|
|
449
435
|
"sans": {
|
|
@@ -452,11 +438,11 @@
|
|
|
452
438
|
},
|
|
453
439
|
"display": {
|
|
454
440
|
"family": "Webority Serif",
|
|
455
|
-
"fallback": "Cambria, Georgia, Times New Roman, Noto Serif, serif"
|
|
441
|
+
"fallback": "Cambria, Georgia, \"Times New Roman\", \"Noto Serif\", serif"
|
|
456
442
|
},
|
|
457
443
|
"body": {
|
|
458
444
|
"family": "Webority Sans",
|
|
459
|
-
"fallback": "Inter, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif"
|
|
445
|
+
"fallback": "Inter, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif"
|
|
460
446
|
},
|
|
461
447
|
"mono": {
|
|
462
448
|
"family": "JetBrains Mono",
|
|
@@ -464,12 +450,6 @@
|
|
|
464
450
|
}
|
|
465
451
|
},
|
|
466
452
|
"text": {
|
|
467
|
-
"48": {
|
|
468
|
-
"size": 48
|
|
469
|
-
},
|
|
470
|
-
"64": {
|
|
471
|
-
"size": 64
|
|
472
|
-
},
|
|
473
453
|
"2xl": {
|
|
474
454
|
"size": 32
|
|
475
455
|
},
|
|
@@ -500,9 +480,6 @@
|
|
|
500
480
|
"sm": {
|
|
501
481
|
"size": 14
|
|
502
482
|
},
|
|
503
|
-
"smb": {
|
|
504
|
-
"size": 15
|
|
505
|
-
},
|
|
506
483
|
"xl": {
|
|
507
484
|
"size": 24
|
|
508
485
|
},
|