What
In a similar way as for the hover, create a spike page on the review app to explore how we might support using white over a solid coloured background:
- Header
- Inverse links
- Inverse buttons
- Inverse breadcrumbs
- Inverse service navigation
- Panel (over green)
- Notification Banner (over blue or green)
- Error summary (over red)
We may also want to consider how it applies to buttons (default and secondary), where text is white over a solid coloured background.
Explore which functional colour or set of functional colours (eg. set of surface colours) could help implement this. Also explore how having custom properties for some components (eg. links, buttons) may help implement sharing the white across multiple components displayed over a coloured background.
Ensure those are documented in our working document (internal)
Why
So we can easily try different ways of making it a functional colour and the impact when the colour changes.
Who needs to work on this
Developers, with support from Designers
Who needs to review this
Developers, Designers
Done when
What
In a similar way as for the hover, create a spike page on the review app to explore how we might support using white over a solid coloured background:
We may also want to consider how it applies to buttons (default and secondary), where text is white over a solid coloured background.
Explore which functional colour or set of functional colours (eg. set of surface colours) could help implement this. Also explore how having custom properties for some components (eg. links, buttons) may help implement sharing the white across multiple components displayed over a coloured background.
Ensure those are documented in our working document (internal)
Why
So we can easily try different ways of making it a functional colour and the impact when the colour changes.
Who needs to work on this
Developers, with support from Designers
Who needs to review this
Developers, Designers
Done when