fix(css): enhance mermaid lightbox styling for better theme integration

This commit is contained in:
Julian Pawlowski 2026-04-07 14:58:10 +00:00
parent ebc3c38007
commit dba96e38e0

View file

@ -306,10 +306,18 @@ h1, h2, h3, h4, h5, h6 {
to { transform: scale(1); opacity: 1; } to { transform: scale(1); opacity: 1; }
} }
.mermaid-lightbox-inner svg { .mermaid-lightbox-inner > svg {
display: block; display: block;
width: 100%; width: 100%;
height: auto; height: auto;
/* Solid themed background — auto-switches with light/dark mode */
background: var(--ifm-background-color);
border-radius: calc(var(--ifm-card-border-radius, 0.5rem) - 2px);
}
/* Override Mermaid's hardcoded background rect (sequence diagrams, etc.) */
.mermaid-lightbox-inner svg .background {
fill: var(--ifm-background-color) !important;
} }
/* Close button (top-right corner of the card) */ /* Close button (top-right corner of the card) */