fix(ui): revive dead darwin glass palette, fix token typos, dark mint contrast by jackwener · Pull Request #454 · apache/maka

jackwener · 2026-07-03T06:21:51Z

Landing the verified findings from a 3-way parallel deep code review (renderer / @maka/ui + settings / CSS system).

Headline: the parchment-glass look never shipped (P1, dead rules)

theme-glass.css defines the darwin warm-glass palette inside @layer base, but reference-shell.css defines the same custom properties unlayered — unlayered beats layered regardless of specificity, so 4 of 5 overrides were silently dead and macOS users have been seeing the flat palette instead of the documented QoderWork glass extraction. Moved out of @layer; html[data-os] (0,1,1) outranks :root (0,1,0).

Dark-mode mint contrast (P0)

--color-state-selected: #8ee5a1 was the only live token of that block — and in dark mode it painted the active session row light-mint under near-white foreground text. Added dark variants for the whole palette; selected row deepens to oklch(0.42 0.075 152) (~7:1 against dark foreground).

Undefined-token typos (P1 × 5 call sites)

var(--surface) / var(--text) / var(--text-muted) / var(--surface-hover) don't exist in the token system → background/text color silently dropped on: search-modal input row, ⌘K palette input, browser-panel nav/address/empty, artifact image matte. All now use real tokens.

Also

--shadow-maka-panel blur layers: navy rgba literals → oklch(from var(--foreground)) (theme-tracking)
.maka-skill-add-button: hex → oklch equivalents (same look, one token language)
FirstRunChecklist ?.() ?? fallback() void-bug (fallback always fired) + contract updated to pin the explicit branch
9 english storybook section labels → Chinese (check-a11y was red on main)

Verification

npm --workspace @maka/desktop test: 1685/1685
node scripts/check-a11y.mjs: clean

… contrast, and review fallout Full frontend code-review sweep (3 parallel deep reviews: renderer / @maka/ui+settings / CSS system). This lands the CSS findings plus two cross-cutting fixes: - theme-glass.css: the darwin warm-glass palette sat inside @layer base while reference-shell.css defines the same custom properties unlayered - unlayered beats layered, so the documented parchment-glass look NEVER shipped. Moved out of @layer and added dark-mode variants; --color-state-selected mint #8ee5a1 deepens to oklch(0.42 0.075 152) in dark so the selected session row is no longer near-white text on light mint. - Undefined-token typos silently dropping styles in 5 places: var(--surface)/var(--text)/var(--text-muted)/var(--surface-hover) do not exist - search-modal input row, command-palette input, browser panel nav/address/empty, artifact image matte now use real tokens. - styles.css --shadow-maka-panel blur layers: fixed rgba(15,23,42,*) navy literals to oklch(from var(--foreground)) so the panel shadow tracks the theme. - module-pages.css .maka-skill-add-button: hex CTA recipe to oklch equivalents (same rendered look, one token language). - FirstRunChecklist: optional-call-then-nullish-fallback fired the fallback unconditionally (void return) - explicit branch; contract updated to pin the correct pattern. - storybook form-controls stories: 9 english section labels to Chinese (check-a11y was failing on main). Desktop suite: 1685/1685; check-a11y clean.

jackwener · 2026-07-03T06:21:51Z

Landing the verified findings from a 3-way parallel deep code review (renderer / @maka/ui + settings / CSS system).

Headline: the parchment-glass look never shipped (P1, dead rules)

theme-glass.css defines the darwin warm-glass palette inside @layer base, but reference-shell.css defines the same custom properties unlayered — unlayered beats layered regardless of specificity, so 4 of 5 overrides were silently dead and macOS users have been seeing the flat palette instead of the documented QoderWork glass extraction. Moved out of @layer; html[data-os] (0,1,1) outranks :root (0,1,0).

Dark-mode mint contrast (P0)

--color-state-selected: #8ee5a1 was the only live token of that block — and in dark mode it painted the active session row light-mint under near-white foreground text. Added dark variants for the whole palette; selected row deepens to oklch(0.42 0.075 152) (~7:1 against dark foreground).

Undefined-token typos (P1 × 5 call sites)

