docs-v2/assets/styles/layouts/article/_diagrams.scss

49 lines
994 B
SCSS

.mermaid {
opacity: 0;
color: $article-bg;
margin: 3rem 0;
transition: opacity .5s;
font-family: $proxima;
.arrowheadPath, .arrowMarkerPath { fill: $diagram-arrow !important; }
.edgePath .path, .flowchart-link { stroke: $diagram-arrow !important; }
.label, .nodeLabel { color: $article-text !important; }
.cluster-label .nodeLabel {
color: $article-code !important;
}
.edgeLabel {
color: $article-text !important;
background: $article-code-bg !important;
font-size: .85em;
font-weight: $medium;
}
.node {
rect,
circle,
ellipse,
polygon,
path {
fill: $article-bg !important;
stroke: $diagram-arrow !important;
stroke-width: 2px !important;
}
span.label { color: $article-text !important; }
}
.cluster {
rect,
circle,
ellipse,
polygon,
path {
fill: $article-code-bg !important;
stroke: none !important;
}
}
&[data-processed="true"] {
opacity: 1;
}
}