From 81e86113d686801e75b5bdea9c78a04210e17ab4 Mon Sep 17 00:00:00 2001 From: Richard Si Date: Sun, 8 Jan 2023 14:13:58 -0500 Subject: [PATCH] Add margin top to certain elements surrounded by code blocks for consistency Take this structure:

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. --- assets/css/common/post-single.css | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/assets/css/common/post-single.css b/assets/css/common/post-single.css index ba6e5a23..74880a18 100644 --- a/assets/css/common/post-single.css +++ b/assets/css/common/post-single.css @@ -191,6 +191,13 @@ 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 { margin: auto 4px; padding: 4px 6px;