search

alex-shpak / hugo-book

Hugo documentation theme as simple as plain book
https://hugo-book-demo.netlify.app
MIT License
3.4k stars 1.17k forks source link

mermaid: choosing <div> over <p> for styling flexibility #564

Closed nnzv closed 6 days ago

nnzv commented 11 months ago

Enhance styling and centering by opting for <div> over <p>. For example, utilize the class div.mermaid with text-align: center; for positioning the Mermaid.js SVG image at the center of the container.

// filepath: assets/_custom.scss
div.mermaid {
    text-align: center;
}
alex-shpak commented 10 months ago

Hello! <p> is used to apply regular spacing (as many other blocks in markdown are rendered as paragraphs). How this will be different from p.mermaid {} class?

alex-shpak commented 6 days ago

In the end another PR was merged changing p to pre. https://github.com/alex-shpak/hugo-book/pull/613