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

Admonitions appearance breaks when code blocks are included #172

Open
jwflory opened this issue Sep 16, 2022 · 0 comments
Open

Admonitions appearance breaks when code blocks are included #172

jwflory opened this issue Sep 16, 2022 · 0 comments
Labels
I: good first issue Good for newcomers I: help wanted Extra attention is needed T: bug Something isn't working

Comments

@jwflory
Copy link
Member

jwflory commented Sep 16, 2022

Summary

If a theme admonition includes a fenced code block, it breaks the admonition into two containers and the fenced code block appears to sit outside of both containers. This is a negative user experience and can challenge the meaning of content as written.

How to reproduce?

Markdown

See syntax. See example page. See example page source file.

Asciidoc

See syntax. May use different CSS classes than Markdown and both markup languages should be tested.

Expected behavior

Admonition should keep the same appearance as the example page.

Actual behavior

  1. Keep to one container with the admonition render. Now, it appears the containers are split into two: one with the admonition type (e.g. "Tip") and one with the admonition body.
  2. A fenced code block seems to exist outside of the admonition instead of connected to the inside of the admonition container. This is confusing UX about whethewr the code block is part of the admonition or part of the article.

Screenshots:

Screenshot of the "Create a new Hugo site" page in the UNICEF Inventory documentation website. The "Tip" block shown is separated in two parts. The fenced code block appears to sit outside of the admonition.

@jwflory jwflory added T: bug Something isn't working I: good first issue Good for newcomers I: help wanted Extra attention is needed labels Sep 16, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
I: good first issue Good for newcomers I: help wanted Extra attention is needed T: bug Something isn't working
Projects
Status: Backlog
Development

No branches or pull requests

1 participant