mermaid-js / mermaid

Generation of diagrams like flowcharts or sequence diagrams from text in a similar manner as markdown
https://mermaid.js.org
MIT License
71.42k stars 6.45k forks source link

Document Gantt Chart Colour Customization #5915

Open HariSekhon opened 1 week ago

HariSekhon commented 1 week ago

Description

Gantt chart documentation requires clarification on how to easily modify colours using inline init themeVariables

Steps to reproduce

N/A

Screenshots

This looks rubbish and needs colour customization of both bars and text - you can't even see the text in the light grey bar using the default setting:

Screenshot 2024-10-02 at 01 40 05

Code Sample

No response

Setup

Suggested Solutions

Improve Official Documentation

This discussion thread has some ideas:

https://github.com/orgs/mermaid-js/discussions/5436

I'm experimenting with it by looking at the variables here:

https://github.com/mermaid-js/mermaid/blob/develop/packages/mermaid/src/themes/theme-default.js

Additional Context

No response

HariSekhon commented 1 week ago

I spent ages testing out customizing my Gantt chart colours the other night - the code might give some tips if anyone finds this issue:

https://github.com/HariSekhon/HariSekhon/blob/725ae8fc6c8227b9bdcd46f2c00efc9e91fe2049/README.md#gantt-chart-of-my-experience

HariSekhon commented 1 week ago

Relates to https://github.com/orgs/mermaid-js/discussions/5436

HariSekhon commented 4 days ago

Should probably go here, which looks like it's missing documentation for many of the new diagram types:

https://mermaid.js.org/config/theming.html