* Improve keyboard a11y of header menu dropdown
This commit also includes some cleanup of unnecessary functions that seemed to degrade performance.
Closes https://github.com/forem/forem/issues/1154
* Add temporary focus style on navigation-button
* Put menu items in a list
* Adjust menu button based on VoiceOver testing
* Refactor menu logic to be reusable/work on touch
* Preserve admin link visibility
* Focus on first item on menu open
* Clean up some HTML and CSS
* Apply suggestions from code review
Co-authored-by: ludwiczakpawel <ludwiczakpawel@gmail.com>
* Ensure menu hides on click outside
* Rename toggle function and adjust formatting
* Update nav button focus style
* Clean up padding on header avatar focus style
* Make button show focus state for keyboard only
Using .focus-visible:focus targets keyboard focus and eliminates a flash of the blue border on click before focus is moved to the child item (which also has no focus style on mouse click)
* Update app/views/layouts/_top_bar.html.erb
Co-authored-by: ludwiczakpawel <ludwiczakpawel@gmail.com>
* Add some defensive programming
* Removed initializeTouchDevice from base.js.erb
* navigation-butt ID is now member-menu-button
* Moved all the logic from initializeTouchDevice.js into a pack file/utilities.
* committing re-ordered schema after setup
* add tests for initializeTouchDevice
* remove some unneeded html setup
* make sure menu doesn't close if user tabs back from sign out
* Revert "committing re-ordered schema after setup"
This reverts commit a41a1c861cca3b97d8a7b8a99268b8afaae9f028.
* optimized code
* small tweaks, only show outline when focused
Co-authored-by: ludwiczakpawel <ludwiczakpawel@gmail.com>
Co-authored-by: rhymes <rhymes@hey.com>
Co-authored-by: Nick Taylor <nick@dev.to>
Co-authored-by: Suzanne Aitchison <suzanne@forem.com>