Update repository file tree row hover colors
What does this MR do and why?
Update repository file tree row hover colors
The repository file tree (tbody tr.tree-item) hover state currently uses the action-selected token family for its border, plus hard-coded gl-bg-blue-50 / dark:gl-bg-neutral-800 for the background. Per the @gitlab/ui token definitions, action-selected is reserved for persistently selected actions, while highlight-target is intended for "borders of temporarily targeted elements... distinct from persistent states". A hovered table row matches the latter.
This change:
- Replaces
--gl-action-selected-border-color-defaultwith--gl-highlight-target-border-colorfor the hover border and inset box-shadows. - Replaces the hard-coded background utilities with
--gl-highlight-target-background-color, which resolves toblue-50in light mode (visually identical) andblue-950in dark mode (intentional alignment with the hover semantic).
The hover border becomes a softer blue, and the dark-mode hover background shifts from a neutral grey to a dark blue tint.
Changelog: changed
References
Related: https://gitlab.com/gitlab-org/gitlab-services/design.gitlab.com/-/work_items/3438
Screenshots or screen recordings
| Before | After |
|---|---|
![]() |
![]() |
![]() |
![]() |
How to set up and validate locally
- Navigate to a repo file tree
- Hover one of the rows
MR acceptance checklist
Evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.



