fix(project): 홈 화면도 화면 끝까지 사용 + 프로젝트 상세 내 업무 스크롤 안 되던 문제 수정

- .erp-page 폭 제한 해제 범위를 프로젝트 상세뿐 아니라 프로젝트 모듈의
  모든 화면(.pj-wrap)으로 넓혀 홈 화면 "내 업무"도 화면 맨 오른쪽에 붙게.
- pj-layout에 grid-template-rows:minmax(0,1fr) 추가. 이게 없으면 암시적
  행이 auto(내용 크기)로 잡혀 자식의 height:100%가 기준 삼을 확정된
  높이가 없어지고, 결국 다시 내용 크기만큼 늘어나 버려 세션 화면에서
  "내 업무" 패널이 스크롤 대신 페이지 전체를 늘렸다.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
2026-09-15 23:16:09 +09:00
parent ecd4bd829e
commit 0a427be054
4 changed files with 14 additions and 6 deletions
+11 -3
View File
@@ -135,10 +135,18 @@
그대로 쓰기 위해 휴가/쿠팡 모듈과 같은 패턴으로 .erp-page 의 flex 자식을
늘려 남은 높이를 다 차지하게 하고, 가운데 폭 제한(max-width:1550px)도
이 화면에서만 풀어서 좌/우 칸이 진짜 화면 양 끝에 붙게 한다. */
.erp-page:has(> .pj-project-view) { max-width: none; }
.erp-page:has(> .pj-wrap) { max-width: none; }
.pj-project-view { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
.pj-project-view .pj-layout { flex: 1 1 auto; min-height: 0; }
.pj-layout { display: grid; grid-template-columns: 230px 1fr 300px; gap: 22px; height: 100%; min-height: 0; align-items: stretch; }
/* grid-template-rows: minmax(0,1fr) 이 없으면 암시적 행이 "auto"(내용 크기)로
잡혀서, 자식들의 height:100% 가 기준으로 삼을 "확정된 높이"가 없어진다
(퍼센트 높이는 트랙이 auto면 무시되고 다시 내용 크기로 되돌아간다) —
그래서 내 업무/좌측 목록이 제 안에서 스크롤 못 하고 카드 내용만큼
늘어나 버렸다. 1fr 로 행 자체를 컨테이너 높이만큼 확정 지어야 한다. */
.pj-layout {
display: grid; grid-template-columns: 230px 1fr 300px; grid-template-rows: minmax(0, 1fr);
gap: 22px; height: 100%; min-height: 0; align-items: stretch;
}
.pj-side { min-width: 0; min-height: 0; height: 100%; overflow-y: auto; padding-right: 4px; }
.pj-main { min-width: 0; min-height: 0; height: 100%; display: flex; flex-direction: column; }
.pj-project-mytasks { min-width: 0; min-height: 0; width: 300px; height: 100%; overflow-y: auto; padding-right: 4px; }
@@ -147,7 +155,7 @@
.pj-project-mytasks { display: none; }
}
@media (max-width: 900px) {
.erp-page:has(> .pj-project-view) { max-width: 1550px; }
.erp-page:has(> .pj-wrap) { max-width: 1550px; }
.pj-project-view { display: block; }
.pj-layout { display: block; height: auto; }
.pj-side, .pj-main { height: auto; overflow: visible; }