@skaile/brand 0.4.0 → 0.4.1

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 (3) hide show
  1. package/package.json +1 -1
  2. package/src/css/theme.css +23 -17
  3. package/src/tokens.json +4 -4
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@skaile/brand",
3
- "version": "0.4.0",
3
+ "version": "0.4.1",
4
4
  "description": "Skaile brand: design tokens, CSS custom properties, Tailwind preset, and brand assets",
5
5
  "license": "UNLICENSED",
6
6
  "type": "module",
package/src/css/theme.css CHANGED
@@ -25,18 +25,20 @@
25
25
  --color-scheme: light;
26
26
 
27
27
  /* Core palette */
28
- /* The page is the lightest surface and a panel sits *into* it, not on it.
29
- That direction is taken from the platform's dark design, and light follows
30
- it so one sentence describes both themes. The 6-point page/panel gap is
31
- the one the previous ramp used; only its sign changed. Neutral throughout,
32
- as the design is: every grey here has zero saturation. */
33
- --background: hsl(0 0% 100%);
28
+ /* Light lifts its panels off the page; dark sets them into it. The two
29
+ directions are deliberate and were chosen against renders of both: on a
30
+ dark ground a panel reads as a recess, on a light one it reads as a card,
31
+ and forcing one rule onto both gave light a set of grey wells. What the
32
+ themes do share is temperature — every grey here has zero saturation, as
33
+ the platform's dark design does. */
34
+ --background: hsl(0 0% 94%);
34
35
  --foreground: hsl(0 0% 11%);
35
- --card: hsl(0 0% 94%);
36
+ --card: hsl(0 0% 100%);
36
37
  --card-foreground: hsl(0 0% 11%);
37
- /* Level with the page, as stock shadcn light is: a popover is told apart by
38
- its border and shadow, which every popover surface in ui-components
39
- draws, not by its fill. */
38
+ /* Level with the panel, not with the page: a popover floats above the page,
39
+ so it takes the panel's surface. Card and popover being the same white is
40
+ deliberate and is what stock shadcn light does — not one of them left
41
+ un-bumped. */
40
42
  --popover: hsl(0 0% 100%);
41
43
  --popover-foreground: hsl(0 0% 11%);
42
44
  --primary: hsl(267 100% 50%);
@@ -55,12 +57,16 @@
55
57
  --border: hsl(0 0% 86%);
56
58
  --input: hsl(0 0% 86%);
57
59
  --ring: hsl(267 100% 50%);
58
- /* Below the panel, as in dark: the strip recedes and an active tab rises out
59
- of it. */
60
+ /* Below the page, so an active tab rises out of the strip and meets the
61
+ panel it belongs to. */
60
62
  --tab-bar: hsl(0 0% 89%);
61
63
  /* The surface a panel's own content sinks into — the file viewer beside the
62
- tree. Third step of the ramp, below the panel. */
63
- --surface-sunken: hsl(0 0% 91%);
64
+ tree. One step below the panel, which here leaves it between the panel and
65
+ the page rather than below both, as in dark.
66
+ It happens to share 96% with --secondary/--muted/--accent above. That is a
67
+ coincidence of this ramp, not a coupling: those three style UI elements,
68
+ this one is a depth. Moving it need not move them. */
69
+ --surface-sunken: hsl(0 0% 96%);
64
70
 
65
71
  /* Skaile-specific */
66
72
  --color-success: hsl(161.4 93.5% 30.4%);
@@ -69,7 +75,7 @@
69
75
  --color-warning-foreground: hsl(0 0% 11%);
70
76
  --color-ai-accent: hsl(37.7 92.1% 50.2%);
71
77
  --color-primary-bright: hsl(267 100% 63%);
72
- --color-surface: hsl(0 0% 96%);
78
+ --color-surface: hsl(0 0% 100%);
73
79
 
74
80
  /* Chart palette */
75
81
  --chart-1: hsl(267 100% 50%);
@@ -80,8 +86,8 @@
80
86
 
81
87
  /* Sidebar */
82
88
  /* Tied to the page, as dark ties it. The sidebar is chrome, not a panel, so
83
- it takes the ground the panels sit in. */
84
- --sidebar: hsl(0 0% 100%);
89
+ it takes the ground the panels sit on. */
90
+ --sidebar: hsl(0 0% 94%);
85
91
  --sidebar-foreground: hsl(0 0% 11%);
86
92
  --sidebar-primary: hsl(267 100% 50%);
87
93
  --sidebar-primary-foreground: hsl(0 0% 100%);
package/src/tokens.json CHANGED
@@ -34,15 +34,15 @@
34
34
  "text-dim": "#777777"
35
35
  },
36
36
  "platform-light": {
37
- "background": "hsl(0 0% 100%)",
37
+ "background": "hsl(0 0% 94%)",
38
38
  "tab-bar": "hsl(0 0% 89%)",
39
- "card": "hsl(0 0% 94%)",
39
+ "card": "hsl(0 0% 100%)",
40
40
  "popover": "hsl(0 0% 100%)",
41
- "surface": "hsl(0 0% 96%)",
41
+ "surface": "hsl(0 0% 100%)",
42
42
  "secondary": "hsl(0 0% 96%)",
43
43
  "muted": "hsl(0 0% 96%)",
44
44
  "accent": "hsl(0 0% 96%)",
45
- "surface-sunken": "hsl(0 0% 91%)",
45
+ "surface-sunken": "hsl(0 0% 96%)",
46
46
  "foreground": "hsl(0 0% 11%)",
47
47
  "muted-foreground": "hsl(0 0% 40%)",
48
48
  "border": "hsl(0 0% 86%)",