diff --git a/CHANGELOG.md b/CHANGELOG.md index 089eb577b2..f35356d215 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -9,6 +9,7 @@ ## Unreleased +* Add spacing to cookie banner confirmation message ([PR #1936](https://github.com/alphagov/govuk_publishing_components/pull/1936)) * Fix cookie banner preview in the component guide ([PR #1935](https://github.com/alphagov/govuk_publishing_components/pull/1935)) ## 24.2.0 diff --git a/app/assets/stylesheets/govuk_publishing_components/components/_cookie-banner.scss b/app/assets/stylesheets/govuk_publishing_components/components/_cookie-banner.scss index 1d8718e247..3548315ad4 100644 --- a/app/assets/stylesheets/govuk_publishing_components/components/_cookie-banner.scss +++ b/app/assets/stylesheets/govuk_publishing_components/components/_cookie-banner.scss @@ -40,17 +40,25 @@ $govuk-cookie-banner-background: govuk-colour("light-grey", "grey-4"); .gem-c-cookie-banner__confirmation-message { margin-right: govuk-spacing(4); + @include govuk-media-query($from: desktop) { max-width: 90%; margin-bottom: 0; } } +// Override style from design system so we can have consistent +// padding on the the banner and the confirmation + +.govuk-cookie-banner { + padding-top: 0; +} + // Override the styles from govuk_template // stylelint-disable selector-max-id .gem-c-cookie-banner#global-cookie-message { background-color: $govuk-cookie-banner-background; - padding: 0; + padding: govuk-spacing(3) 0 0 0; box-sizing: border-box; .gem-c-cookie-banner__message,