var(--surface) / var(--text) / var(--text-muted) / var(--surface-hover) don't exist in the token system → background/text color silently dropped on: search-modal input row, ⌘K palette input, browser-panel nav/address/empty, artifact image matte. All now use real tokens.

Also

--shadow-maka-panel blur layers: navy rgba literals → oklch(from var(--foreground)) (theme-tracking)
.maka-skill-add-button: hex → oklch equivalents (same look, one token language)
FirstRunChecklist ?.() ?? fallback() void-bug (fallback always fired) + contract updated to pin the explicit branch
9 english storybook section labels → Chinese (check-a11y was red on main)

Verification

npm --workspace @maka/desktop test: 1685/1685
node scripts/check-a11y.mjs: clean

… contrast, and review fallout Full frontend code-review sweep (3 parallel deep reviews: renderer / @maka/ui+settings / CSS system). This lands the CSS findings plus two cross-cutting fixes: - theme-glass.css: the darwin warm-glass palette sat inside @layer base while reference-shell.css defines the same custom properties unlayered - unlayered beats layered, so the documented parchment-glass look NEVER shipped. Moved out of @layer and added dark-mode variants; --color-state-selected mint #8ee5a1 deepens to oklch(0.42 0.075 152) in dark so the selected session row is no longer near-white text on light mint. - Undefined-token typos silently dropping styles in 5 places: var(--surface)/var(--text)/var(--text-muted)/var(--surface-hover) do not exist - search-modal input row, command-palette input, browser panel nav/address/empty, artifact image matte now use real tokens. - styles.css --shadow-maka-panel blur layers: fixed rgba(15,23,42,*) navy literals to oklch(from var(--foreground)) so the panel shadow tracks the theme. - module-pages.css .maka-skill-add-button: hex CTA recipe to oklch equivalents (same rendered look, one token language). - FirstRunChecklist: optional-call-then-nullish-fallback fired the fallback unconditionally (void return) - explicit branch; contract updated to pin the correct pattern. - storybook form-controls stories: 9 english section labels to Chinese (check-a11y was failing on main). Desktop suite: 1685/1685; check-a11y clean.

jackwener · 2026-07-03T06:21:51Z

Landing the verified findings from a 3-way parallel deep code review (renderer / @maka/ui + settings / CSS system).

Headline: the parchment-glass look never shipped (P1, dead rules)

theme-glass.css defines the darwin warm-glass palette inside @layer base, but reference-shell.css defines the same custom properties unlayered — unlayered beats layered regardless of specificity, so 4 of 5 overrides were silently dead and macOS users have been seeing the flat palette instead of the documented QoderWork glass extraction. Moved out of @layer; html[data-os] (0,1,1) outranks :root (0,1,0).

Dark-mode mint contrast (P0)

--color-state-selected: #8ee5a1 was the only live token of that block — and in dark mode it painted the active session row light-mint under near-white foreground text. Added dark variants for the whole palette; selected row deepens to oklch(0.42 0.075 152) (~7:1 against dark foreground).

Undefined-token typos (P1 × 5 call sites)

var(--surface) / var(--text) / var(--text-muted) / var(--surface-hover) don't exist in the token system → background/text color silently dropped on: search-modal input row, ⌘K palette input, browser-panel nav/address/empty, artifact image matte. All now use real tokens.

Also

--shadow-maka-panel blur layers: navy rgba literals → oklch(from var(--foreground)) (theme-tracking)
.maka-skill-add-button: hex → oklch equivalents (same look, one token language)
FirstRunChecklist ?.() ?? fallback() void-bug (fallback always fired) + contract updated to pin the explicit branch
9 english storybook section labels → Chinese (check-a11y was red on main)

Verification

npm --workspace @maka/desktop test: 1685/1685
node scripts/check-a11y.mjs: clean

