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

Adding a paragraph break in a list item wraps every other list item in a <p> tag #1326

Closed
camelid opened this issue Sep 10, 2020 · 2 comments

Comments

@camelid
Copy link
Member

camelid commented Sep 10, 2020

Instead, I would think that it would only have <p> tags in the list item that has multiple paragraphs.

Before

Markdown

- **_index.hbs_** is the handlebars template.
- **_head.hbs_** is appended to the HTML `<head>` section.
- **_header.hbs_** content is appended on top of every book page.
- **_book.css_** is the style used in the output. If you want to change the
  design of your book, this is probably the file you want to modify. Sometimes
  in conjunction with `index.hbs` when you want to radically change the layout.
- **_book.js_** is mostly used to add client side functionality, like hiding /
  un-hiding the sidebar, changing the theme, ...
- **_highlight.js_** is the JavaScript that is used to highlight code snippets,
  you should not need to modify this.
- **_highlight.css_** is the theme used for the code highlighting.
- **_favicon.svg_** and **_favicon.png_** the favicon that will be used. The SVG
  version is used by [newer browsers].

Rendered

image

HTML (prettified)

<ul>
  <li><strong><em>index.hbs</em></strong> is the handlebars template.</li>
  <li><strong><em>head.hbs</em></strong> is appended to the HTML <code class="hljs">&lt;head&gt;</code> section.</li>
  <li><strong><em>header.hbs</em></strong> content is appended on top of every book page.</li>
  <li><strong><em>book.css</em></strong> is the style used in the output. If you want to change the
    design of your book, this is probably the file you want to modify. Sometimes
    in conjunction with <code class="hljs">index.hbs</code> when you want to radically change the layout.</li>
  <li><strong><em>book.js</em></strong> is mostly used to add client side functionality, like hiding /
    un-hiding the sidebar, changing the theme, ...</li>
  <li><strong><em>highlight.js</em></strong> is the JavaScript that is used to highlight code snippets,
    you should not need to modify this.</li>
  <li><strong><em>highlight.css</em></strong> is the theme used for the code highlighting.</li>
  <li><strong><em>favicon.svg</em></strong> and <strong><em>favicon.png</em></strong> the favicon that will be used. The SVG
    version is used by <a href="https://caniuse.com/#feat=link-icon-svg">newer browsers</a>.</li>
</ul>

After

Markdown

- **_index.hbs_** is the handlebars template.
- **_head.hbs_** is appended to the HTML `<head>` section.
- **_header.hbs_** content is appended on top of every book page.
- **_book.css_** is the style used in the output. If you want to change the
  design of your book, this is probably the file you want to modify. Sometimes
  in conjunction with `index.hbs` when you want to radically change the layout.
- **_book.js_** is mostly used to add client side functionality, like hiding /
  un-hiding the sidebar, changing the theme, ...
- **_highlight.js_** is the JavaScript that is used to highlight code snippets,
  you should not need to modify this.
  
  This is a new paragraph!
- **_highlight.css_** is the theme used for the code highlighting.
- **_favicon.svg_** and **_favicon.png_** the favicon that will be used. The SVG
  version is used by [newer browsers].

Rendered

image

HTML (prettified)

<ul>
  <li>
    <p><strong><em>index.hbs</em></strong> is the handlebars template.</p>
  </li>
  <li>
    <p><strong><em>head.hbs</em></strong> is appended to the HTML <code class="hljs">&lt;head&gt;</code> section.</p>
  </li>
  <li>
    <p><strong><em>header.hbs</em></strong> content is appended on top of every book page.</p>
  </li>
  <li>
    <p><strong><em>book.css</em></strong> is the style used in the output. If you want to change the
      design of your book, this is probably the file you want to modify. Sometimes
      in conjunction with <code class="hljs">index.hbs</code> when you want to radically change the layout.</p>
  </li>
  <li>
    <p><strong><em>book.js</em></strong> is mostly used to add client side functionality, like hiding /
      un-hiding the sidebar, changing the theme, ...</p>
  </li>
  <li>
    <p><strong><em>highlight.js</em></strong> is the JavaScript that is used to highlight code snippets,
      you should not need to modify this.</p>
      <p>This is a new paragraph!</p>
  </li>
  <li>
    <p><strong><em>highlight.css</em></strong> is the theme used for the code highlighting.</p>
  </li>
  <li>
    <p><strong><em>favicon.svg</em></strong> and <strong><em>favicon.png</em></strong> the favicon that will be used. The SVG
      version is used by <a href="https://caniuse.com/#feat=link-icon-svg">newer browsers</a>.</p>
  </li>
