Skip to content

feat: add Ultra Dark theme support - #557

Open
cmdr-chara wants to merge 1 commit into
fileverse:mainfrom
cmdr-chara:feat/ultra-dark-theme
Open

feat: add Ultra Dark theme support#557
cmdr-chara wants to merge 1 commit into
fileverse:mainfrom
cmdr-chara:feat/ultra-dark-theme

Conversation

@cmdr-chara

Copy link
Copy Markdown

What

Adds theme-ultra-dark as a supported dDoc theme with a complete, self-contained token set. The theme uses the #0a0a0a document canvas shown by the hosted dDocs Ultra Dark preview and a slightly darker #050505 editor shell.

The demo includes an Ultra Dark toggle so the theme can be tested independently of the hosted application's theme selector.

Why

Consumers can currently pass light, dark, Sepia, Pink, and Green theme keys, but there is no supported key for the hosted Ultra Dark design. Adding it at the component layer allows consumers to opt in without relying on an additional .dark ancestor or overriding internal tokens.

Implementation

  • adds theme-ultra-dark to ThemeKey and the Tailwind safelist;
  • supplies complete button, text, background, border, icon, tooltip, comment, and overlay tokens;
  • applies the theme class at the editor root so nested surfaces inherit it consistently;
  • treats Ultra Dark as a dark surface for responsive editor colors;
  • adds a demo toggle and propagates the selected theme to DdocEditor;
  • adds focused tests for token presence, contrast, variant selection, fallback behavior, and responsive hard-black text.

Accessibility

Automated checks cover the principal neutral foregrounds against the #0a0a0a canvas:

  • primary text: at least 7:1;
  • secondary text: at least 4.5:1;
  • default component boundaries: at least 3:1.

Test plan

  • Toggle Ultra Dark on and off in the local demo.
  • Verify editor canvas is computed as rgb(10, 10, 10).
  • Verify editor shell is computed as rgb(5, 5, 5).
  • Check menus and portal-rendered UI inherit readable tokens.
  • Verify returning to Light restores the white canvas.
  • Run focused Ultra Dark tests: 6 passed.
  • Run ESLint on changed TypeScript/TSX files.
  • Run Prettier check on all changed files.
  • Run git diff --check.
  • Run npm run build.

Repository test-suite note

The full suite currently reports 70 passing tests, while two pre-existing suites fail during collection because package/utils/make-editor is missing:

  • package/hooks/use-editor-commands.test.tsx
  • package/utils/selection-utils.test.ts

The same failures reproduce on the unmodified main revision and are unrelated to this theme.

Hosted-app scope

This PR adds support in the open-source dDoc component. Enabling the “Ultra Dark — Coming soon” option in the hosted dDocs application may require a coordinated change in the host application and/or @fileverse/ui.

@vercel

vercel Bot commented Aug 12, 2026

Copy link
Copy Markdown

@cmdr-chara is attempting to deploy a commit to the fileverse Team on Vercel.

A member of the Team first needs to authorize it.

@cmdr-chara

Copy link
Copy Markdown
Author

Hi @mbj36, when you have a moment, could you please take a look at this? It adds component-level support for the hosted Ultra Dark design, including focused tests and accessibility checks. I’d especially appreciate confirmation that the theme-key and token approach fits the intended architecture. Thanks!

@mbj36

mbj36 commented Aug 13, 2026

Copy link
Copy Markdown
Collaborator

@cmdr-chara Hi, thanks for the changes. Unfortunately, design tokens live in our shared UI package, so they need to land there first. But we will enable the Ultra Dark theme in coming days.

@cmdr-chara

Copy link
Copy Markdown
Author

@cmdr-chara Hi, thanks for the changes. Unfortunately, design tokens live in our shared UI package, so they need to land there first. But we will enable the Ultra Dark theme in coming days.

Thanks for clarifying! I’d also be happy to contribute to the hosted dDocs app more broadly, not only to the Ultra Dark integration. I can help with testing, UI polish, and other features wherever it’s useful. Feel free to point me toward an appropriate task, I'm grateful that dDocs exists ^_^

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.

2 participants