From e259e7d370ecab1a956e0ec623bc74bfc89dfb53 Mon Sep 17 00:00:00 2001 From: king Date: Wed, 2 Sep 2026 14:29:37 +0900 Subject: [PATCH] =?UTF-8?q?style(cupang):=20=EB=8B=AC=EB=A0=A5=20=ED=97=A4?= =?UTF-8?q?=EB=8D=94=20=EC=9E=AC=EA=B5=AC=EC=84=B1=20=E2=80=94=20=ED=81=B0?= =?UTF-8?q?=20=ED=99=94=EC=82=B4=ED=91=9C=C2=B7=EA=B0=80=EC=9A=B4=EB=8D=B0?= =?UTF-8?q?=20=EC=A0=9C=EB=AA=A9,=20=EC=98=A4=EB=8A=98=20=EB=B2=84?= =?UTF-8?q?=ED=8A=BC=20=EC=A4=91=EC=95=99=20=EC=9D=B4=EB=8F=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 상단 바: ← 제목 → 을 가운데 정렬, 화살표는 테두리 없는 큰 글리프 - "오늘" 버튼을 두 달 사이 상단 중앙으로 이동 - 달 머리글 가운데 정렬, 출고 건수 배지는 오른쪽에 겹쳐 배치 Co-Authored-By: Claude Opus 5 --- .../cupang/templates/cupang/box_calc.html | 2 +- .../cupang/templates/cupang/box_rules.html | 2 +- .../cupang/templates/cupang/index.html | 14 +++---- .../cupang/templates/cupang/products.html | 2 +- app/modules/cupang/templates/cupang/view.html | 2 +- app/static/cupang.css | 38 ++++++++++--------- 6 files changed, 31 insertions(+), 29 deletions(-) diff --git a/app/modules/cupang/templates/cupang/box_calc.html b/app/modules/cupang/templates/cupang/box_calc.html index e174b91..52ce059 100644 --- a/app/modules/cupang/templates/cupang/box_calc.html +++ b/app/modules/cupang/templates/cupang/box_calc.html @@ -1,6 +1,6 @@ {% extends "erp_base.html" %} -{% block head_extra %}{% endblock %} +{% block head_extra %}{% endblock %} {% block content %}
diff --git a/app/modules/cupang/templates/cupang/box_rules.html b/app/modules/cupang/templates/cupang/box_rules.html index 33cb22b..486f874 100644 --- a/app/modules/cupang/templates/cupang/box_rules.html +++ b/app/modules/cupang/templates/cupang/box_rules.html @@ -1,6 +1,6 @@ {% extends "erp_base.html" %} -{% block head_extra %}{% endblock %} +{% block head_extra %}{% endblock %} {% block content %}
diff --git a/app/modules/cupang/templates/cupang/index.html b/app/modules/cupang/templates/cupang/index.html index 2a04df2..b676bd3 100644 --- a/app/modules/cupang/templates/cupang/index.html +++ b/app/modules/cupang/templates/cupang/index.html @@ -1,6 +1,6 @@ {% extends "erp_base.html" %} -{% block head_extra %}{% endblock %} +{% block head_extra %}{% endblock %} {% block content %}
@@ -21,17 +21,15 @@
-
- ‹ - › -
+ ←

{{ months[0].label }} – {{ months[1].label }}

