Skip to content

fix(web): paint the app shell and auth layout with the canvas token - #81

Merged
jbouder merged 1 commit into
mainfrom
fix/canvas-page-background
Sep 4, 2026
Merged

jbouder merged 1 commit into
mainfrom
fix/canvas-page-background

Conversation

@jbouder

@jbouder jbouder commented Sep 4, 2026

Copy link
Copy Markdown
Collaborator

Summary

AppShell and AuthLayout used bg-background, which the @nebari/theme tokens synced in #80 resolve to zinc-50 (the same value as the header layer), so the app body rendered light gray instead of white.

The registry's page layer is --canvas (white in light mode, zinc-975 in dark), and the nebari-ui skill documents --background as a legacy alias that page shells should not use. This swaps both shells to bg-canvas. Component-level bg-background fills (picker popup, catalog toggle) are intentionally unchanged.

Follow-up to #80, part of nebari-dev/nebari-design#143.

Verification

  • npm run lint — 0 errors (13 pre-existing warnings on registry files)
  • npm run typecheck — pass
  • npm test — 43 files, 149 tests pass
  • npm run build — pass

🤖 Generated with Claude Code

Both page shells used `bg-background`, which the @Nebari theme resolves to
zinc-50 (the header layer), so the body rendered light gray. The registry's
page layer is `--canvas` (white in light, zinc-975 in dark), and the skill
documents `--background` as a legacy alias to avoid for page shells.

Follow-up to #80 / nebari-dev/nebari-design#143.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
@jbouder
jbouder requested a review from dcmcand as a code owner September 4, 2026 18:22
@jbouder
jbouder merged commit 79d9006 into main Sep 4, 2026
5 checks passed
@jbouder
jbouder deleted the fix/canvas-page-background branch September 4, 2026 18:29
jbouder added a commit that referenced this pull request Sep 4, 2026
Resolves conflicts with #80 (registry re-sync) and #81 (canvas token):

- components/ui/{dialog,input,select,textarea}.tsx and ui-primitives.test.tsx
  take main's registry copies.
- App-owned dialogs, DocMetadataHeader, FramePicker, AdminMembersPage and
  FrameDetailPage keep this branch's Base UI compositions; VersionHistory and
  SlotSection stay deleted.
- styles.css takes main's @nebari/theme layout plus this branch's typography
  plugin, border-color reset and prose code rule. The white --background
  override is dropped now that the shell paints with --canvas.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant