Thomas Camlong
fc0da8dedf
- Replace mantine-react-table with mantine-datatable for a cleaner, lighter table - Add right-click context menu with pause/resume/delete/copy actions - Add row expansion for inline detail view (replaces modal) - Implement responsive scaling based on widget width - Add footer filter panel with client and status filtering - Show status badges with color-coded indicators - Display speed indicators with icons in column cells - Add global ratio, total speeds, and item count in footer - Sort always enabled (removed confusing enableRowSorting toggle) - Reorder default columns to prioritize useful information - Update docs and translations
53 lines
1.5 KiB
CSS
53 lines
1.5 KiB
CSS
/* Make the DataTable transparent so the board card's opacity-controlled
|
|
background shows through. The mantine-datatable defaults to
|
|
var(--mantine-color-body) which is opaque. */
|
|
.downloads-table,
|
|
.downloads-table .mantine-datatable-table,
|
|
.downloads-table .mantine-datatable-table thead,
|
|
.downloads-table .mantine-datatable-table tbody,
|
|
.downloads-table .mantine-datatable-table tfoot,
|
|
.downloads-table th,
|
|
.downloads-table td {
|
|
background-color: transparent !important;
|
|
}
|
|
|
|
.downloads-table .mantine-datatable-table tr {
|
|
background-color: transparent;
|
|
}
|
|
|
|
.downloads-table .mantine-datatable-table tbody tr:hover {
|
|
background-color: color-mix(in srgb, var(--mantine-color-default-hover) 40%, transparent) !important;
|
|
}
|
|
|
|
.downloads-table th {
|
|
white-space: nowrap;
|
|
background-color: color-mix(in srgb, var(--mantine-color-body) 60%, transparent) !important;
|
|
backdrop-filter: blur(8px);
|
|
}
|
|
|
|
.downloads-table td {
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
.downloads-table td .mantine-Text-root,
|
|
.downloads-table td .mantine-Group-root {
|
|
white-space: nowrap;
|
|
flex-wrap: nowrap;
|
|
}
|
|
|
|
.downloads-table .mantine-datatable-header-cell-sortable-icon {
|
|
opacity: 0;
|
|
transition: opacity 150ms;
|
|
}
|
|
|
|
.downloads-table th:hover .mantine-datatable-header-cell-sortable-icon {
|
|
opacity: 1;
|
|
}
|
|
|
|
/* Row expansion styling */
|
|
.downloads-table .mantine-datatable-row-expansion-cell {
|
|
background-color: color-mix(in srgb, var(--mantine-color-body) 40%, transparent) !important;
|
|
}
|