diff --git a/frontend/components/common/ScreenModal.tsx b/frontend/components/common/ScreenModal.tsx index 2f6ae80f..746c85f1 100644 --- a/frontend/components/common/ScreenModal.tsx +++ b/frontend/components/common/ScreenModal.tsx @@ -531,26 +531,34 @@ export const ScreenModal: React.FC = ({ className }) => { return { className: "w-fit min-w-[400px] max-w-4xl max-h-[90vh] overflow-hidden p-0", style: undefined, // undefined로 변경 - defaultWidth/defaultHeight 사용 + needsScroll: false, }; } // 화면관리에서 설정한 크기 = 컨텐츠 영역 크기 - // 실제 모달 크기 = 컨텐츠 + 헤더 + 연속등록 체크박스 - // 🔧 여백 최소화: 디자이너와 일치하도록 조정 + // 실제 모달 크기 = 컨텐츠 + 헤더 + 연속등록 체크박스 + gap + 패딩 + // 🔧 DialogContent의 gap-4 (16px × 2) + 컨텐츠 pt-6 (24px) 포함 const headerHeight = 48; // DialogHeader (타이틀 + border-b + py-3) const footerHeight = 44; // 연속 등록 모드 체크박스 영역 + const dialogGap = 32; // gap-4 × 2 (header-content, content-footer 사이) + const contentTopPadding = 24; // pt-6 (컨텐츠 영역 상단 패딩) const horizontalPadding = 16; // 좌우 패딩 최소화 - const totalHeight = screenDimensions.height + headerHeight + footerHeight; + const totalHeight = screenDimensions.height + headerHeight + footerHeight + dialogGap + contentTopPadding; + const maxAvailableHeight = window.innerHeight * 0.95; + + // 콘텐츠가 화면 높이를 초과할 때만 스크롤 필요 + const needsScroll = totalHeight > maxAvailableHeight; return { className: "overflow-hidden p-0", style: { width: `${Math.min(screenDimensions.width + horizontalPadding, window.innerWidth * 0.98)}px`, - height: `${Math.min(totalHeight, window.innerHeight * 0.95)}px`, + // 🔧 height 대신 max-height만 설정 - 콘텐츠가 작으면 자동으로 줄어듦 + maxHeight: `${maxAvailableHeight}px`, maxWidth: "98vw", - maxHeight: "95vh", }, + needsScroll, }; }; @@ -634,7 +642,7 @@ export const ScreenModal: React.FC = ({ className }) => {
{loading ? (
diff --git a/frontend/components/ui/select.tsx b/frontend/components/ui/select.tsx index 81e90fd3..64fef9c4 100644 --- a/frontend/components/ui/select.tsx +++ b/frontend/components/ui/select.tsx @@ -22,18 +22,25 @@ function SelectTrigger({ className, size = "xs", children, + style, ...props }: React.ComponentProps & { size?: "xs" | "sm" | "default"; }) { + // className에 h-full/h-[ 또는 style.height가 있으면 data-size 높이를 무시 + const hasCustomHeight = className?.includes("h-full") || className?.includes("h-[") || !!style?.height; + return ( {children} diff --git a/frontend/components/v2/V2Date.tsx b/frontend/components/v2/V2Date.tsx index 7e930840..91a4cf5d 100644 --- a/frontend/components/v2/V2Date.tsx +++ b/frontend/components/v2/V2Date.tsx @@ -222,14 +222,14 @@ const RangeDatePicker = forwardRef< ); return ( -
+
{/* 시작 날짜 */}