UKHomeOffice / design-system

Home Office Design System
https://design.homeoffice.gov.uk
76 stars 22 forks source link

Clicking a code tab refreshes the page and resets focus #234

Closed kitation closed 3 years ago

kitation commented 4 years ago

Page https://hods-poc.netlify.app/components?name=Footer

When clicking on the HTML or React tab, the page refreshes and the focus goes back to the top of the page. This means a keyboard user would need to navigate all the way back down to see the other code tab. When I do the same thing on the gov.uk page, the focus stays on the tab I clicked as expected

daniel-ac-martin commented 3 years ago

@kitation: I've re-worked this stuff. Would you mind taking another look?

I've tried to make it work without JavaScript as much as possible but I might need to just get the JS version going.

If you have time, would you mind also taking a look at the version on https://not-govuk.netlify.app/components?name=Back%20link - that has the client-side JS running

kitation commented 3 years ago

@daniel-ac-martin The original issue is fixed but there are a couple of issues with the back link page, do you want me to raise those separately and close this one?

daniel-ac-martin commented 3 years ago

@kitation: Yes please! :-) (I'll close this one now, while I'm here.)