From 6316bace005fd459cb9194f9ed323afdc4ffe9c0 Mon Sep 17 00:00:00 2001
From: druid <druid@druids-MBP-2.lan>
Date: Fri, 29 Jan 2021 11:46:07 +0200
Subject: [PATCH] padding bottom for h2 paragraph headings
---
.../accordion-container.tsx | 16 ----------
src/components/heading/heading.scss | 30 ++++++++++++++++++-
2 files changed, 29 insertions(+), 17 deletions(-)
diff --git a/src/components/accordion-container/accordion-container.tsx b/src/components/accordion-container/accordion-container.tsx
index 15b79e04..3a008d94 100644
--- a/src/components/accordion-container/accordion-container.tsx
+++ b/src/components/accordion-container/accordion-container.tsx
@@ -30,19 +30,3 @@ export class AccordionContainer {
);
}
}
-
-/*
-Paragraphs that have an option to include an H2-heading:
-Harmonise the padding under the enabled H2-heading in all paragraphs.
-Where exactly? Under paragraph or under the h2 title?
-
-No sidebar navigation:
-- Mobile 24 px = 1.5rem
-- Tablet: 28 px = 1.75rem
-- Screens 960-1200 px: 32 px = 2rem
-- Screens wider than 1200 px: 40 px = 2.5rem
-
-With sidebar navigation:
-- Screens 1201-1600 px: 32 px = 2rem
-- Screens wider than 1600 px: 40 px = 2.5rem
-* */
diff --git a/src/components/heading/heading.scss b/src/components/heading/heading.scss
index b459ea92..dd8b5858 100644
--- a/src/components/heading/heading.scss
+++ b/src/components/heading/heading.scss
@@ -48,7 +48,7 @@
padding: 1.5rem 0 1rem;
@include breakpoint($narrow) {
- padding: 2rem 0 1.5rem;
+ padding: 2rem 0 1rem;
}
}
@@ -170,6 +170,20 @@ h1.hy-heading__introduction {
padding: 0 0 1rem;
}
}
+
+ h2.hy-heading__landingsection,
+ h2.hy-heading__contentsection {
+ padding-bottom: 1.5rem;
+ @include breakpoint($narrow) {
+ padding-bottom: 1.75rem;
+ }
+ @include breakpoint($wide) {
+ padding-bottom: 2rem;
+ }
+ @include breakpoint($xlarge) {
+ padding-bottom: 2.5rem;
+ }
+ }
}
// Applied when there is NO sidebar
@@ -198,6 +212,20 @@ h1.hy-heading__introduction {
}
}
+ h2.hy-heading__landingsection,
+ h2.hy-heading__contentsection {
+ padding-bottom: 1.5rem;
+ @include breakpoint($narrow) {
+ padding-bottom: 1.75rem;
+ }
+ @include breakpoint($wide) {
+ padding-bottom: 2rem;
+ }
+ @include breakpoint($extrawide) {
+ padding-bottom: 2.5rem;
+ }
+ }
+
//Hero h1
h1.hy-heading__introduction {
@include breakpoint($extrawide) {
--
GitLab