Highlight virtual rows on hover

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

src/renderer/components/list/table-theme.module.scss

@@ -54,4 +54,22 @@
     text-overflow: ellipsis;
     white-space: nowrap;
   }
+
+  // Virtual table styles
+  tbody > div {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    display: flex;
+    padding: 0 calc(var(--padding) * 2);
+
+    &:hover {
+      background-color: var(--tableBgcSelected);
+    }
+
+    > div {
+      padding: 4px 0;
+    }
+  }
 }

src/renderer/components/table/virtual-table-header.module.scss

@@ -3,6 +3,7 @@
 
   tr {
     display: flex;
+    padding: 0 16px;
   }
 
   th {

src/renderer/components/table/virtual-table.tsx

@@ -25,7 +25,7 @@ import { prevDefault } from "../../utils";
     estimateSize: () => 55,
     overscan: 5,
     count: rows.length,
-    paddingStart: 50 // header width
+    paddingStart: 50 // header height
   })
 
   return (
@@ -46,12 +46,7 @@ import { prevDefault } from "../../utils";
                   key={virtualRow.index}
                   ref={virtualRow.measureElement}
                   style={{
-                    position: 'absolute',
-                    top: 0,
-                    left: 0,
-                    width: '100%',
                     transform: `translateY(${virtualRow.start}px)`,
-                    display: 'flex',
                     cursor: onRowClick ? 'pointer' : 'default',
                   }}
                   onClick={prevDefault(() => onRowClick?.(row.original))}