johanneswuerbach / backstage-plugin-techdocs-addon-mermaid

Backstage TechDocs Mermaid Addon
MIT License
46 stars 20 forks source link

Mermaid line color / arrows not visible in Backstage dark theme #6

Closed dmckernanacv closed 2 years ago

dmckernanacv commented 2 years ago

Hello, me again!

Just wanted to know if you could release a version of this that's compatible with the stock dark mode in Backstage

You could either hardcode a different grey value for the mermaid lines in Mermaid.tsx

      mermaid.initialize({ themeVariables: { lineColor: '#666', arrowheadColor: '#666' } })

(Right before the render possibly)

Or alternatively, have a way to supply theme variables via backstage plugin config in the config.yaml?

Thanks!

johanneswuerbach commented 2 years ago

Making the mermaid configuration customisable definitely sounds feature.

I'm fairly busy this week, but if you want to give it a shot you can probably extend the MermaidProps https://github.com/johanneswuerbach/backstage-plugin-techdocs-addon-mermaid/blob/main/src/Mermaid/Mermaid.tsx#L25 to allow users to provide configurations similar to the in-tree addons https://github.com/backstage/backstage/blob/master/plugins/techdocs-module-addons-contrib/src/ReportIssue/ReportIssue.tsx#L56