-
Notifications
You must be signed in to change notification settings - Fork 0
feat: add dark mode support for generated flow diagrams #4
Copy link
Copy link
Open
Labels
enhancementNew feature or requestNew feature or requestgood first issueGood for newcomersGood for newcomers
Description
Summary
FlowMaster generates Mermaid diagrams with default (light) styling. Many developers use dark-themed editors and documentation sites. The generated diagrams should support a dark mode color scheme.
What needs to happen
- Define a dark mode color palette for diagram elements:
- Node fill colors (dark backgrounds with light text)
- Edge/arrow colors (visible on dark backgrounds)
- Subgraph background colors
- Add a theme toggle instruction in the skill file (e.g., a parameter or flag for dark/light)
- Use Mermaid's built-in theming system where possible:
- `%%{init: {"theme": "dark"}}%%` directive
- Custom `themeVariables` for FlowMaster-specific styling
- Ensure all node types remain distinguishable in dark mode
Acceptance criteria
- Diagrams render correctly on dark backgrounds (GitHub dark mode, VS Code dark themes)
- All node type colors have sufficient contrast in dark mode
- Light mode remains the default (no regression)
- User can request dark mode via a clear instruction
Getting started
- Review Mermaid theming docs: https://mermaid.js.org/config/theming.html
- Test current FlowMaster output with `%%{init: {"theme": "dark"}}%%`
- Identify which node styles need color overrides
Reactions are currently unavailable
Metadata
Metadata
Assignees
Labels
enhancementNew feature or requestNew feature or requestgood first issueGood for newcomersGood for newcomers