fix(pivot-table): set padding on hoverable div instead of container th

dhis2 · Sep 14, 2023 · 9aa8776 · 9aa8776
1 parent 6a716b1
commit 9aa8776
Showing 1 changed file with 14 additions and 0 deletions.
diff --git a/src/components/PivotTable/styles/PivotTable.style.js b/src/components/PivotTable/styles/PivotTable.style.js
@@ -112,13 +112,27 @@ export const cell = css`
     .title-cell {
         font-weight: bold;
         background-color: #cddaed;
+        padding-top: 0;
+        padding-bottom: 0;
     }
     .title-cell-content {
         text-align: center;
         white-space: nowrap;
         overflow: hidden;
         text-overflow: ellipsis;
     }
+    .title-cell.displaydensity-COMPACT > .title-cell-content {
+        padding-top: ${DISPLAY_DENSITY_PADDING_COMPACT}px;
+        padding-bottom: ${DISPLAY_DENSITY_PADDING_COMPACT}px;
+    }
+    .title-cell.displaydensity-NORMAL > .title-cell-content {
+        padding-top: ${DISPLAY_DENSITY_PADDING_NORMAL}px;
+        padding-bottom: ${DISPLAY_DENSITY_PADDING_NORMAL}px;
+    }
+    .title-cell.displaydensity-COMFORTABLE > .title-cell-content {
+        padding-top: ${DISPLAY_DENSITY_PADDING_COMFORTABLE}px;
+        padding-bottom: ${DISPLAY_DENSITY_PADDING_COMFORTABLE}px;
+    }
     .row-header {
         background-color: #dae6f8;
     }