Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Align picture to center #103

Open
Mighten opened this issue Jun 3, 2023 · 0 comments
Open

Align picture to center #103

Mighten opened this issue Jun 3, 2023 · 0 comments

Comments

@Mighten
Copy link

Mighten commented Jun 3, 2023

Hi, @dsrkafuu, first I want to thank you for providing this wonderful theme!

Recently, I cannot arrange a pictures to the center of a paragraph, by the following Markdown syntax:

![alt text](/path/to/file.svg)

Is there a possible way to align a picture to the center of a paragraph, by Markdown Syntax (Not <img> tag)?

Thank you!


F.Y.I., the Mermaid can align a diagram to the center, configurations shown below:

in /layouts/partials/mermaid.html:

<script defer src="https://cdn.jsdelivr.net/npm/mermaid@latest/dist/mermaid.min.js"></script>

<script>
    // Replace mermaid pre.code to div
    Array.from(document.getElementsByClassName("language-mermaid")).forEach(
      (el) => {
        el.parentElement.outerHTML = `<div class="mermaid">${el.innerText}</div>`;
      }
    );
</script>
<style>
/* Set svg to center */
.mermaid svg {
    display: block;
    margin: auto;
    background-color: rgba(255, 255, 255, 0.5);
}
</style>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant