@matteoaliano/forest-ui 0.2.3 → 0.2.5
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/dist/{chunk-F5PVQ752.mjs → chunk-CQX6QWMF.mjs} +6 -6
- package/dist/{chunk-F5PVQ752.mjs.map → chunk-CQX6QWMF.mjs.map} +1 -1
- package/dist/{index-BHSAMOHR.d.mts → index-lqHy9CQ4.d.mts} +4 -4
- package/dist/{index-BHSAMOHR.d.ts → index-lqHy9CQ4.d.ts} +4 -4
- package/dist/index.d.mts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +4 -4
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +2 -2
- package/dist/theme.d.mts +1 -1
- package/dist/theme.d.ts +1 -1
- package/dist/theme.js +4 -4
- package/dist/theme.js.map +1 -1
- package/dist/theme.mjs +1 -1
- package/guidelines/FOREST_AI_GUIDELINES.md +2 -2
- package/guidelines/FOREST_DEV_GUIDELINES.md +2 -0
- package/guidelines/themes/FOREST_THEME_DEFAULT.md +6 -4
- package/package.json +1 -1
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
# Forest UI — Default Theme Guidelines
|
|
2
2
|
|
|
3
|
+
> **forest-ui v0.2.5**
|
|
4
|
+
|
|
3
5
|
> **This file is synced by the `forest-ui` package.**
|
|
4
6
|
> Run `npx forest-ui sync` to update it.
|
|
5
7
|
|
|
@@ -11,11 +13,11 @@
|
|
|
11
13
|
|
|
12
14
|
| Context | Token | Value | Usage |
|
|
13
15
|
|---|---|---|---|
|
|
14
|
-
| **Page background** | `bg.primary` | `#
|
|
15
|
-
| **Page background (alt)** | `bg.primaryAlt` | `#
|
|
16
|
+
| **Page background** | `bg.primary` | `#f9fafb` (Gray 50) | Default background for every page and top-level layout. All root containers (`<body>`, app shell, page wrappers) must use this token. |
|
|
17
|
+
| **Page background (alt)** | `bg.primaryAlt` | `#f9fafb` (Gray 50) | Alias available when a future theme overrides the primary page bg. Use interchangeably with `bg.primary` in layouts. |
|
|
16
18
|
|
|
17
19
|
> [!IMPORTANT]
|
|
18
|
-
> Every page **must** set its root background to `bg.primary`. Never hard-code `#
|
|
20
|
+
> Every page **must** set its root background to `bg.primary`. Never hard-code `#f9fafb` or any other color — always reference the semantic token so themes can override it.
|
|
19
21
|
|
|
20
22
|
### Surface Hierarchy
|
|
21
23
|
|
|
@@ -24,7 +26,7 @@ Use progressively deeper background tokens to create visual depth between nested
|
|
|
24
26
|
| Level | Token | Typical Use |
|
|
25
27
|
|---|---|---|
|
|
26
28
|
| 0 — Page | `bg.primary` | Page canvas, app shell |
|
|
27
|
-
| 1 —
|
|
29
|
+
| 1 — Elevated surface | `bg.secondary` / `bg.secondaryAlt` | Cards, papers, sidebar panels — white surfaces that sit on top of the gray page canvas |
|
|
28
30
|
| 1 — Section (subtle) | `bg.secondarySubtle` | Very light tinted sections (e.g., feature highlight rows) |
|
|
29
31
|
| 2 — Inset | `bg.tertiary` | Nested panels, code blocks, table header rows |
|
|
30
32
|
| 3 — Deepest inset | `bg.quaternary` | Skeleton loaders, deeply nested containers |
|