fix(project): 보드 스크롤바가 마지막 세션 열을 가리던 문제 수정
pj-board 에 scrollbar-gutter:stable 적용 — 스크롤바 자리를 항상 미리 비워둬서, 매이슨리 열 너비를 계산하는 시점(clientWidth)과 실제 스크롤바 등장 시점이 어긋나 마지막 열이 스크롤바에 가려 보이던 문제 해결. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
@@ -1,7 +1,7 @@
|
|||||||
{% extends "erp_base.html" %}
|
{% extends "erp_base.html" %}
|
||||||
|
|
||||||
{% block head_extra %}
|
{% block head_extra %}
|
||||||
<link rel="stylesheet" href="/static/project.css?v=20260916j" />
|
<link rel="stylesheet" href="/static/project.css?v=20260916k" />
|
||||||
<link rel="stylesheet" href="/static/vendor/material-symbols/material-symbols.css" />
|
<link rel="stylesheet" href="/static/vendor/material-symbols/material-symbols.css" />
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
{% extends "erp_base.html" %}
|
{% extends "erp_base.html" %}
|
||||||
|
|
||||||
{% block head_extra %}
|
{% block head_extra %}
|
||||||
<link rel="stylesheet" href="/static/project.css?v=20260916j" />
|
<link rel="stylesheet" href="/static/project.css?v=20260916k" />
|
||||||
<link rel="stylesheet" href="/static/vendor/material-symbols/material-symbols.css" />
|
<link rel="stylesheet" href="/static/vendor/material-symbols/material-symbols.css" />
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
{% extends "erp_base.html" %}
|
{% extends "erp_base.html" %}
|
||||||
|
|
||||||
{% block head_extra %}
|
{% block head_extra %}
|
||||||
<link rel="stylesheet" href="/static/project.css?v=20260916j" />
|
<link rel="stylesheet" href="/static/project.css?v=20260916k" />
|
||||||
<!-- 구글 머티리얼 심볼(담당자 아이콘 등) — self-host -->
|
<!-- 구글 머티리얼 심볼(담당자 아이콘 등) — self-host -->
|
||||||
<link rel="stylesheet" href="/static/vendor/material-symbols/material-symbols.css" />
|
<link rel="stylesheet" href="/static/vendor/material-symbols/material-symbols.css" />
|
||||||
<!-- 타임라인 vis-timeline — self-host -->
|
<!-- 타임라인 vis-timeline — self-host -->
|
||||||
|
|||||||
@@ -221,7 +221,14 @@
|
|||||||
높이를 정해준다). pj-board-canvas = 매이슨리 절대배치 캔버스 — 스크롤
|
높이를 정해준다). pj-board-canvas = 매이슨리 절대배치 캔버스 — 스크롤
|
||||||
컨테이너 자체 높이와 콘텐츠(캔버스) 높이 계산을 분리해야 스크롤이
|
컨테이너 자체 높이와 콘텐츠(캔버스) 높이 계산을 분리해야 스크롤이
|
||||||
올바르게 생긴다(캔버스만 커지고 뷰포트는 flex 크기를 유지). */
|
올바르게 생긴다(캔버스만 커지고 뷰포트는 flex 크기를 유지). */
|
||||||
.pj-board { flex: 1 1 auto; min-height: 0; overflow-y: auto; overflow-x: hidden; padding-right: 4px; padding-bottom: 8px; }
|
/* scrollbar-gutter:stable — 스크롤바 자리를 항상 미리 비워둔다. 이게 없으면
|
||||||
|
렌더 시점에 스크롤바가 아직 안 생긴 상태로 clientWidth를 재서 열 너비를
|
||||||
|
계산했다가, 막상 스크롤바가 생기면 그만큼 폭이 줄어 마지막 열이 스크롤바
|
||||||
|
에 가려 보였다. */
|
||||||
|
.pj-board {
|
||||||
|
flex: 1 1 auto; min-height: 0; overflow-y: auto; overflow-x: hidden;
|
||||||
|
scrollbar-gutter: stable; padding-right: 4px; padding-bottom: 8px;
|
||||||
|
}
|
||||||
.pj-board-canvas { position: relative; }
|
.pj-board-canvas { position: relative; }
|
||||||
/* 세션(보드 컬럼) — 배경이 페이지와 거의 같으면 구분이 안 되므로(#f6f5fb ≈
|
/* 세션(보드 컬럼) — 배경이 페이지와 거의 같으면 구분이 안 되므로(#f6f5fb ≈
|
||||||
흰 배경) 뚜렷한 회색 톤 + 테두리로 아사나처럼 컬럼 경계를 분명히 준다.
|
흰 배경) 뚜렷한 회색 톤 + 테두리로 아사나처럼 컬럼 경계를 분명히 준다.
|
||||||
|
|||||||
Reference in New Issue
Block a user