fix: 체크박스 컬럼 패딩 제거 및 중앙 정렬
- 체크박스 컬럼에서 px 패딩 제거 (px-0) - 체크박스 컬럼 중앙 정렬 (textAlign: center) - 일반 컬럼은 기존 패딩 유지 - 체크박스와 다른 컬럼의 시각적 구분 명확화 - 불필요한 공간 제거로 깔끔한 UI
This commit is contained in:
parent
6aa25fa852
commit
5376d7198d
|
|
@ -1062,11 +1062,12 @@ export const TableListComponent: React.FC<TableListComponentProps> = ({
|
|||
key={column.columnName}
|
||||
ref={(el) => (columnRefs.current[column.columnName] = el)}
|
||||
className={cn(
|
||||
"relative h-10 px-2 py-2 text-xs font-semibold text-foreground overflow-hidden text-ellipsis bg-background select-none sm:h-12 sm:px-6 sm:py-3 sm:text-sm sm:whitespace-nowrap",
|
||||
"relative h-10 text-xs font-semibold text-foreground overflow-hidden text-ellipsis bg-background select-none sm:h-12 sm:text-sm sm:whitespace-nowrap",
|
||||
column.columnName === "__checkbox__" ? "px-0 py-2" : "px-2 py-2 sm:px-6 sm:py-3",
|
||||
column.sortable && "cursor-pointer"
|
||||
)}
|
||||
style={{
|
||||
textAlign: column.align || "left",
|
||||
textAlign: column.columnName === "__checkbox__" ? "center" : (column.align || "left"),
|
||||
width: column.columnName === "__checkbox__" ? '48px' : (columnWidth ? `${columnWidth}px` : undefined),
|
||||
minWidth: column.columnName === "__checkbox__" ? '48px' : undefined,
|
||||
maxWidth: column.columnName === "__checkbox__" ? '48px' : undefined,
|
||||
|
|
@ -1194,10 +1195,11 @@ export const TableListComponent: React.FC<TableListComponentProps> = ({
|
|||
<td
|
||||
key={column.columnName}
|
||||
className={cn(
|
||||
"h-14 px-2 py-2 text-xs text-foreground overflow-hidden text-ellipsis sm:h-16 sm:px-6 sm:py-3 sm:text-sm sm:whitespace-nowrap"
|
||||
"h-14 text-xs text-foreground overflow-hidden text-ellipsis sm:h-16 sm:text-sm sm:whitespace-nowrap",
|
||||
column.columnName === "__checkbox__" ? "px-0 py-2" : "px-2 py-2 sm:px-6 sm:py-3"
|
||||
)}
|
||||
style={{
|
||||
textAlign: column.align || "left",
|
||||
textAlign: column.columnName === "__checkbox__" ? "center" : (column.align || "left"),
|
||||
width: column.columnName === "__checkbox__" ? '48px' : `${100 / visibleColumns.length}%`,
|
||||
minWidth: column.columnName === "__checkbox__" ? '48px' : undefined,
|
||||
maxWidth: column.columnName === "__checkbox__" ? '48px' : undefined,
|
||||
|
|
|
|||
Loading…
Reference in New Issue