fix: 테이블 리스트 불필요한 스크롤 및 하단 공간 문제 해결

문제:
- 고정 높이 (h-[400px] sm:h-[500px])로 인해 데이터가 적어도 큰 공간 차지
- 하단에 빈 공간이 남는데도 스크롤이 생기는 비효율적인 UX
- overflow-y-scroll이 항상 스크롤바를 표시함

해결:
- 고정 높이 제거 → flex-1 (부모의 남은 공간 차지)
- overflow-y-scroll → overflow-y-auto (필요할 때만 스크롤)
- 데이터 양에 따라 자동으로 높이 조정

개선 사항:
 데이터가 적을 때: 불필요한 공간 없이 컴팩트하게 표시
 데이터가 많을 때: 자동으로 스크롤 생성
 반응형 레이아웃에 자연스럽게 적응
 스크롤바가 필요할 때만 표시되어 깔끔한 UI
This commit is contained in:
kjs 2025-11-06 11:53:59 +09:00
parent 310f43e1bd
commit ff2a069b79
1 changed files with 1 additions and 1 deletions

View File

@ -1579,7 +1579,7 @@ export const TableListComponent: React.FC<TableListComponentProps> = ({
>
{/* 스크롤 영역 */}
<div
className="w-full max-w-full h-[400px] overflow-y-scroll overflow-x-auto bg-background sm:h-[500px]"
className="w-full max-w-full flex-1 overflow-y-auto overflow-x-auto bg-background"
>
{/* 테이블 */}
<table