From c06661093cbbaeea63cb1be7ae09cbd4aa85e36d Mon Sep 17 00:00:00 2001 From: umsangdon Date: Sat, 10 Oct 2026 15:32:14 +0900 Subject: [PATCH] =?UTF-8?q?style(B06):=20=EC=95=8C=EB=A6=BC=20=EC=B9=A9=20?= =?UTF-8?q?=EC=A4=84=20=EC=9C=84=20=EC=97=AC=EB=B0=B1=2016=E2=86=928=20?= =?UTF-8?q?=C2=B7=20=EC=B9=A9=20=EC=A4=84=20=E2=86=94=20=EC=B2=AB=20?= =?UTF-8?q?=ED=9A=A1=EB=8B=A8=20=EC=B9=B4=EB=93=9C=20=EA=B0=84=EA=B2=A9=20?= =?UTF-8?q?28=E2=86=9216=20px(217-1)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-Authored-By: Claude Sonnet 5.5 Claude-Session: https://claude.ai/code/session_018jonfdxn1Xit9bdkNJpE4G --- B06_Section/B06_Section_UI_Style_Cross.css | 7 +++-- .../tester/test_217_1_b06_notice_spacing.py | 30 +++++++++++++++++++ 2 files changed, 34 insertions(+), 3 deletions(-) create mode 100644 resources/tester/test_217_1_b06_notice_spacing.py diff --git a/B06_Section/B06_Section_UI_Style_Cross.css b/B06_Section/B06_Section_UI_Style_Cross.css index 494c58df0..6bd6c56e3 100644 --- a/B06_Section/B06_Section_UI_Style_Cross.css +++ b/B06_Section/B06_Section_UI_Style_Cross.css @@ -124,7 +124,8 @@ } /* 알림 줄(138-3) — 카드 칸 맨 위 고정 · 알림 없어도 줄 유지 · 오른쪽 끝 열 수 칸. - 위 여백(카드 칸 padding)만큼 끌어올려 그 틈으로 카드가 비치지 않게 */ + 위 여백(카드 칸 padding)만큼 끌어올려 그 틈으로 카드가 비치지 않게. + 217-1 — 칩 줄 위 여백 16→8 · 칩 줄 ↔ 첫 카드 28→16(카드 칸 gap 24 에서 8 을 당김) */ .b06-section__notice-bar { position: sticky; top: calc(-1 * var(--spacing-16)); @@ -132,8 +133,8 @@ display: flex; align-items: flex-start; gap: var(--spacing-8); - margin-top: calc(-1 * var(--spacing-16)); - padding-block: var(--spacing-16) var(--spacing-4); + margin-block: calc(-1 * var(--spacing-16)) calc(-1 * var(--spacing-8)); + padding-block: var(--spacing-8) 0; background: var(--color-bg); } diff --git a/resources/tester/test_217_1_b06_notice_spacing.py b/resources/tester/test_217_1_b06_notice_spacing.py new file mode 100644 index 000000000..e15d8ef74 --- /dev/null +++ b/resources/tester/test_217_1_b06_notice_spacing.py @@ -0,0 +1,30 @@ +"""217-1 B06 알림 칩 줄 여백 줄임 — 줄 위 여백 16→8 · 칩 줄 ↔ 첫 카드 28→16 (CSS 값 고정).""" + +from test_196_1_b06_notice_chips import B06 + +CSS = (B06 / "B06_Section_UI_Style_Cross.css").read_text(encoding="utf-8") + + +def _rule(selector: str) -> str: + body = CSS[CSS.index(selector + " {") :] + return body[: body.index("}")] + + +def test_칩_줄_위_여백은_8_아래_여백은_0(): + bar = _rule(".b06-section__notice-bar") + assert "padding-block: var(--spacing-8) 0;" in bar + assert "spacing-16) var(--spacing-4)" not in bar + + +def test_첫_카드와의_간격은_카드_칸_gap_24에서_8을_당겨_16(): + bar = _rule(".b06-section__notice-bar") + # 위 = 카드 칸 padding(16) 상쇄 · 아래 = gap(24) 중 8 당김 + assert "margin-block: calc(-1 * var(--spacing-16)) calc(-1 * var(--spacing-8));" in bar + assert "gap: var(--spacing-24)" in _rule(".b06-section__cards") + + +def test_sticky_top_과_scroll_margin_그대로(): + bar = _rule(".b06-section__notice-bar") + assert "position: sticky" in bar + assert "top: calc(-1 * var(--spacing-16))" in bar + assert "scroll-margin-top: calc(var(--b06-notice-h, 0px) + var(--spacing-8))" in CSS