Please note that UberMenu will only add a blue outline after the tab key is pressed. However, browsers (especially Chrome) also add outline focus states, so if you are seeing a blue outline on your items, that is likely the source. To remove the browser’s default focus outline, you can add this CSS, but be aware of the accessibility implications.
.ubermenu *:focus{
outline:none;
}
Note that if the theme is adding an outline style, you may require a higher specificity to override it.
UberMenu includes accessibility functionality which allows keyboard users to Tab through the menu. When using a keyboard, the focus state of the element is important in order to provide the user visual feedback as to the currently focused item.
The “blue glow” seen around an item at times is the visual signpost that that item currently has focus. Focus is given to a link both when tabbing to an item, as well as when an item is clicked.
If you would like to disable UberMenu’s accessibility features (which will eliminate the blue glow), you can do so in the UberMenu Control Panel > General Settings > Enable Accessibility Features.
If you would like to remove the glow (but keep the outline), you can use this CSS
.ubermenu-accessible .ubermenu-item .ubermenu-target:focus{
box-shadow:none !important;
}
If you would like to change the color of the outline, you can use
.ubermenu-accessible .ubermenu-item .ubermenu-target:focus{
outline:red 1px solid;
}
As of UberMenu 3.0.3, the blue focus state will only be triggered after the user presses the Tab key for the first time, which will reduce unnecessary displays of the hover state when the keyboard is not in use.