diff --git a/CHANGELOG.md b/CHANGELOG.md index 39c56b7d1..66e5b3b62 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,9 @@ +# HEAD + +## Bug Fixes + +* **css:** newsletter and section heading components padding now matches other components + # 21.1.0 ## Features diff --git a/assets/sass/protocol/components/_newsletter-form.scss b/assets/sass/protocol/components/_newsletter-form.scss index 4ffca6f8f..8a5d98059 100644 --- a/assets/sass/protocol/components/_newsletter-form.scss +++ b/assets/sass/protocol/components/_newsletter-form.scss @@ -69,7 +69,7 @@ @media #{$mq-md} { @include clearfix; - padding: $h-grid-md $v-grid-lg; + padding: $v-grid-md $h-grid-lg; max-width: none; .mzp-c-newsletter-image { @@ -120,20 +120,20 @@ } @media #{$mq-xl} { - padding: $h-grid-xl $layout-2xl; + padding: $v-grid-xl $layout-2xl; } @supports (--css: variables) { @media #{$mq-md} { - padding: var(--h-grid-md) var(--v-grid-lg); + padding: var(--v-grid-md) var(--h-grid-md); } @media #{$mq-lg} { - padding: var(--h-grid-lg) $layout-2xl; + padding: var(--v-grid-lg) $layout-2xl; } @media #{$mq-xl} { - padding: var(--h-grid-xl) $layout-2xl; + padding: var(--v-grid-xl) $layout-2xl; } } } diff --git a/assets/sass/protocol/components/_section-heading.scss b/assets/sass/protocol/components/_section-heading.scss index f53d618c2..691e1a1b3 100644 --- a/assets/sass/protocol/components/_section-heading.scss +++ b/assets/sass/protocol/components/_section-heading.scss @@ -10,16 +10,16 @@ .mzp-c-section-heading { @include text-title-md; margin: 0 auto; - padding: $h-grid-xs $layout-xs; + padding: $v-grid-xs $layout-xs; max-width: $content-lg; text-align: center; @media #{$mq-md} { - padding: $h-grid-md $v-grid-md; + padding: $v-grid-md $h-grid-md; } @media #{$mq-xl} { - padding: $h-grid-xl $v-grid-xl; + padding: $v-grid-xl $h-grid-xl; } // rely on l-content for padding if nested