mirrors/hugo-PaperMod
1
0
Fork 0
mirror of https://github.com/adityatelange/hugo-PaperMod.git synced 2023-12-21 10:22:58 +01:00
Code Issues Packages Projects Releases Wiki Activity

Add margin top to certain elements surrounded by code blocks for consistency

Browse Source 
Take this structure:

<div .highlight>
<p>

<div .highlight>

The current post-single CSS adds margin to the bottom of the paragraph
and that's it. This works great when the previous element also got the
same amount of bottom margin, however code blocks do not! The end result
looks similar to the figure above.

This commit fixes this adding top margin to elements (as needed) that come
immediately after a code block (they have the .highlight class). The
amount of top margin added is the same they already get on the bottom.
This commit is contained in:
Richard Si 2023-01-08 14:13:58 -05:00
parent d3d90be8a4
commit 81e86113d6
No known key found for this signature in database
GPG Key ID: 33F737A005EDF2DF
1 changed files with 7 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
assets/css/common/post-single.css
View File

@ -191,6 +191,13 @@
margin-bottom: 0; margin-bottom: 0;
} }
.post-content .highlight + ol,
.post-content .highlight + p,
.post-content .highlight + figure,
.post-content .highlight + ul {
margin-top: var(--content-gap)
}
.post-content code { .post-content code {
margin: auto 4px; margin: auto 4px;
padding: 4px 6px; padding: 4px 6px;