Skip to content

Docs: keep dark-only widget previews dark - #62

Merged
SandObserver merged 1 commit into
mainfrom
docs/dark-only-widget-previews
Sep 20, 2026
Merged

SandObserver merged 1 commit into
mainfrom
docs/dark-only-widget-previews

Conversation

@SandObserver

Copy link
Copy Markdown
Owner

Summary

  • Read each widget's own widget.json when rendering a preview, in a shared manifestCard helper used by both WidgetPreview and WidgetGroup. The card preset and the dark-only flag now come from the manifest instead of being passed per page or left unset.
  • Set data-appearance="dark" on the preview card for Backup, GitHub, Disk Health and Now Playing, so they keep their dark card and dark interior on a light docs page, as they do on a light dashboard.
  • Update the preview card colours to the product's: opaque #1c1c1e in dark and white in light, a graphite preset for Disk Health, and no blur, replacing the old translucent glass.

Testing
npm run build and npm run check both pass. Walked every widget page on the production build on port 4322 in Chrome, in both docs themes. The four dark-only widgets render identically in both, Disk Health sits on its graphite card with no strips at its sides, and the rest follow the docs theme as the dashboard follows Display Mode.

Checklist

  • npm run build and npm run check both pass.
  • Product UI is shown by running or capturing it, never recreated in CSS.
  • Any new preview or screenshot carries no private hostnames or real data.
  • Visual changes verified in both colour schemes and both docs themes.
  • Links to the app repo still resolve.

A widget with no light design rendered light on a light docs page. The card and
the dark-only flag now come from the widget manifest, and the preview card
colours match the product's.
@SandObserver SandObserver added the documentation Improvements or additions to documentation label Sep 20, 2026
@cloudflare-workers-and-pages

Copy link
Copy Markdown

Deploying stackyard-docs with  Cloudflare Pages  Cloudflare Pages

Latest commit: a246832
Status: ✅  Deploy successful!
Preview URL: https://ef29ec5d.stackyard-docs.pages.dev
Branch Preview URL: https://docs-dark-only-widget-previe.stackyard-docs.pages.dev

View logs

@SandObserver
SandObserver merged commit e33cf93 into main Sep 20, 2026
2 checks passed
@SandObserver
SandObserver deleted the docs/dark-only-widget-previews branch September 21, 2026 00:41
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

documentation Improvements or additions to documentation

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant