diff --git a/app/static/erp-shell.css b/app/static/erp-shell.css index 8a5d3b8..f096cb8 100644 --- a/app/static/erp-shell.css +++ b/app/static/erp-shell.css @@ -285,18 +285,23 @@ body.erp-app-body { background: var(--color-canvas-white); height: 100vh; overfl /* ── 반응형 ── */ @media (max-width: 900px) { - /* 데스크탑 접힘(:has collapsed) 규칙보다 특이도 맞춰 모바일에서 사이드바 칸 0 강제 */ + /* 모바일: grid 자체 해제(데스크탑 collapsed :has 규칙과의 특이도 싸움 회피). + 사이드바는 흐름 밖 떠있는 오버레이, 본문은 풀폭 block. */ + body.erp-app-body { height: auto; overflow: auto; } .erp-app, - .erp-app:has(.erp-sidebar[data-collapsed="true"]) { grid-template-columns: 0 1fr; } + .erp-app:has(.erp-sidebar[data-collapsed="true"]) { display: block; } .erp-sidebar { - position: fixed; left: 0; top: 0; height: 100vh; + position: fixed; left: 0; top: 0; height: 100vh; z-index: 1000; width: var(--erp-sidebar-w); transform: translateX(-100%); transition: transform .2s ease; box-shadow: 0 0 0 1px var(--color-subtle-ash); } + /* 모바일선 데스크탑 접힘 무시 — 메뉴 열면 풀폭으로 */ + .erp-sidebar[data-collapsed="true"] { width: var(--erp-sidebar-w); } .erp-sidebar.is-open { transform: translateX(0); } .erp-sidebar-mobile-toggle { display: inline-flex; } + .erp-content { width: 100%; min-width: 0; } .erp-form-grid { grid-template-columns: 1fr 1fr; } .erp-field-wide { grid-column: span 2; } } diff --git a/app/templates/erp_base.html b/app/templates/erp_base.html index ec69a5a..dd6f5b9 100644 --- a/app/templates/erp_base.html +++ b/app/templates/erp_base.html @@ -4,8 +4,8 @@