Skip to content

Mermaid diagrams unreadable in dark mode #769

Description

@rootsongjc

Mermaid diagrams are unreadable in dark mode. The site defaults to dark, so most visitors see broken diagrams.

Example: https://project-hami.io/blog/kai-scheduler-hami-gpu-memory-hard-isolation

Image

Cause: docusaurus.config.js has no themeConfig.mermaid, so Mermaid never switches to a dark theme. Diagrams also hardcode light fills (fill:#d9f99d, etc.) that don't adapt.

Fix: add mermaid: { theme: { light: "default", dark: "dark" } } to themeConfig, and replace hardcoded style fills with theme-aware classDefs.

Affects every page with a mermaid code block (blog, docs, tutorials).

Metadata

Metadata

Labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions