mirror of
https://github.com/jeffvli/feishin.git
synced 2026-05-07 04:20:12 +02:00
remove horizontal padding from favorite/rating/actions
This commit is contained in:
@@ -246,6 +246,11 @@
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.row .track-cell-no-h-padding {
|
||||
padding-right: 0;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.track-row-dragging {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
@@ -32,6 +32,7 @@ import { parseTableColumns } from '/@/renderer/components/item-list/helpers/pars
|
||||
import { getDetailListCellComponent } from '/@/renderer/components/item-list/item-detail-list/columns';
|
||||
import {
|
||||
getTrackColumnFixed,
|
||||
isNoHorizontalPaddingColumn,
|
||||
shouldShowHoverOnlyColumnContent,
|
||||
} from '/@/renderer/components/item-list/item-detail-list/utils';
|
||||
import {
|
||||
@@ -250,6 +251,7 @@ const TrackRow = memo(
|
||||
const CellComponent = getDetailListCellComponent(col.id);
|
||||
const isTitleColumn = col.id === TableColumn.TITLE;
|
||||
const isImageColumn = col.id === TableColumn.IMAGE;
|
||||
const isIconActionColumn = isNoHorizontalPaddingColumn(col.id);
|
||||
const showHoverContent = shouldShowHoverOnlyColumnContent(
|
||||
col.id,
|
||||
isRowHovered,
|
||||
@@ -278,6 +280,7 @@ const TrackRow = memo(
|
||||
className={clsx(styles.trackCell, {
|
||||
[styles.trackCellImage]: isImageColumn,
|
||||
[styles.trackCellMuted]: !isTitleColumn,
|
||||
[styles.trackCellNoHPadding]: isIconActionColumn,
|
||||
[styles.trackCellVerticalBorderVisible]:
|
||||
enableVerticalBorders && !isLastColumn,
|
||||
[styles.trackCellWithVerticalBorder]: !isLastColumn,
|
||||
|
||||
@@ -1,10 +1,10 @@
|
||||
import { TableColumn } from '/@/shared/types/types';
|
||||
|
||||
const FIXED_TRACK_COLUMN_WIDTHS: Partial<Record<TableColumn, number>> = {
|
||||
[TableColumn.ACTIONS]: 48,
|
||||
[TableColumn.ACTIONS]: 32,
|
||||
[TableColumn.TRACK_NUMBER]: 56,
|
||||
[TableColumn.USER_FAVORITE]: 48,
|
||||
[TableColumn.USER_RATING]: 76,
|
||||
[TableColumn.USER_FAVORITE]: 32,
|
||||
[TableColumn.USER_RATING]: 64,
|
||||
};
|
||||
|
||||
const HOVER_ONLY_COLUMNS: TableColumn[] = [
|
||||
@@ -13,6 +13,12 @@ const HOVER_ONLY_COLUMNS: TableColumn[] = [
|
||||
TableColumn.USER_RATING,
|
||||
];
|
||||
|
||||
const NO_HORIZONTAL_PADDING_COLUMNS: TableColumn[] = [
|
||||
TableColumn.ACTIONS,
|
||||
TableColumn.USER_FAVORITE,
|
||||
TableColumn.USER_RATING,
|
||||
];
|
||||
|
||||
export function getTrackColumnFixed(columnId: TableColumn): {
|
||||
fixedWidth: number;
|
||||
isFixedColumn: boolean;
|
||||
@@ -23,6 +29,10 @@ export function getTrackColumnFixed(columnId: TableColumn): {
|
||||
: { fixedWidth: 0, isFixedColumn: false };
|
||||
}
|
||||
|
||||
export function isNoHorizontalPaddingColumn(columnId: TableColumn): boolean {
|
||||
return NO_HORIZONTAL_PADDING_COLUMNS.includes(columnId);
|
||||
}
|
||||
|
||||
export function isTrackColumnHoverOnly(columnId: TableColumn): boolean {
|
||||
return HOVER_ONLY_COLUMNS.includes(columnId);
|
||||
}
|
||||
|
||||
@@ -26,6 +26,11 @@
|
||||
padding: var(--theme-spacing-xs) var(--theme-spacing-xl);
|
||||
}
|
||||
|
||||
.container.no-horizontal-padding {
|
||||
padding-right: 0;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.container.center {
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
@@ -205,6 +210,11 @@
|
||||
padding: 0 var(--theme-spacing-xl);
|
||||
}
|
||||
|
||||
.header-container.no-horizontal-padding {
|
||||
padding-right: 0;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.header-dragging {
|
||||
cursor: grabbing;
|
||||
opacity: 0.5;
|
||||
|
||||
@@ -26,6 +26,7 @@ import styles from './item-table-list-column.module.css';
|
||||
|
||||
import i18n from '/@/i18n/i18n';
|
||||
import { useItemSelectionState } from '/@/renderer/components/item-list/helpers/item-list-state';
|
||||
import { isNoHorizontalPaddingColumn } from '/@/renderer/components/item-list/item-detail-list/utils';
|
||||
import { ActionsColumn } from '/@/renderer/components/item-list/item-table-list/columns/actions-column';
|
||||
import { AlbumArtistsColumn } from '/@/renderer/components/item-list/item-table-list/columns/album-artists-column';
|
||||
import { AlbumColumn } from '/@/renderer/components/item-list/item-table-list/columns/album-column';
|
||||
@@ -479,6 +480,7 @@ export const TableColumnTextContainer = (
|
||||
[styles.dragging]: isDataRow && isDragging,
|
||||
[styles.large]: props.size === 'large',
|
||||
[styles.left]: props.columns[props.columnIndex].align === 'start',
|
||||
[styles.noHorizontalPadding]: isNoHorizontalPaddingColumn(props.type),
|
||||
[styles.paddingLg]: props.cellPadding === 'lg',
|
||||
[styles.paddingMd]: props.cellPadding === 'md',
|
||||
[styles.paddingSm]: props.cellPadding === 'sm',
|
||||
@@ -632,6 +634,7 @@ export const TableColumnContainer = (
|
||||
[styles.dragging]: isDataRow && isDragging,
|
||||
[styles.large]: props.size === 'large',
|
||||
[styles.left]: props.columns[props.columnIndex].align === 'start',
|
||||
[styles.noHorizontalPadding]: isNoHorizontalPaddingColumn(props.type),
|
||||
[styles.paddingLg]: props.cellPadding === 'lg',
|
||||
[styles.paddingMd]: props.cellPadding === 'md',
|
||||
[styles.paddingSm]: props.cellPadding === 'sm',
|
||||
@@ -850,6 +853,7 @@ export const TableColumnHeaderContainer = (
|
||||
[styles.headerDraggedOverLeft]: isDraggedOver === 'left',
|
||||
[styles.headerDraggedOverRight]: isDraggedOver === 'right',
|
||||
[styles.headerDragging]: isDragging,
|
||||
[styles.noHorizontalPadding]: isNoHorizontalPaddingColumn(props.type),
|
||||
[styles.paddingLg]: props.cellPadding === 'lg',
|
||||
[styles.paddingMd]: props.cellPadding === 'md',
|
||||
[styles.paddingSm]: props.cellPadding === 'sm',
|
||||
|
||||
Reference in New Issue
Block a user