fix: 테이블 그룹 헤더 스크롤 시 배경 비침 현상 수정

문제:
- 그룹 헤더의 bg-muted/50 (반투명 배경)으로 인해 스크롤 시 뒤 내용이 비쳐 보임
- sticky 위치에서 가독성 저하

해결:
- bg-muted/50 → bg-muted (불투명 배경)
- hover 효과도 hover:bg-muted → hover:bg-muted/80으로 조정
- 스크롤 시 깔끔한 가림 효과 제공

개선 사항:
- sticky 그룹 헤더의 완전한 배경 덮기
- 스크롤 시 가독성 향상
- shadcn 가이드라인 준수 (단색 배경)
This commit is contained in:
kjs 2025-11-06 11:52:43 +09:00
parent 4f02f0bad1
commit 310f43e1bd
1 changed files with 2 additions and 2 deletions

View File

@ -1755,11 +1755,11 @@ export const TableListComponent: React.FC<TableListComponentProps> = ({
<tr>
<td
colSpan={visibleColumns.length}
className="bg-muted/50 border-b border-border sticky top-[48px] z-[5]"
className="bg-muted border-b border-border sticky top-[48px] z-[5]"
style={{ top: "48px" }}
>
<div
className="flex items-center gap-3 p-3 cursor-pointer hover:bg-muted"
className="flex items-center gap-3 p-3 cursor-pointer hover:bg-muted/80"
onClick={() => toggleGroupCollapse(group.groupKey)}
>
{isCollapsed ? (