- 오늘 + →
+ 오늘 {% for m in months %}
diff --git a/app/modules/cupang/templates/cupang/products.html b/app/modules/cupang/templates/cupang/products.html index 8eb8fca..e5c7ffe 100644 --- a/app/modules/cupang/templates/cupang/products.html +++ b/app/modules/cupang/templates/cupang/products.html @@ -1,6 +1,6 @@ {% extends "erp_base.html" %} -{% block head_extra %}{% endblock %} +{% block head_extra %}{% endblock %} {% block content %}
diff --git a/app/modules/cupang/templates/cupang/view.html b/app/modules/cupang/templates/cupang/view.html index 2f1e915..ef697b6 100644 --- a/app/modules/cupang/templates/cupang/view.html +++ b/app/modules/cupang/templates/cupang/view.html @@ -1,6 +1,6 @@ {% extends "erp_base.html" %} -{% block head_extra %}{% endblock %} +{% block head_extra %}{% endblock %} {% block content %} {# 출고 묶음 보기 — 상자 계산 화면과 같은 3열 구성. 읽기 전용(수정 없음). #} diff --git a/app/static/cupang.css b/app/static/cupang.css index ef823ca..5349472 100644 --- a/app/static/cupang.css +++ b/app/static/cupang.css @@ -1033,30 +1033,32 @@ body.cpg-dragging { cursor: grabbing; user-select: none; } ══════════════════════════════════════════════════════════════ */ .cpg-cal-card { padding: 16px 18px 14px; } -/* 상단 바: ‹ › + 기간 제목 + 오늘 */ +/* 상단 바: ← 기간 제목 → (가운데 정렬) */ .cpg-mcal-bar { - display: flex; align-items: center; gap: 12px; - padding-bottom: 12px; margin-bottom: 14px; + display: flex; align-items: center; justify-content: center; gap: 26px; + padding-bottom: 14px; margin-bottom: 16px; border-bottom: 1px solid var(--color-subtle-ash); flex-shrink: 0; } -.cpg-mcal-nav { display: inline-flex; gap: 4px; } .cpg-mcal-navbtn { - width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center; - border: 1px solid var(--color-subtle-ash); border-radius: 8px; - font-size: 17px; line-height: 1; color: var(--color-rich-black); - text-decoration: none; background: #fff; - transition: background .12s, border-color .12s; + width: 48px; height: 36px; + border: 0; background: none; border-radius: 8px; + font-size: 32px; font-weight: 700; line-height: 1; + color: var(--color-deep-black); text-decoration: none; + transition: background .12s, transform .12s; } -.cpg-mcal-navbtn:hover { background: var(--color-ghost-gray); border-color: var(--color-midtone-gray); } +.cpg-mcal-navbtn:hover { background: var(--color-ghost-gray); } +.cpg-mcal-navbtn:active { transform: scale(.94); } .cpg-mcal-range { - margin: 0; font-size: 19px; font-weight: 600; letter-spacing: -0.4px; + margin: 0; font-size: 20px; font-weight: 600; letter-spacing: -0.4px; white-space: nowrap; } +/* 오늘 — 두 달 사이 가운데 위쪽 */ .cpg-mcal-todaybtn { - margin-left: auto; - padding: 6px 14px; border-radius: 999px; + position: absolute; top: 2px; left: 50%; transform: translateX(-50%); + z-index: 2; + padding: 5px 16px; border-radius: 999px; border: 1px solid var(--color-subtle-ash); background: #fff; font-size: 13px; color: var(--color-rich-black); text-decoration: none; } @@ -1064,6 +1066,7 @@ body.cpg-dragging { cursor: grabbing; user-select: none; } /* 두 달 나란히 */ .cpg-mcal-months { + position: relative; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; @@ -1074,15 +1077,16 @@ body.cpg-dragging { cursor: grabbing; user-select: none; } } .cpg-mcal { display: flex; flex-direction: column; min-height: 0; min-width: 0; } -/* 달 머리글 */ +/* 달 머리글 — 가운데 정렬, 출고 건수는 오른쪽 끝에 겹쳐 놓는다 */ .cpg-mcal-h { - display: flex; align-items: baseline; gap: 6px; - padding: 0 2px 8px; + position: relative; + display: flex; align-items: baseline; justify-content: center; gap: 8px; + padding: 0 2px 10px; } .cpg-mcal-mname { font-size: 30px; font-weight: 800; letter-spacing: -0.5px; } .cpg-mcal-myear { font-size: 24px; font-weight: 800; color: var(--color-midtone-gray); font-family: var(--font-geist-mono); } .cpg-mcal-total { - margin-left: auto; + position: absolute; right: 2px; top: 8px; font-size: 11px; padding: 2px 8px; border-radius: 999px; background: var(--color-ghost-gray); color: var(--color-midtone-gray); }