From cd9a73254b13e8cb66bd8143677ce2cb7781cd5e Mon Sep 17 00:00:00 2001 From: gahusb Date: Sat, 6 Jun 2026 12:50:29 +0900 Subject: [PATCH] =?UTF-8?q?polish(insta-lab):=20=ED=85=9C=ED=94=8C?= =?UTF-8?q?=EB=A6=BF=20=EB=8F=99=EA=B8=B0=ED=99=94=20(CSS=20|=20safe=20+?= =?UTF-8?q?=20cover=20clamp)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-Authored-By: Claude Opus 4.8 (1M context) --- insta-lab/app/templates/default/card.html.j2 | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) diff --git a/insta-lab/app/templates/default/card.html.j2 b/insta-lab/app/templates/default/card.html.j2 index 4a1c607..00688a6 100644 --- a/insta-lab/app/templates/default/card.html.j2 +++ b/insta-lab/app/templates/default/card.html.j2 @@ -17,13 +17,13 @@ display: flex; flex-direction: column; background: #FFFFFF; } - .accent-bar { position: absolute; top: 0; left: 0; width: 100%; height: 14px; background: {{ accent_color }}; } + .accent-bar { position: absolute; top: 0; left: 0; width: 100%; height: 14px; background: {{ accent_color | safe }}; } .badge { align-self: flex-start; padding: 10px 24px; border-radius: 999px; - background: {{ accent_color }}; color: #fff; + background: {{ accent_color | safe }}; color: #fff; font-size: 30px; font-weight: 700; letter-spacing: -0.02em; } - .idx { font-size: 120px; font-weight: 800; line-height: 1; color: {{ accent_color }}; letter-spacing: -0.04em; } + .idx { font-size: 120px; font-weight: 800; line-height: 1; color: {{ accent_color | safe }}; letter-spacing: -0.04em; } .content { flex: 1; display: flex; flex-direction: column; justify-content: center; gap: 36px; } .headline { font-weight: 800; line-height: 1.18; letter-spacing: -0.04em; color: #14171A; @@ -37,17 +37,18 @@ display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; -webkit-line-clamp: 8; white-space: pre-wrap; } + .cover .sub { -webkit-line-clamp: 5; } .footer { display: flex; justify-content: space-between; align-items: center; font-size: 28px; color: #8A9099; font-weight: 600; margin-top: 40px; } .cta-pill { align-self: flex-start; margin-top: 8px; padding: 18px 40px; border-radius: 16px; - background: {{ accent_color }}; color: #fff; font-size: 40px; font-weight: 700; + background: {{ accent_color | safe }}; color: #fff; font-size: 40px; font-weight: 700; } .progress { display: flex; gap: 10px; } .progress i { width: 14px; height: 14px; border-radius: 50%; background: #D8DCE0; display: inline-block; } - .progress i.on { background: {{ accent_color }}; } + .progress i.on { background: {{ accent_color | safe }}; }