… contrast, and review fallout Full frontend code-review sweep (3 parallel deep reviews: renderer / @maka/ui+settings / CSS system). This lands the CSS findings plus two cross-cutting fixes: - theme-glass.css: the darwin warm-glass palette sat inside @layer base while reference-shell.css defines the same custom properties unlayered - unlayered beats layered, so the documented parchment-glass look NEVER shipped. Moved out of @layer and added dark-mode variants; --color-state-selected mint #8ee5a1 deepens to oklch(0.42 0.075 152) in dark so the selected session row is no longer near-white text on light mint. - Undefined-token typos silently dropping styles in 5 places: var(--surface)/var(--text)/var(--text-muted)/var(--surface-hover) do not exist - search-modal input row, command-palette input, browser panel nav/address/empty, artifact image matte now use real tokens. - styles.css --shadow-maka-panel blur layers: fixed rgba(15,23,42,*) navy literals to oklch(from var(--foreground)) so the panel shadow tracks the theme. - module-pages.css .maka-skill-add-button: hex CTA recipe to oklch equivalents (same rendered look, one token language). - FirstRunChecklist: optional-call-then-nullish-fallback fired the fallback unconditionally (void return) - explicit branch; contract updated to pin the correct pattern. - storybook form-controls stories: 9 english section labels to Chinese (check-a11y was failing on main). Desktop suite: 1685/1685; check-a11y clean.

jackwener · 2026-07-03T06:21:51Z

Landing the verified findings from a 3-way parallel deep code review (renderer / @maka/ui + settings / CSS system).

Headline: the parchment-glass look never shipped (P1, dead rules)

theme-glass.css defines the darwin warm-glass palette inside @layer base, but reference-shell.css defines the same custom properties unlayered — unlayered beats layered regardless of specificity, so 4 of 5 overrides were silently dead and macOS users have been seeing the flat palette instead of the documented QoderWork glass extraction. Moved out of @layer; html[data-os] (0,1,1) outranks :root (0,1,0).

Dark-mode mint contrast (P0)

--color-state-selected: #8ee5a1 was the only live token of that block — and in dark mode it painted the active session row light-mint under near-white foreground text. Added dark variants for the whole palette; selected row deepens to oklch(0.42 0.075 152) (~7:1 against dark foreground).

Undefined-token typos (P1 × 5 call sites)

var(--surface) / var(--text) / var(--text-muted) / var(--surface-hover) don't exist in the token system → background/text color silently dropped on: search-modal input row, ⌘K palette input, browser-panel nav/address/empty, artifact image matte. All now use real tokens.

Also

--shadow-maka-panel blur layers: navy rgba literals → oklch(from var(--foreground)) (theme-tracking)
.maka-skill-add-button: hex → oklch equivalents (same look, one token language)
FirstRunChecklist ?.() ?? fallback() void-bug (fallback always fired) + contract updated to pin the explicit branch
9 english storybook section labels → Chinese (check-a11y was red on main)

Verification

npm --workspace @maka/desktop test: 1685/1685
node scripts/check-a11y.mjs: clean

… contrast, and review fallout Full frontend code-review sweep (3 parallel deep reviews: renderer / @maka/ui+settings / CSS system). This lands the CSS findings plus two cross-cutting fixes: - theme-glass.css: the darwin warm-glass palette sat inside @layer base while reference-shell.css defines the same custom properties unlayered - unlayered beats layered, so the documented parchment-glass look NEVER shipped. Moved out of @layer and added dark-mode variants; --color-state-selected mint #8ee5a1 deepens to oklch(0.42 0.075 152) in dark so the selected session row is no longer near-white text on light mint. - Undefined-token typos silently dropping styles in 5 places: var(--surface)/var(--text)/var(--text-muted)/var(--surface-hover) do not exist - search-modal input row, command-palette input, browser panel nav/address/empty, artifact image matte now use real tokens. - styles.css --shadow-maka-panel blur layers: fixed rgba(15,23,42,*) navy literals to oklch(from var(--foreground)) so the panel shadow tracks the theme. - module-pages.css .maka-skill-add-button: hex CTA recipe to oklch equivalents (same rendered look, one token language). - FirstRunChecklist: optional-call-then-nullish-fallback fired the fallback unconditionally (void return) - explicit branch; contract updated to pin the correct pattern. - storybook form-controls stories: 9 english section labels to Chinese (check-a11y was failing on main). Desktop suite: 1685/1685; check-a11y clean.

