Update colour palette #1288
Merged
Update colour palette #1288
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
govuk-design-system-ci
temporarily deployed
to
govuk-frontend-review-pr-1288
36degrees
force-pushed
the
update-colours
branch
from
a00a1f1
to
e5bafb4
Compare
govuk-design-system-ci
temporarily deployed
to
govuk-frontend-review-pr-1288
36degrees
force-pushed
the
update-colours
branch
from
e5bafb4
to
61765c4
Compare
govuk-design-system-ci
temporarily deployed
to
govuk-frontend-review-pr-1288
aliuk2012
reviewed
Apr 26, 2019
NickColley
approved these changes
Apr 29, 2019
There was a problem hiding this comment.
I've reviewed this with @aliuk2012 and we think the changes are very good, but we need a changelog entry that shows how to migrate to the new colours.
We think there is a user need to help people pick a new colour for those that have no direct replacement.
This will allow us to maintain the existing colour palette for users of GOV.UK Frontend who are migrating, and using it alongside GOV.UK Elements, Template or Frontend Toolkit.
We are removing this because the red in the palette has been updated, and there is now very little difference between 'red' and 'bright red'.
The hover style for this component will eventually change, but to keep changes contained we're just updating it with the closest colour right now.
This addresses an issue with low colour contrast between the text (white) and the background (turquoise) whilst simplifying the palette
36degrees
force-pushed
the
update-colours
branch
from
61765c4
to
272d903
Compare
|
Rebased against master and changelog entry added. @NickColley @aliuk2012 thanks for the review – let me know if you're happy with it 👍 |
NickColley
approved these changes
Apr 29, 2019
1 task
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This updates GOV.UK Frontend to use the new palette, as designed by the GOV.UK graphic design community.
This is part of a broader series of work which will be released as part of v3.0, which also includes changes to the hover and focus states of many components.
Changes to the palette
#2e358b#4c2c92#6f72af#6f72af#912b88#912b88#d53880#d53880#f499be#f499be#b10e1e#d4351c#df3034#f47738#f47738#b58840#b58840#ffbf47#ffdd00#85994b#85994b#006435#00703c#28a197#28a197#2b8cc4#5694ca#005ea5#1d70b8#003078#0b0c0c#0b0c0c#6f777b#6f777b#bfc1c3#b1b4b6#dee0e2#f8f8f8#f3f2f1#ffffff#ffffffChanges to components and styles
It also makes changes to the way that some of these colours are used, including:
Maintaining compatibility with GOV.UK Template, Frontend Toolkit and Elements
When GOV.UK Frontend is run in 'compatibility mode', the legacy palette will be used and components will continue to use the existing colours (for example, the panel will continue to be turquoise).
This is so that services can continue to adopt GOV.UK Frontend gradually, without having a mix of the two different palettes appearing within a service or a single page.
To support this:
$govuk-use-legacy-palettehas been added, which by default will betrueif any of$govuk-compatibility-govukfrontendtoolkit,$govuk-compatibility-govuktemplateor$govuk-compatibility-govukelementsaretrue.govuk-colourfunction has been updated to add a$legacyargument, which specifies the colour (either a literal, or a name of a colour from the legacy palette) to use when$govuk-use-legacy-paletteistrue.$govuk-use-legacy-paletteAny new components that are implemented whilst this arrangement is in place will need to be designed for both contexts.
You can see how 'legacy mode' looks in the review app by appending
?legacy=1to the URL:https://govuk-frontend-review-pr-1288.herokuapp.com/?legacy=1