Add quick styles to mermaid.js diagrams

Kong · Sep 23, 2024 · 46a134c · 46a134c
1 parent 4849527
commit 46a134c
Showing 1 changed file with 23 additions and 0 deletions.
diff --git a/app/_assets/stylesheets/index.css b/app/_assets/stylesheets/index.css
@@ -283,4 +283,27 @@
     }
   }
 
+  .mermaid svg {
+    @apply m-auto;
+
+    p, span {
+      @apply text-primary !important;
+    }
+
+    rect, circle, ellipse, polygon {
+      @apply fill-transparent stroke-[rgb(var(--color-brand))] !important;
+    }
+
+    .label-container {
+      @apply fill-[rgb(var(--color-bg-secondary))] !important;
+    }
+
+    .edgeLabel {
+      @apply bg-primary !important;
+    }
+
+    path {
+      @apply fill-[rgb(var(--color-brand))] stroke-[rgb(var(--color-brand))] stroke-1 !important
+    }
+  }
 }