jackwener · 2026-07-03T06:21:51Z

Landing the verified findings from a 3-way parallel deep code review (renderer / @maka/ui + settings / CSS system).

Headline: the parchment-glass look never shipped (P1, dead rules)

theme-glass.css defines the darwin warm-glass palette inside @layer base, but reference-shell.css defines the same custom properties unlayered — unlayered beats layered regardless of specificity, so 4 of 5 overrides were silently dead and macOS users have been seeing the flat palette instead of the documented QoderWork glass extraction. Moved out of @layer; html[data-os] (0,1,1) outranks :root (0,1,0).

Dark-mode mint contrast (P0)

--color-state-selected: #8ee5a1 was the only live token of that block — and in dark mode it painted the active session row light-mint under near-white foreground text. Added dark variants for the whole palette; selected row deepens to oklch(0.42 0.075 152) (~7:1 against dark foreground).

Undefined-token typos (P1 × 5 call sites)

var(--surface) / var(--text) / var(--text-muted) / var(--surface-hover) don't exist in the token system → background/text color silently dropped on: search-modal input row, ⌘K palette input, browser-panel nav/address/empty, artifact image matte. All now use real tokens.

Also

--shadow-maka-panel blur layers: navy rgba literals → oklch(from var(--foreground)) (theme-tracking)
.maka-skill-add-button: hex → oklch equivalents (same look, one token language)
FirstRunChecklist ?.() ?? fallback() void-bug (fallback always fired) + contract updated to pin the explicit branch
9 english storybook section labels → Chinese (check-a11y was red on main)

Verification

npm --workspace @maka/desktop test: 1685/1685
node scripts/check-a11y.mjs: clean

… contrast, and review fallout Full frontend code-review sweep (3 parallel deep reviews: renderer / @maka/ui+settings / CSS system). This lands the CSS findings plus two cross-cutting fixes: - theme-glass.css: the darwin warm-glass palette sat inside @layer base while reference-shell.css defines the same custom properties unlayered - unlayered beats layered, so the documented parchment-glass look NEVER shipped. Moved out of @layer and added dark-mode variants; --color-state-selected mint #8ee5a1 deepens to oklch(0.42 0.075 152) in dark so the selected session row is no longer near-white text on light mint. - Undefined-token typos silently dropping styles in 5 places: var(--surface)/var(--text)/var(--text-muted)/var(--surface-hover) do not exist - search-modal input row, command-palette input, browser panel nav/address/empty, artifact image matte now use real tokens. - styles.css --shadow-maka-panel blur layers: fixed rgba(15,23,42,*) navy literals to oklch(from var(--foreground)) so the panel shadow tracks the theme. - module-pages.css .maka-skill-add-button: hex CTA recipe to oklch equivalents (same rendered look, one token language). - FirstRunChecklist: optional-call-then-nullish-fallback fired the fallback unconditionally (void return) - explicit branch; contract updated to pin the correct pattern. - storybook form-controls stories: 9 english section labels to Chinese (check-a11y was failing on main). Desktop suite: 1685/1685; check-a11y clean.

jackwener · 2026-07-03T06:21:51Z

Landing the verified findings from a 3-way parallel deep code review (renderer / @maka/ui + settings / CSS system).

Headline: the parchment-glass look never shipped (P1, dead rules)

theme-glass.css defines the darwin warm-glass palette inside @layer base, but reference-shell.css defines the same custom properties unlayered — unlayered beats layered regardless of specificity, so 4 of 5 overrides were silently dead and macOS users have been seeing the flat palette instead of the documented QoderWork glass extraction. Moved out of @layer; html[data-os] (0,1,1) outranks :root (0,1,0).

Dark-mode mint contrast (P0)

--color-state-selected: #8ee5a1 was the only live token of that block — and in dark mode it painted the active session row light-mint under near-white foreground text. Added dark variants for the whole palette; selected row deepens to oklch(0.42 0.075 152) (~7:1 against dark foreground).

Undefined-token typos (P1 × 5 call sites)

