th-zev - Méli-mélo details
Background colours used for NRCan's ZEV campaign
Sponsored by: NRCan - Eric Goodwin (@auxonic), NRCan - Gérard Dicks Pellerin (Gerard.DicksPellerin@nrcan-rncan.gc.ca)
Examples
Thematic definition
Class CSS list
bg-zev-purplebg-zev-greenbtn-zev-purplebtn-zev-greenpanel-zev-greenpanel-zev-purple
JavasScript function list
Implementation note
The following notes must be applied when implementing this thematic to ensure it follows the principle of progressive enhancement. These instructions must be followed so that the web page stays functional and conforming after the expiration date and removal of this thematic.
- The
bg-zev-purpleclass must be accompanied with another dark contrast background colour such asbg-dark - Use
bg-zev-greenwith standard text colour to ensure sufficient contrast between text and background - Use
bg-zev-purplewithtext-whitecolour to ensure sufficient contrast between text and background - The
panel-zev-purpleorpanel-zev-greenclass must be accompanied with a fall back colour such aspanel-default - The
btn-zev-purpleorbtn-zev-greenclass must be accompanied with a fall back colour such asbtn-default
Accessibility statement
These colours meet the colour contrast requirements as outlined in WCAG 2.1 AA Success Criterion 1.4.3: Contrast (Minimum). Tested by Eric Goodwin, eric.goodwin at nrcan-rncan.gc.ca. 2023-04-18. See the compliance notes regarding the risk of using these colours to convey meaningPage details
- Date modified: