Building a sidenav component with Adam Argyle

There was so much Adam did that was intuitive, instead of remixing it so much, I followed the most instructions so i could learn. Learnt to use :matches()

Overview:It's tough building a responsive navigation system. Some users will be on a keyboard, some will have powerful desktops, and some will visit from a small mobile device. Everyone visiting should be able to open and close the menu.
See Here for full article

Web Tactics

In this component exploration Adam had the joy of combining a few critical web platform features:

  • CSS :target
  • CSS grid
  • CSS transforms
  • CSS Media Queries for viewport and user preference
  • JS for focus UX enhancements