var(--surface) / var(--text) / var(--text-muted) / var(--surface-hover) don't exist in the token system → background/text color silently dropped on: search-modal input row, ⌘K palette input, browser-panel nav/address/empty, artifact image matte. All now use real tokens.

Also

--shadow-maka-panel blur layers: navy rgba literals → oklch(from var(--foreground)) (theme-tracking)
.maka-skill-add-button: hex → oklch equivalents (same look, one token language)
FirstRunChecklist ?.() ?? fallback() void-bug (fallback always fired) + contract updated to pin the explicit branch
9 english storybook section labels → Chinese (check-a11y was red on main)

Verification

npm --workspace @maka/desktop test: 1685/1685
node scripts/check-a11y.mjs: clean

… contrast, and review fallout Full frontend code-review sweep (3 parallel deep reviews: renderer / @maka/ui+settings / CSS system). This lands the CSS findings plus two cross-cutting fixes: - theme-glass.css: the darwin warm-glass palette sat inside @layer base while reference-shell.css defines the same custom properties unlayered - unlayered beats layered, so the documented parchment-glass look NEVER shipped. Moved out of @layer and added dark-mode variants; --color-state-selected mint #8ee5a1 deepens to oklch(0.42 0.075 152) in dark so the selected session row is no longer near-white text on light mint. - Undefined-token typos silently dropping styles in 5 places: var(--surface)/var(--text)/var(--text-muted)/var(--surface-hover) do not exist - search-modal input row, command-palette input, browser panel nav/address/empty, artifact image matte now use real tokens. - styles.css --shadow-maka-panel blur layers: fixed rgba(15,23,42,*) navy literals to oklch(from var(--foreground)) so the panel shadow tracks the theme. - module-pages.css .maka-skill-add-button: hex CTA recipe to oklch equivalents (same rendered look, one token language). - FirstRunChecklist: optional-call-then-nullish-fallback fired the fallback unconditionally (void return) - explicit branch; contract updated to pin the correct pattern. - storybook form-controls stories: 9 english section labels to Chinese (check-a11y was failing on main). Desktop suite: 1685/1685; check-a11y clean.

jackwener · 2026-07-03T06:21:51Z

Landing the verified findings from a 3-way parallel deep code review (renderer / @maka/ui + settings / CSS system).

Headline: the parchment-glass look never shipped (P1, dead rules)

theme-glass.css defines the darwin warm-glass palette inside @layer base, but reference-shell.css defines the same custom properties unlayered — unlayered beats layered regardless of specificity, so 4 of 5 overrides were silently dead and macOS users have been seeing the flat palette instead of the documented QoderWork glass extraction. Moved out of @layer; html[data-os] (0,1,1) outranks :root (0,1,0).

Dark-mode mint contrast (P0)

--color-state-selected: #8ee5a1 was the only live token of that block — and in dark mode it painted the active session row light-mint under near-white foreground text. Added dark variants for the whole palette; selected row deepens to oklch(0.42 0.075 152) (~7:1 against dark foreground).

Undefined-token typos (P1 × 5 call sites)

var(--surface) / var(--text) / var(--text-muted) / var(--surface-hover) don't exist in the token system → background/text color silently dropped on: search-modal input row, ⌘K palette input, browser-panel nav/address/empty, artifact image matte. All now use real tokens.

Also

--shadow-maka-panel blur layers: navy rgba literals → oklch(from var(--foreground)) (theme-tracking)
.maka-skill-add-button: hex → oklch equivalents (same look, one token language)
FirstRunChecklist ?.() ?? fallback() void-bug (fallback always fired) + contract updated to pin the explicit branch
9 english storybook section labels → Chinese (check-a11y was red on main)

Verification

npm --workspace @maka/desktop test: 1685/1685
node scripts/check-a11y.mjs: clean

