Fixed rendering of arrow heads in Mermaid.js class diagrams

Fix embedded mermaid css to fix class diagram arrow heads
squidfunk · Feb 6, 2025 · a1816ae · a1816ae
2 parents 4861c7d + 0a98686
commit a1816ae
Showing 1 changed file with 4 additions and 8 deletions.
diff --git a/src/templates/assets/javascripts/components/content/mermaid/index.css b/src/templates/assets/javascripts/components/content/mermaid/index.css
@@ -171,19 +171,15 @@ g.classGroup text {
 }
 
 /* Class extension, composition and dependency marker */
-defs #classDiagram-extensionStart,
-defs #classDiagram-extensionEnd,
-defs #classDiagram-compositionStart,
-defs #classDiagram-compositionEnd,
-defs #classDiagram-dependencyStart,
-defs #classDiagram-dependencyEnd {
+defs marker.marker.extension.class path,
+defs marker.marker.composition.class path ,
+defs marker.marker.dependency.class path  {
   fill: var(--md-mermaid-edge-color) !important;
   stroke: var(--md-mermaid-edge-color) !important;
 }
 
 /* Class aggregation marker */
-defs #classDiagram-aggregationStart,
-defs #classDiagram-aggregationEnd {
+defs marker.marker.aggregation.class path  {
   fill: var(--md-mermaid-label-bg-color) !important;
   stroke: var(--md-mermaid-edge-color) !important;
 }