diff --git a/src/renderer/components/item-list/item-detail-list/item-detail.module.css b/src/renderer/components/item-list/item-detail-list/item-detail.module.css index d08ec688f..043ec6e41 100644 --- a/src/renderer/components/item-list/item-detail-list/item-detail.module.css +++ b/src/renderer/components/item-list/item-detail-list/item-detail.module.css @@ -164,6 +164,28 @@ opacity: 0.5; } +.track-row.track-row-hover-highlight-enabled { + position: relative; +} + +.track-row.track-row-hover-highlight-enabled .track-cell { + position: relative; + z-index: 2; +} + +.track-row.track-row-hover-highlight-enabled:hover::before { + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + z-index: 1; + pointer-events: none; + content: ''; + background-color: var(--theme-colors-surface); + opacity: 0.7; +} + .skeleton-image { width: 100%; aspect-ratio: 1; diff --git a/src/renderer/components/item-list/item-detail-list/item-detail.tsx b/src/renderer/components/item-list/item-detail-list/item-detail.tsx index f717ea5cb..e499d6a7b 100644 --- a/src/renderer/components/item-list/item-detail-list/item-detail.tsx +++ b/src/renderer/components/item-list/item-detail-list/item-detail.tsx @@ -55,6 +55,7 @@ interface RowData { columnWidthPercents: number[]; controls?: ItemControls; data: unknown[]; + enableRowHoverHighlight: boolean; getItem?: (index: number) => unknown; internalState: ItemListStateActions; isMutatingFavorite: boolean; @@ -67,6 +68,7 @@ interface TrackRowProps { columns: ItemTableListColumnConfig[]; columnWidthPercents: number[]; controls?: ItemControls; + enableRowHoverHighlight: boolean; internalState: ItemListStateActions; isMutatingFavorite: boolean; onFavoriteClick: (song: Song) => void; @@ -83,6 +85,7 @@ const TrackRow = memo( columns, columnWidthPercents, controls, + enableRowHoverHighlight, internalState, isMutatingFavorite, onFavoriteClick, @@ -186,6 +189,7 @@ const TrackRow = memo(