sparkbox / bouncy-ball

:red_circle: Compare web animation techniques by bouncing a ball with each one.
https://sparkbox.github.io/bouncy-ball
MIT License
605 stars 66 forks source link

feat(accessibility): enable tab navigation with focus states. #63

Closed bryanbraun closed 4 years ago

bryanbraun commented 4 years ago

This required refactoring away from using radio buttons as the navigation items.

I included a '.no-focus' body class to prevent focus rings on click for the "docs toggle." It also addressed a weird situation where an initial page load with a nav-item's id in the url caused it to show a focus ring by default (which I didn't want). I still don't know why it was doing that, but I think it must be some browser's defaut behavior when the "jump to id" element is a link.

Fixes sparkbox/bouncy-ball#62