Render header ID and/or preamble ID in preview
gmccullo opened this issue · 0 comments
gmccullo commented
If a header has an ID, it would be nice to have that ID applied to a section tag in the rendered HTML in the preview. For example:
markdown
#### foobar{#special}
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
current preview
<div class="markdown-body">
<h2 id="foobar">foobar</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</div>
desired preview
<div class="markdown-body">
<section id="special">
<h2 id="foobar">foobar</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</section>
</div>
Rationale: This is basically what Pandoc does when it converts markdown to html or epub. And that lets us use ID selectors in CSS to apply styles to a particular section of the document:
#special {
font-size: large;
}
Since the "special" id is not in the preview HTML that CSS selector doesn't work in preview. You can only see it after compiling the epub.