Fix margin bottom on shifted hero components on smaller devices

nationalarchives · Dec 9, 2024 · 337686f · 337686f
1 parent e394ad6
commit 337686f
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 6 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -15,10 +15,14 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 - Shifted and split hero components no longer assume a contrasted background by default
 - `marketing` has been added to the default list of cookie policies
+- Updated the weight of the `tna-large-paragraph` class from the base weight to "medium"
 
 ### Deprecated
 ### Removed
 ### Fixed
+
+- Remove bottom margin of shifted hero components on smaller devices
+
 ### Security
 
 ## [0.3.0](https://github.com/nationalarchives/tna-frontend/compare/v0.2.18...v0.3.0) - 2024-12-05

diff --git a/src/nationalarchives/components/hero/hero.scss b/src/nationalarchives/components/hero/hero.scss
@@ -214,12 +214,14 @@ $shift-units: 5 !default;
     padding: 0;
   }
 
-  &--shift {
-    margin-bottom: spacing.space($shift-units - $padding-units-bottom);
-  }
+  @include media.on-larger-than {
+    &--shift {
+      margin-bottom: spacing.space($shift-units - $padding-units-bottom);
+    }
 
-  &--shift#{&}--narrow {
-    margin-bottom: spacing.space($shift-units - $padding-units-narrow);
+    &--shift#{&}--narrow {
+      margin-bottom: spacing.space($shift-units - $padding-units-narrow);
+    }
   }
 
   &--shift &__content-inner {
@@ -297,7 +299,6 @@ $shift-units: 5 !default;
     }
 
     &--shift {
-      margin-bottom: 0;
     }
 
     &--shift &__content-inner {