Allow certain (header) component variables to be overridden.

[codebymikey]

This issue also affects other components which might need certain variables to be overridden.

Unsure about the use of the !global flag as that assigns the variable globally if it's not already defined.

This quick regex ^\h+\$[\w-]+: may be used to find locally defined component variables that can potentially be made to be overridden as needed.

[36degrees]

@codebymikey thanks for taking the time to raise this.

I think this is something that we'd need to look at across the entire system – as you say, this issue affects most of the components.

It'd be helpful if we could understand your use case – what is it you're trying to achieve that requires you to override the header's variables?

[codebymikey]

Hi @36degrees,

I'm essentially creating a theme for potential government platforms and using the govuk-frontend framework as its foundation over a framework like Bootstrap 4 mainly for the look-and-feel and accessibility features.

However not all clients might want to use the typical colour schemes and it'd be nice if the framework was flexible enough to allow certain component styles to be overridden without having to replace/override the whole component.

[colinrotherham]

Hi @codebymikey

Thanks again for opening this one, appreciate it's been a long time since we've replied

We've met to discuss whether we'd want the Header component to have colour overrides but really we see this component as the header for all GOV.UK services—always displayed as a "black bar with blue underline"

At the top of the Header component (Design System page) we say:

The GOV.UK header shows users that they are on GOV.UK and which service they are using.

So definitely do continue to use our component if you're running a GOV.UK service, but if you need customisable colour themes for your clients we'd rather you made your own.

Appreciate the contribution though, and it's good to document these things so I'll link to:

• Provide guidance around using the header for non GOV.UK contexts govuk-design-system#1174