Bump govuk frontend to v6

[tombye]

What’s changed

This bumps the version of Design System (GOV.UK Frontend) used by this gem to V6 and packages it up as a beta release, to allow downstream projects time to try it out.

Identifying a user need

Public documentation should have the GOV.UK brand, so users get confirmation they're looking at the right thing because it matches both the service and www.gov.uk. Non-public documentation should be consistent with other docs, as much as possible, for similar reasons.

Notes for reviewers

Because the new branding style, which moves the header links to a service navigation component below the GOV.UK logo, is now mandatory, I'm calling this a major version bump.

Other than those changes, the other things changed are:

• the introduction of a new colour palette
• the removal of the 14px font size
• the footer links being changed to match all other links in the page

Examples of downstream projects with this version of the gem

Based on the spreadsheet of tech docs using the tech docs gem across GDS

GDS Way

WCAG Primer

[jamescarr28]

@tombye - looks good mostly, however on the mobile-wallet-tech-docs the service links don't highlight the active section correctly:

Section highlighted

Next section not highlighted

This is possibly due to custom layouts applied to the create the table of contents?

[tombye]

@jamescarr28 I managed to get your docs running locally so can see what you mean. I can see the same thing happening on the current prod site: https://docs.wallet.service.gov.uk/ too. Digging in the code, it's the use of the active_page method in the _service_navigation.rb, which was the same when in the old header code.

There's a bit in the logic where the current_page.path is compared to the header link path. This works if the HTML file for your page is the same as its route, like issue-credentials.html for /issue-credentials, as it is on the example site in the gem. But your pages are all organised in named folders, like issue-credentials/index.html so the logic breaks.

It seems sensible to extend the active_page logic, seeing as middleman allows the structure you're using but I'd suggest doing it outside of this PR if possible.

[jamescarr28]

@jamescarr28 I managed to get your docs running locally so can see what you mean. I can see the same thing happening on the current prod site: https://docs.wallet.service.gov.uk/ too. Digging in the code, it's the use of the active_page method in the _service_navigation.rb, which was the same when in the old header code.

There's a bit in the logic where the current_page.path is compared to the header link path. This works if the HTML file for your page is the same as its route, like issue-credentials.html for /issue-credentials, as it is on the example site in the gem. But your pages are all organised in named folders, like issue-credentials/index.html so the logic breaks.

It seems sensible to extend the active_page logic, seeing as middleman allows the structure you're using but I'd suggest doing it outside of this PR if possible.

@tombye - yeah completely understand, not something to fix as part of this - only highlighted as an example of teams maybe wanting some lead in time (in the new service navigation this is a much more obvious bug than the old one 😄 )

[jamescarr28]

@tombye - I don't seem to have permission to approve - but I'm happy that this is good to go in once we've given people a chance to check it works for them. I'd say 4 weeks should be enough if @NathanD-GDS agrees? I'd say Monday 19th April looks good

[kr8n3r]

this is a marked as a major version so dependency update tools will not auto-upgrade it.
Teams that use this this gem will be able to evaluate, test and make changes in their own timeframe