From 98d65b1d73b4b3ea22f84ed5a6065849f42ac1b0 Mon Sep 17 00:00:00 2001 From: Oliver Byford Date: Wed, 3 Apr 2024 14:00:14 +0100 Subject: [PATCH 1/2] Use canvas colour for cookie banner over hardcoded grey MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The cookie banner is hardcoded to use light-grey as a background colour. Wherever possible, we should use the ‘applied’ colours rather than specific colours from the palette. We think (although this is somewhat post-rationalising) that the cookie banner uses light-grey for the same reason the footer does. Light grey is the 'canvas' colour used for the `` element and everything outside of the , including any viewport after the footer and the overscroll area. As the cookie banner appears above the header, it's conceptually outside of the body of the page. Update the cookie banner to reference the canvas background colour rather than the hardcoded light-grey. --- .../src/govuk/components/cookie-banner/_index.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/govuk-frontend/src/govuk/components/cookie-banner/_index.scss b/packages/govuk-frontend/src/govuk/components/cookie-banner/_index.scss index 3af5025fe8..6af648f0ef 100644 --- a/packages/govuk-frontend/src/govuk/components/cookie-banner/_index.scss +++ b/packages/govuk-frontend/src/govuk/components/cookie-banner/_index.scss @@ -11,7 +11,7 @@ // when user changes colours in their browser. border-bottom: $border-bottom-width solid transparent; - background-color: govuk-colour("light-grey"); + background-color: $govuk-canvas-background-colour; } // Support older browsers which don't hide elements with the `hidden` attribute From 5c7ce04068067253c8bb958bb571e37fb3e38af8 Mon Sep 17 00:00:00 2001 From: Oliver Byford Date: Wed, 3 Apr 2024 14:16:09 +0100 Subject: [PATCH 2/2] Document in CHANGELOG --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 5d0408e206..16eaff6c9d 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -9,6 +9,7 @@ For advice on how to use these release notes see [our guidance on staying up to We've made fixes to GOV.UK Frontend in the following pull requests: - [#4906: Update the icon in the warning text component to match the defined text colour and background colour, rather than always being white on black](https://github.com/alphagov/govuk-frontend/pull/4906) +- [#4919: Use canvas colour for cookie banner over hardcoded grey](https://github.com/alphagov/govuk-frontend/pull/4919) ## GOV.UK Frontend v5.3.0 (Feature release)