Adding <p class=".."> to support paragraph indenting similar to TeX

[adrianmsmith]

I am converting my blog from WordPress to hugo. I'm very pleased with hugo, it's a great system :)

I would like to achieve the following indenting effect for paragraphs, similar to the style that TeX uses.

This is the first paragraph, it's not indented.
   This is another paragraph, it's indented

* A bullet
* Another bullet

This is another paragraph, it's not indented, as it's preceded by
something other than a paragraph.
   This is another paragraph, it's indented.

I would like to achieve the effect that paragraphs in general are indented, but the first paragraphs, and paragraphs after non-paragraphs, are not.

This cannot be achieved using plain CSS and HTML without Javascript, if the HTML just uses a plain <p> tag. It's necessary to add classes to indicate if the paragraph is the first or not. The names that the TeX outputter uses for these classes are <p class="pFirst"> and <p class="pNext">; these names seem good enough to me.

Although this might seem like a specialized issue,

• Having indented paragraphs is a standard style, e.g. for books. So I could imagine there are others out there who might want it. Although I admit, it might be a standard style in the print world, but it's very unusual on the web.
• TeX does it that way when producing HTML. Although, of course, that by no means implies that every system should produce HTML like that, it does at least show there is precedent for this approach.
• It would not harm those who do not wish to use the feature, as it is unlikely they have CSS classes with these names defined, so the extra CSS classes in the paragraph tag would be ignored.
• Obviously every change increases code complexity, which is bad. Nevertheless, it would not increase code and test complexity by much.

Technically I could change hugo, or blackfriday, to make it work. I'm not sure which is better.

I would be happy to do the work to program this in hugo. Would you be interested in such a patch?

[bep]

I would be happy to do the work to program this in hugo. Would you be interested in such a patch?

I suspect this would have to be done in Blackfriday (have you looked at MMark?), so I would sketch out how you plan to implement this before you spend too much time on it.

[rdwatters]

@adrianmsmith

This cannot be achieved using plain CSS and HTML without Javascript

Are you sure? Have you tried using nth-child, nth-of-type, and sibling (ie, +) selectors?

I would like to achieve the effect that paragraphs in general are indented, but the first paragraphs, and paragraphs after non-paragraphs, are not.

This can be done with sibling selectors as well.

[adrianmsmith]

@rdwatters thank you! I was familiar with "first child" selectors (but they would only select the first paragraph of the content, unless each group of paragraphs was itself wrapped in a <div>). But I had not heard of sibling selectors, they sound like exactly what I need, thanks!

[github-actions]

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.