GCDS: Header - Githubissues

cds-snc / platform-forms-client

NextJS application that serves the public-facing website for Forms

https://forms-staging.cdssandbox.xyz/

MIT License

34 stars 13 forks source link

GCDS: Header #4320

Open samsadasivan opened 1 month ago

samsadasivan commented 1 month ago

Language toggle focus state has no fill + white text to go with outline
Hover state should increase underline thickness
Language toggle typography doesn't match

DESKTOP

Forms: Font Size = 18px , Line height = 28px (approx 155.555%)
GCDS: Font Size = 20px , Line Height = 24px (120%)

MOBILE

Forms: Font Size = 18px , Line height = 28px (approx 155.555%)
GCDS: Font Size = 16px , Line Height = 24px (150%)
- Layout switches to single column
Layout doesn't scale down the same way as GCDS
Fonts don't scale
Language toggle doesn't switch to abbreviated version on mobile

COLOUR

Forms (rest): #284162
GCDS (rest): #2B4380
Forms (hover): #0535D2
GCDS (hover): #0535D2

Current state

Desired state

samsadasivan commented 1 month ago

NOTE GC Forms allows clients to add their own branding/FIP