… contrast, and review fallout Full frontend code-review sweep (3 parallel deep reviews: renderer / @maka/ui+settings / CSS system). This lands the CSS findings plus two cross-cutting fixes: - theme-glass.css: the darwin warm-glass palette sat inside @layer base while reference-shell.css defines the same custom properties unlayered - unlayered beats layered, so the documented parchment-glass look NEVER shipped. Moved out of @layer and added dark-mode variants; --color-state-selected mint #8ee5a1 deepens to oklch(0.42 0.075 152) in dark so the selected session row is no longer near-white text on light mint. - Undefined-token typos silently dropping styles in 5 places: var(--surface)/var(--text)/var(--text-muted)/var(--surface-hover) do not exist - search-modal input row, command-palette input, browser panel nav/address/empty, artifact image matte now use real tokens. - styles.css --shadow-maka-panel blur layers: fixed rgba(15,23,42,*) navy literals to oklch(from var(--foreground)) so the panel shadow tracks the theme. - module-pages.css .maka-skill-add-button: hex CTA recipe to oklch equivalents (same rendered look, one token language). - FirstRunChecklist: optional-call-then-nullish-fallback fired the fallback unconditionally (void return) - explicit branch; contract updated to pin the correct pattern. - storybook form-controls stories: 9 english section labels to Chinese (check-a11y was failing on main). Desktop suite: 1685/1685; check-a11y clean.

jackwener · 2026-07-03T06:21:51Z

Landing the verified findings from a 3-way parallel deep code review (renderer / @maka/ui + settings / CSS system).

Headline: the parchment-glass look never shipped (P1, dead rules)

theme-glass.css defines the darwin warm-glass palette inside @layer base, but reference-shell.css defines the same custom properties unlayered — unlayered beats layered regardless of specificity, so 4 of 5 overrides were silently dead and macOS users have been seeing the flat palette instead of the documented QoderWork glass extraction. Moved out of @layer; html[data-os] (0,1,1) outranks :root (0,1,0).

Dark-mode mint contrast (P0)

--color-state-selected: #8ee5a1 was the only live token of that block — and in dark mode it painted the active session row light-mint under near-white foreground text. Added dark variants for the whole palette; selected row deepens to oklch(0.42 0.075 152) (~7:1 against dark foreground).

Undefined-token typos (P1 × 5 call sites)

var(--surface) / var(--text) / var(--text-muted) / var(--surface-hover) don't exist in the token system → background/text color silently dropped on: search-modal input row, ⌘K palette input, browser-panel nav/address/empty, artifact image matte. All now use real tokens.

Also

--shadow-maka-panel blur layers: navy rgba literals → oklch(from var(--foreground)) (theme-tracking)
.maka-skill-add-button: hex → oklch equivalents (same look, one token language)
FirstRunChecklist ?.() ?? fallback() void-bug (fallback always fired) + contract updated to pin the explicit branch
9 english storybook section labels → Chinese (check-a11y was red on main)

Verification

npm --workspace @maka/desktop test: 1685/1685
node scripts/check-a11y.mjs: clean

… contrast, and review fallout Full frontend code-review sweep (3 parallel deep reviews: renderer / @maka/ui+settings / CSS system). This lands the CSS findings plus two cross-cutting fixes: - theme-glass.css: the darwin warm-glass palette sat inside @layer base while reference-shell.css defines the same custom properties unlayered - unlayered beats layered, so the documented parchment-glass look NEVER shipped. Moved out of @layer and added dark-mode variants; --color-state-selected mint #8ee5a1 deepens to oklch(0.42 0.075 152) in dark so the selected session row is no longer near-white text on light mint. - Undefined-token typos silently dropping styles in 5 places: var(--surface)/var(--text)/var(--text-muted)/var(--surface-hover) do not exist - search-modal input row, command-palette input, browser panel nav/address/empty, artifact image matte now use real tokens. - styles.css --shadow-maka-panel blur layers: fixed rgba(15,23,42,*) navy literals to oklch(from var(--foreground)) so the panel shadow tracks the theme. - module-pages.css .maka-skill-add-button: hex CTA recipe to oklch equivalents (same rendered look, one token language). - FirstRunChecklist: optional-call-then-nullish-fallback fired the fallback unconditionally (void return) - explicit branch; contract updated to pin the correct pattern. - storybook form-controls stories: 9 english section labels to Chinese (check-a11y was failing on main). Desktop suite: 1685/1685; check-a11y clean.