Fleet UI: Remove blue click flash on clickable table rows#49228
Conversation
Removed the .single-row:active blue background that briefly highlighted a row on mouse-down, making clicked rows look like a stuck default/un- themed selected state.
There was a problem hiding this comment.
Warning
- Copilot's review of this pull request may be incomplete because some of the changed files are excluded by your Copilot content exclusion settings. See Excluding content from Copilot for details.
Pull request overview
Removes the unintended “blue flash” active-state styling when clicking clickable rows in Fleet’s shared DataTable, aligning click feedback with the intended theming on My device > Policies (and any other surfaces using the same row styling).
Changes:
- Removed the
.single-row:activebackground color override that caused the mis-themed highlight on click. - Preserved hover affordance (pointer cursor + hover background) and keyboard focus styling (
:focus-visibleoutline).
Reviewed changes
Copilot reviewed 1 out of 2 changed files in this pull request and generated no comments.
| File | Description |
|---|---|
| frontend/components/TableContainer/DataTable/_styles.scss | Drops the :active background override so clicked rows no longer flash the vibrant blue color. |
| changes/47530-my-device-policy-click-highlight | Release note / changelog entry (content excluded by policy from review). |
Files excluded by content exclusion policy (1)
- changes/47530-my-device-policy-click-highlight
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Match the outline width used by the link mixin's focus-visible so keyboard focus on clickable rows doesn't look heavier than focus on other interactive elements.
WalkthroughRemoved the blue active-state background from single-select data table rows and reduced the focus-visible outline thickness. Hover behavior remains unchanged, including the pointer cursor. This prevents the background flash when clicking rows such as policies on the My device page. 🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
Issue
Closes #47530
Description
.single-row:activesetbackground-color: $ui-vibrant-blue-10, so clicking a row (e.g., a policy on My device > Policies) briefly flashed a pale purple/blue background in light mode and a dark navy in dark mode. It read as a stuck default/un-themed selected state.:activerule. Hover still showscursor: pointerand the off-white row background, so click affordance is preserved without the mis-themed flash.:focus-visibleoutline from 2px to 1px so keyboard focus on clickable rows matches the outline width used elsewhere (link mixin's:focus-visible).Screenrecording
Screen.Recording.2026-07-13.at.11.17.10.AM.mov
Screen.Recording.2026-07-13.at.11.18.20.AM.mov
Testing
Summary by CodeRabbit