yaleux/yaleui

Visual focus fix is not applied to keyboard interaction

Closed this issue · 2 comments

The override of foundation removing the outline from elements on focus is only applied to mouse interaction, leaving keyboard users without any indication of the active element:

yaleui/src/assets/scss/_visual-focus-fix.scss

[data-whatinput='mouse'] *:focus {
  outline: auto !important; }

Thanks so much for pointing this out. Can you provide steps to reproduce? I'm not 100% sure what I should be looking for.

@gapple, the visual focus fix is applied to mouse interactions because those were the instances were outline: 0 was enforced by Foundation. We're just overwriting their defaults; they never set outline: 0 to keyboard interactions, so this should be ok!

Closing this issue, but please let us know if you found any occasion where keyboard interactions don't have visual focus.