Add an organisation's brand colour
An organistion’s brand colour is used to style their organisation page (such as dividing lines, icons and link text). For example see the DCMS organisation page.
The colour is set as an option under a drop down field called “brand colour” when creating or editing an organisation page in Whitehall Publisher.
1. Add the brand colour in GOV.UK Frontend
Set up a fork of govuk-frontend
, then add the colour to the _colours-organisations.scss file and update the CHANGELOG.
See updating changelog and example PR for more details.
Note
It may be some time before the next version of
govuk-frontend
is released, to get the changes out on time you can add the colour ingovuk_publishing_components
, see this PR as an example.
2. Add the organisation as brand colour option in Whitehall
Add a new entry for the organisation in app/models/organisation_brand_colour.rb, which will show
the organisation as an option under the brand colour drop down field in Whitehall.
The CSS class name should match the name used in govuk-frontend
.
Testing your changes locally
- Install
govuk-frontend
with npm - In
govuk_publishing_components
, updatepackage.json
to point to your localgovuk-frontend
repo, then update the package, see this doc for more details - In
collections
, update the Gemfile to point to your local version ofgovuk_publishing_components
- In
whitehall
, you should see the organisation as an option under thebrand colour
field (you will also need to update theStatus on GOV.UK
tocurrently live
to view the page) - Run
./startup.sh —integration
incollections
to view the organisation’s page
Note
It may take some time for the colour to update on the page in
integration
. You might be able to speed up the process by running thepublishing_api:republish_organisation[slug]
rake task in Whitehall.