</ul>

Diff

Markdown

diff --git a/book-example/src/format/theme/README.md b/book-example/src/format/theme/README.md
index d27a1fc..879320c 100644
--- a/book-example/src/format/theme/README.md
+++ b/book-example/src/format/theme/README.md
@@ -21,6 +21,8 @@ Here are the files you can override:
   un-hiding the sidebar, changing the theme, ...
 - **_highlight.js_** is the JavaScript that is used to highlight code snippets,
   you should not need to modify this.
+  
+  This is a new paragraph!
 - **_highlight.css_** is the theme used for the code highlighting.
 - **_favicon.svg_** and **_favicon.png_** the favicon that will be used. The SVG
   version is used by [newer browsers].

HTML

diff --git a/before.html b/after.html
index d31c778..db912d0 100644
--- a/before.html
+++ b/after.html
@@ -1,15 +1,32 @@
 <ul>
-  <li><strong><em>index.hbs</em></strong> is the handlebars template.</li>
-  <li><strong><em>head.hbs</em></strong> is appended to the HTML <code class="hljs">&lt;head&gt;</code> section.</li>
-  <li><strong><em>header.hbs</em></strong> content is appended on top of every book page.</li>
-  <li><strong><em>book.css</em></strong> is the style used in the output. If you want to change the
-    design of your book, this is probably the file you want to modify. Sometimes
-    in conjunction with <code class="hljs">index.hbs</code> when you want to radically change the layout.</li>
-  <li><strong><em>book.js</em></strong> is mostly used to add client side functionality, like hiding /
-    un-hiding the sidebar, changing the theme, ...</li>
-  <li><strong><em>highlight.js</em></strong> is the JavaScript that is used to highlight code snippets,
-    you should not need to modify this.</li>
-  <li><strong><em>highlight.css</em></strong> is the theme used for the code highlighting.</li>
-  <li><strong><em>favicon.svg</em></strong> and <strong><em>favicon.png</em></strong> the favicon that will be used. The SVG
-    version is used by <a href="https://caniuse.com/#feat=link-icon-svg">newer browsers</a>.</li>
+  <li>
+    <p><strong><em>index.hbs</em></strong> is the handlebars template.</p>
+  </li>
+  <li>
+    <p><strong><em>head.hbs</em></strong> is appended to the HTML <code class="hljs">&lt;head&gt;</code> section.</p>
+  </li>
+  <li>
+    <p><strong><em>header.hbs</em></strong> content is appended on top of every book page.</p>
+  </li>
+  <li>
+    <p><strong><em>book.css</em></strong> is the style used in the output. If you want to change the
+      design of your book, this is probably the file you want to modify. Sometimes
+      in conjunction with <code class="hljs">index.hbs</code> when you want to radically change the layout.</p>
+  </li>
+  <li>
+    <p><strong><em>book.js</em></strong> is mostly used to add client side functionality, like hiding /
+      un-hiding the sidebar, changing the theme, ...</p>
+  </li>
+  <li>
+    <p><strong><em>highlight.js</em></strong> is the JavaScript that is used to highlight code snippets,
+      you should not need to modify this.</p>
+      <p>This is a new paragraph!</p>
+  </li>
+  <li>
+    <p><strong><em>highlight.css</em></strong> is the theme used for the code highlighting.</p>
+  </li>
+  <li>
+    <p><strong><em>favicon.svg</em></strong> and <strong><em>favicon.png</em></strong> the favicon that will be used. The SVG
+      version is used by <a href="https://caniuse.com/#feat=link-icon-svg">newer browsers</a>.</p>
+  </li>
 </ul>

mdBook Version

mdbook v0.4.3

@ehuss
Copy link
Contributor

ehuss commented Sep 22, 2020

Commonmark has specific rules for when a list is "tight" or "loose" (see https://spec.commonmark.org/0.29/#tight). I believe pulldown-cmark is following the spec here. See pulldown-cmark/pulldown-cmark#475 for more details.

@camelid
Copy link
Member Author

camelid commented Nov 11, 2020

Ah, okay. I'll close this for now then.

@camelid camelid closed this as completed Nov 11, 2020
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

2 participants