Skip to content

fix: remove hard-coded colors from Mermaid diagrams for dark mode readability#702

Open
rkratky wants to merge 2 commits into
ubuntu:mainfrom
rkratky:fix/issue-694-mermaid-dark-mode
Open

fix: remove hard-coded colors from Mermaid diagrams for dark mode readability#702
rkratky wants to merge 2 commits into
ubuntu:mainfrom
rkratky:fix/issue-694-mermaid-dark-mode

Conversation

@rkratky

@rkratky rkratky commented Jul 14, 2026

Copy link
Copy Markdown
Collaborator

Description

  • Remove hard-coded colors (fill, stroke, background, classDef, style) from all Mermaid diagrams so they use the default theme, which adapts to both light and dark modes
  • Add themeVariables (fontSize, fontFamily) to each diagram to maintain consistent typography without hard-coding colors
  • Update diagram links from full URLs to relative paths
  • Adjust Mermaid container width in custom_styles.css from 70% to 100%

Related issue

Checklist

  • I have read and followed the Ubuntu Project contributing guide
  • My pull request is linked to an existing issue (if applicable)
  • I have tested my changes, and they work as expected

@github-actions github-actions Bot added MIR For the attention of the MIR team DMB For the attention of the Developer Membership Board SRU For the attention of the SRU team labels Jul 14, 2026
@rkratky

rkratky commented Jul 14, 2026

Copy link
Copy Markdown
Collaborator Author

Note for reviewers: This PR does not change any content -- it only improves styling and formatting of diagrams. No text, incl. in the diagrams has been touched.

@cpaelzer cpaelzer left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

+1 for the changes to the MIR pages, checked the rendering on https://canonical-ubuntu-projectubuntu--702.com.readthedocs.build/MIR/mir-process-states/ and it is fine.

@setharnold setharnold left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is ISSUES-ASSESSMENT.md supposed to be part of this? it feels like it's intended for your own local use.

@rkratky

rkratky commented Jul 14, 2026

Copy link
Copy Markdown
Collaborator Author

Is ISSUES-ASSESSMENT.md supposed to be part of this? it feels like it's intended for your own local use.

Yeah, that's an oversight, of course. Thanks.

Fixed now.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

DMB For the attention of the Developer Membership Board MIR For the attention of the MIR team SRU For the attention of the SRU team

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Feedback]: Many mermaid diagrams are unreadable when using dark mode

5 participants