fix(cupang): 3열 카드 자체도 스크롤되도록 이중 안전장치
카드에 max-height(82vh)를 주고 ③ 카드는 overflow-y:auto 로 바꿔, 안쪽 목록 스크롤이 동작하지 않는 상황에서도 카드가 스크롤되게 한다. 스크롤바는 gutter 고정 + webkit 스크롤바 폭 지정으로 보이게. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
{% extends "erp_base.html" %}
|
||||
|
||||
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260901r" />{% endblock %}
|
||||
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260901s" />{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<section class="cpg">
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{% extends "erp_base.html" %}
|
||||
|
||||
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260901r" />{% endblock %}
|
||||
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260901s" />{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<section class="cpg">
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{% extends "erp_base.html" %}
|
||||
|
||||
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260901r" />{% endblock %}
|
||||
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260901s" />{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<section class="cpg">
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{% extends "erp_base.html" %}
|
||||
|
||||
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260901r" />{% endblock %}
|
||||
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260901s" />{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<section class="cpg">
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{% extends "erp_base.html" %}
|
||||
|
||||
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260901r" />{% endblock %}
|
||||
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260901s" />{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<section class="cpg">
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{% extends "erp_base.html" %}
|
||||
|
||||
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260901r" />{% endblock %}
|
||||
{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260901s" />{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
{# 출고 묶음 보기 — 상자 계산 화면과 같은 3열 구성. 읽기 전용(수정 없음). #}
|
||||
|
||||
@@ -1465,3 +1465,30 @@ body.cpg-dragging { cursor: grabbing; user-select: none; }
|
||||
.cpg-calc-sum .cpg-sum-scroll { max-height: min(64vh, 720px); }
|
||||
/* 용량 초과 표시 */
|
||||
.cpg-mix-fill.is-over { color: var(--color-callout-red); font-weight: 600; }
|
||||
|
||||
/* ── 스크롤 확실히 (부모 높이 계산 실패해도 동작하도록 이중 안전장치) ── */
|
||||
/* 카드마다 최대 높이 → 넘치면 카드 자체가 스크롤된다 */
|
||||
.cpg-calc3 > .erp-card { max-height: min(82vh, 900px); }
|
||||
.cpg-dist-card { overflow-y: auto; overflow-x: hidden; }
|
||||
/* 안쪽 목록은 스크롤바 자리를 항상 확보해 두어 눈에 보이게 */
|
||||
.cpg-dist-card .cpg-dist-list,
|
||||
.cpg-calc-sum .cpg-sum-scroll,
|
||||
.cpg-calc-card .erp-table-wrap {
|
||||
overflow-y: auto;
|
||||
overscroll-behavior: contain;
|
||||
scrollbar-gutter: stable;
|
||||
}
|
||||
/* 크롬/웨일에서 오버레이 스크롤바가 숨지 않도록 폭을 지정 */
|
||||
.cpg-dist-card .cpg-dist-list::-webkit-scrollbar,
|
||||
.cpg-calc-sum .cpg-sum-scroll::-webkit-scrollbar,
|
||||
.cpg-calc-card .erp-table-wrap::-webkit-scrollbar,
|
||||
.cpg-dist-card::-webkit-scrollbar { width: 10px; }
|
||||
.cpg-dist-card .cpg-dist-list::-webkit-scrollbar-thumb,
|
||||
.cpg-calc-sum .cpg-sum-scroll::-webkit-scrollbar-thumb,
|
||||
.cpg-calc-card .erp-table-wrap::-webkit-scrollbar-thumb,
|
||||
.cpg-dist-card::-webkit-scrollbar-thumb {
|
||||
background: var(--color-subtle-ash);
|
||||
border-radius: 999px;
|
||||
}
|
||||
.cpg-dist-card .cpg-dist-list::-webkit-scrollbar-thumb:hover,
|
||||
.cpg-dist-card::-webkit-scrollbar-thumb:hover { background: var(--color-midtone-gray); }
|
||||
|
||||
Reference in New Issue
Block a user