From e484c4859acb6625a37ac53f7eb853d495de3b1c Mon Sep 17 00:00:00 2001 From: Claas Augner <495429+caugner@users.noreply.github.com> Date: Fri, 24 Jan 2025 11:15:09 +0100 Subject: [PATCH] fix(blog): avoid overflow + double padding (#12508) * fix(blog): set max-width only on large screens Only set `max-width: 52rem` on larger screens, to avoid overflow on smaller screens. * fix(blog): avoid adding padding twice Previously, we were adding 1rem of horizontal padding both on `
` and `
`. Now, we only add it on the `
`, to be consistent with content pages. --- client/src/blog/post.scss | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/client/src/blog/post.scss b/client/src/blog/post.scss index 6f4571a6039b..551f0055bb5b 100644 --- a/client/src/blog/post.scss +++ b/client/src/blog/post.scss @@ -6,6 +6,7 @@ grid-template-areas: "post" "newsletter"; + padding: 0; width: 100%; @media (min-width: $screen-lg) { @@ -81,7 +82,10 @@ > .blog-post { grid-area: post; - max-width: 52rem; + + @media (min-width: $screen-lg) { + max-width: 52rem; + } + .section-newsletter h2 { font: var(--type-heading-h3);