diff --git a/B03_FileInput/B03_FileInput_UI_Style.css b/B03_FileInput/B03_FileInput_UI_Style.css index 24ba87d1..ac1f2dcc 100644 --- a/B03_FileInput/B03_FileInput_UI_Style.css +++ b/B03_FileInput/B03_FileInput_UI_Style.css @@ -47,21 +47,25 @@ /* Wiza 스타일 가이드의 Lavender Glow 그라데이션 및 soft purple border hover */ /* 고르는 자리 한 줄 — [입력 파일 선택] · [임시 보관함] · [파일 업로드](2026-09-03). 좁아지면 아래로 접히되, 선택 영역이 남는 폭을 먹는다. */ +/* 셋을 같은 폭·같은 높이로 나눈다 — 열 1:1:1(2026-09-03 사용자 지시). + flex 로는 버튼·드롭존의 내용 폭이 배분에 섞여 288·254·288 로 어긋났다. 격자는 + 칸을 먼저 나누므로 내용과 무관하게 정확히 1:1:1 이 된다. 좁아지면 칸이 접힌다. */ .b03-file__pick-row { - display: flex; - flex-wrap: wrap; + display: grid; + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); align-items: stretch; gap: var(--spacing-8); } -.b03-file__pick-row .b03-file__dropzone { - flex: 1 1 320px; +.b03-file__pick-row > * { + min-width: 0; } -.b03-file__pick-row .b03-file__temp-picker, -.b03-file__pick-row .ui-btn { - flex: 0 0 auto; - align-self: stretch; +/* 칸을 꽉 채워야 세 칸의 높이가 같아진다 — 버튼은 기본이 내용 크기다. */ +.b03-file__pick-row .b03-file__temp-picker > .ui-btn, +.b03-file__pick-row > .ui-btn { + width: 100%; + height: 100%; } /* 한 줄 바(2026-09-03) — 종전 160px 블록은 안내 문구를 담느라 컸다. 문구는 좌측 @@ -109,11 +113,16 @@ color: var(--color-slate, #615e6e); } +/* 빈 오류 줄이 자리를 잡고 있으면 토글 아래가 통째로 비어 보인다 — 글자가 있을 때만 + 자리를 차지한다(2026-09-03 사용자 지시). */ .b03-file__error { - min-height: var(--spacing-16); color: var(--color-danger, #dc2626); font-size: var(--text-body-sm, 14px); - margin: var(--spacing-8) 0; + margin: 0; +} + +.b03-file__error:empty { + display: none; } .b03-file__resume {