@welcome-back/brand 0.7.1 → 0.7.3
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 +3 -2
- package/dist/cjs/posTokens.js +4 -3
- package/dist/esm/posTokens.d.ts +1 -1
- package/dist/esm/posTokens.js +4 -3
- package/dist/pos-tokens.css +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -338,8 +338,9 @@ colours, slot for slot, and passes the same contrast test on the dark card.
|
|
|
338
338
|
Square tiles show white text on a photo or on a category colour.
|
|
339
339
|
`--wb-on-media` / `--wb-on-media-muted` (text), `--wb-media-ink` (badge fill),
|
|
340
340
|
`--wb-media-veil` (sold-out wash) and `--wb-media-scrim` (the bottom gradient)
|
|
341
|
-
are the same in light and dark. The scrim
|
|
342
|
-
a
|
|
341
|
+
are the same in light and dark. The scrim goes on the text block only, never
|
|
342
|
+
the whole tile: a band behind the text (white text >= 4.7:1 even on a pure
|
|
343
|
+
white photo) that fades out over the block's 28 px top padding.
|
|
343
344
|
|
|
344
345
|
### Category colours
|
|
345
346
|
|
package/dist/cjs/posTokens.js
CHANGED
|
@@ -59,13 +59,14 @@ exports.POS_TOKENS = {
|
|
|
59
59
|
"--wb-ring-soft": "rgba(23, 23, 23, 0.5)",
|
|
60
60
|
// Text and marks on a photo or a category colour (square tiles, owner
|
|
61
61
|
// 2026-10-21). The same in light and dark: a photo does not change. The
|
|
62
|
-
// scrim
|
|
63
|
-
//
|
|
62
|
+
// scrim sits behind the text block only, never the whole tile (owner,
|
|
63
|
+
// 2026-10-21: lighter): a 0.6 -> 0.55 band keeps white text >= 4.7:1 even on
|
|
64
|
+
// a pure white photo, then fades out over the block's 28 px top padding.
|
|
64
65
|
"--wb-on-media": "#ffffff",
|
|
65
66
|
"--wb-on-media-muted": "rgba(255, 255, 255, 0.85)",
|
|
66
67
|
"--wb-media-ink": "#000000",
|
|
67
68
|
"--wb-media-veil": "rgba(255, 255, 255, 0.35)",
|
|
68
|
-
"--wb-media-scrim": "linear-gradient(to top, rgba(0, 0, 0, 0.
|
|
69
|
+
"--wb-media-scrim": "linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.55) calc(100% - 28px), rgba(0, 0, 0, 0) 100%)",
|
|
69
70
|
// The brand tone. Same as the primary: the POS is monochrome.
|
|
70
71
|
"--wb-brand": "#171717",
|
|
71
72
|
// 12 px everywhere like the dashboard, 6 px for items inside a control
|
package/dist/esm/posTokens.d.ts
CHANGED
|
@@ -62,7 +62,7 @@ export declare const POS_TOKENS: {
|
|
|
62
62
|
readonly "--wb-on-media-muted": "rgba(255, 255, 255, 0.85)";
|
|
63
63
|
readonly "--wb-media-ink": "#000000";
|
|
64
64
|
readonly "--wb-media-veil": "rgba(255, 255, 255, 0.35)";
|
|
65
|
-
readonly "--wb-media-scrim": "linear-gradient(to top, rgba(0, 0, 0, 0.
|
|
65
|
+
readonly "--wb-media-scrim": "linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.55) calc(100% - 28px), rgba(0, 0, 0, 0) 100%)";
|
|
66
66
|
readonly "--wb-brand": "#171717";
|
|
67
67
|
readonly "--wb-radius": "12px";
|
|
68
68
|
readonly "--wb-radius-lg": "12px";
|
package/dist/esm/posTokens.js
CHANGED
|
@@ -54,13 +54,14 @@ export const POS_TOKENS = {
|
|
|
54
54
|
"--wb-ring-soft": "rgba(23, 23, 23, 0.5)",
|
|
55
55
|
// Text and marks on a photo or a category colour (square tiles, owner
|
|
56
56
|
// 2026-10-21). The same in light and dark: a photo does not change. The
|
|
57
|
-
// scrim
|
|
58
|
-
//
|
|
57
|
+
// scrim sits behind the text block only, never the whole tile (owner,
|
|
58
|
+
// 2026-10-21: lighter): a 0.6 -> 0.55 band keeps white text >= 4.7:1 even on
|
|
59
|
+
// a pure white photo, then fades out over the block's 28 px top padding.
|
|
59
60
|
"--wb-on-media": "#ffffff",
|
|
60
61
|
"--wb-on-media-muted": "rgba(255, 255, 255, 0.85)",
|
|
61
62
|
"--wb-media-ink": "#000000",
|
|
62
63
|
"--wb-media-veil": "rgba(255, 255, 255, 0.35)",
|
|
63
|
-
"--wb-media-scrim": "linear-gradient(to top, rgba(0, 0, 0, 0.
|
|
64
|
+
"--wb-media-scrim": "linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.55) calc(100% - 28px), rgba(0, 0, 0, 0) 100%)",
|
|
64
65
|
// The brand tone. Same as the primary: the POS is monochrome.
|
|
65
66
|
"--wb-brand": "#171717",
|
|
66
67
|
// 12 px everywhere like the dashboard, 6 px for items inside a control
|
package/dist/pos-tokens.css
CHANGED
|
@@ -31,7 +31,7 @@
|
|
|
31
31
|
--wb-on-media-muted: rgba(255, 255, 255, 0.85);
|
|
32
32
|
--wb-media-ink: #000000;
|
|
33
33
|
--wb-media-veil: rgba(255, 255, 255, 0.35);
|
|
34
|
-
--wb-media-scrim: linear-gradient(to top, rgba(0, 0, 0, 0.
|
|
34
|
+
--wb-media-scrim: linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.55) calc(100% - 28px), rgba(0, 0, 0, 0) 100%);
|
|
35
35
|
--wb-brand: #171717;
|
|
36
36
|
--wb-radius: 12px;
|
|
37
37
|
--wb-radius-lg: 12px;
|