@easykit/design/src/components/uix/data-table/style.css

Easy kit design components

@import "../../../assets/style/theme.css";

.data-table {
  --sticky-row-hover-color: rgba(250, 250, 250, 1);
}

.dark .data-table {
  --sticky-row-hover-color: #1c1c1c;
}
.dark .data-table.in-card {
  --sticky-row-hover-color: #181818;
}

.data-table tr {
  @apply transition-none;
}

.data-table tr th.table-sticky-col,
.data-table tr td.table-sticky-col {
  @apply p-0;
}

.data-table tr th.table-sticky-col .inner,
.data-table tr td.table-sticky-col .inner {
  @apply bg-background;
}

.data-table.in-card tr th.table-sticky-col .inner,
.data-table.in-card tr td.table-sticky-col .inner {
  @apply bg-card;
}

.data-table tr:hover th.table-sticky-col .inner,
.data-table tr:hover td.table-sticky-col .inner {
  @apply bg-[var(--sticky-row-hover-color)];
}

.data-table tr[data-state="selected"] td.table-sticky-col .inner {
  @apply bg-[hsl(var(--muted))];
}