fleet
fleet copied to clipboard
fleetdm
Inconsistent hover state on select and input elements
Fleet version: (head to the "My account" page in the Fleet UI or run fleetctl --version) main
Operating system: (e.g. macOS 11.2.3) macOS
Web browser: (e.g. Chrome 88.0.4324) Chrome
🧑💻 Expected behavior
When hovering over these UI elements, I expect consistent hover effect.
💥 Actual behavior
Three different hovers.
Slight gray border on dropdown menu:
Purple border on react-select elements:
No border change on input elements:
More info
Propose: Purple border on hover for all three of these elements.
See Loom for before/after. Dogfood shows old state, localhost shows proposed new state.
https://www.loom.com/share/463c0f86d29c45e183f86fa513ddd592
Propose: Purple border on hover for all three of these elements.
@mike-j-thomas what do you think the hover behavior should be? Above is Luke's proposed behavior.
@mike-j-thomas what do you think the hover behavior should be? Above is Luke's proposed behavior.
@mike-j-thomas pinging you again :)
@lukeheath I assigned you this issue and moved it to in progress on the release board. I noticed that your PR addresses this issue: #7677
@noahtalerman, @lukeheath's proposal looks great 🔥 Apologies for missing this.
@lukeheath When testing this it appears that drop down menu (Online/Offline/New hosts) does not highlight when hovered over on Firefox 105+. The hover effect is working correctly in all other circumstances across all browsers.
@xpkoala Okay should work on Firefox now. I also added the hover border color change to the input elements on the login page.
As part of this PR I also corrected the size of the external link icon on the forgot password confirmation screen (it was too large):
