-
Notifications
You must be signed in to change notification settings - Fork 5
Description
1. Colour patterns:
As per the specification in Figma (colour matrix/brand hierarchy):
https://www.figma.com/design/qKsxl3ogIlBp7dafgxXuCA/QLD-GOV-DDS?node-id=45445-46542&t=u8K2kc6GuFTlIPl1-0 and the use of alternative colours on:
https://www.queenslandsavers.qld.gov.au/ (and likely other websites in future)
The qds-bs5 project should:
- Have full support for generic colour tokens e.g. Primary button bg should appear as per the instances bespoke colour palette:
^ In this instance, body components still have the sapphire action colour (incorrect)
Use in campaign sites/non SWE (simple):
- Colours can be overridden after stylesheet loads (non franchise/non SWE):
<style>
:root
[list of vars)
</style>
Use in campaign sites (advanced):
-
Forking qgds-tokens and generating their own in Figma (re-usable token)
-
Any additional repositories e.g. core/web components should also share the same colour referencing (so that a single root set of variables is interoperable across various combinations of use).
2. Areas of customisation:
As per the bespoke CTA box on ForGov (Preheader) and the Queensland Savers banner (fully custom design). The BS5 codebase should have known area's of customisation:

-
CTA elements have a unique class/ID for projects to target with event listeners
-
As per the login (3rd CTA option) area's like the custom banner should allow for customisations via a generic container (e.g. RAW HTML element is loaded into a content area)
Testing:
- To be tested in single kitchen sink example (SB)
- Tests can be used to verify colour compliance across all components
(e.g. load this set of root vars, element X bg colour should be Y)