marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-08-28 20:56:48 +02:00
Code Issues Packages Projects Releases Wiki Activity

#5432 Theme based text color for labels

Browse Source
This commit is contained in:
Knut Sveidqvist
2024-10-28 11:51:44 +01:00
parent e07e9b9daf
commit d790e353b0
2 changed files with 21 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
cypress/platform/knsv2.html
View File

@@ -32,8 +32,9 @@
<style> <style>
body { body {
/* background: rgb(221, 208, 208); */ /* background: rgb(221, 208, 208); */
/* background: #333; */ background: #333;
font-family: 'Arial'; font-family: 'Arial';
/* color: white; */
/* font-size: 18px !important; */ /* font-size: 18px !important; */
} }
@@ -83,29 +84,36 @@
</head> </head>
<body> <body>
<pre id="diagram4" class="mermaid2">
kanban
id2[In progress]
docs[Create Blog about the new diagram]@{ priority: 'Very Low', ticket: MC-2037, assigned: 'knsv' }
</pre>
<pre id="diagram4" class="mermaid"> <pre id="diagram4" class="mermaid">
--- ---
config: config:
kanban: kanban:
ticketBaseUrl: 'https://mermaidchart.atlassian.net/browse/#TICKET#' ticketBaseUrl: 'https://mermaidchart.atlassian.net/browse/#TICKET#'
# sectionWidth: 300
--- ---
kanban kanban
id1[Todo] Todo
docs[Create Documentation] [Create Documentation]
docs[Create Blog about the new diagram] docs[Create Blog about the new diagram]
id7[In progress] id7[In progress]
id6[Create renderer so that it works in all cases. We also add som extra text here for testing purposes. And some more just for the extra flare.] id6[Create renderer so that it works in all cases. We also add som extra text here for testing purposes. And some more just for the extra flare.]
id8[Design grammar]@{ assigned: 'knsv' }
id9[Ready for deploy] id9[Ready for deploy]
id8[Design grammar]@{ assigned: 'knsv' }
id10[Ready for test] id10[Ready for test]
id4[Create parsing tests]@{ ticket: MC-2038, assigned: 'K.Sveidqvist', priority: 'High' }
id66[last item]@{ priority: 'Very Low', assigned: 'knsv' }
id11[Done] id11[Done]
id5[define getData] id5[define getData]
id2[Title of diagram is more than 100 chars when user duplicates diagram with 100 char]@{ ticket: MC-2036, priority: 'Very High'} id2[Title of diagram is more than 100 chars when user duplicates diagram with 100 char]@{ ticket: MC-2036, priority: 'Very High'}
id3[Update DB function]@{ ticket: MC-2037, assigned: knsv, priority: 'High' } id3[Update DB function]@{ ticket: MC-2037, assigned: knsv, priority: 'High' }
id4[Create parsing tests]@{ ticket: MC-2038, assigned: 'K.Sveidqvist', priority: 'High' }
id66[last item]@{ priority: 'Very Low', assigned: 'knsv' }
id12[Can't reproduce] id12[Can't reproduce]
id3[Weird flickering in Firefox]
</pre> </pre>
<script type="module"> <script type="module">
import mermaid from './mermaid.esm.mjs'; import mermaid from './mermaid.esm.mjs';
@@ -119,8 +127,9 @@ kanban
}; };
mermaid.initialize({ mermaid.initialize({
// theme: 'base', // theme: 'base',
theme: 'default',
// handDrawnSeed: 12, // handDrawnSeed: 12,
// look: 'handDrawn', look: 'handDrawn',
// 'elk.nodePlacement.strategy': 'NETWORK_SIMPLEX', // 'elk.nodePlacement.strategy': 'NETWORK_SIMPLEX',
// layout: 'dagre', // layout: 'dagre',
// layout: 'elk', // layout: 'elk',

6
packages/mermaid/src/diagrams/kanban/styles.ts
View File

@@ -92,7 +92,11 @@ const getStyles: DiagramStylesProvider = (options) =>
.edge { .edge {
fill: none; fill: none;
} }
.mindmap-node-label { .cluster-label, .label {
color: ${options.textColor};
fill: ${options.textColor};
}
.kanban-label {
dy: 1em; dy: 1em;
alignment-baseline: middle; alignment-baseline: middle;
text-anchor: middle; text-anchor: middle;