From 2cf8ffe5df4923a60ece241fb23e739ff4e14a08 Mon Sep 17 00:00:00 2001 From: touyou <465697+touyou@users.noreply.github.com> Date: Fri, 5 Jun 2026 17:31:54 +0900 Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20fix:=20=E7=94=9F=E6=88=90=20CSS?= =?UTF-8?q?=20=E3=81=AE=E3=82=A2=E3=82=A4=E3=82=B3=E3=83=B3=E3=82=AF?= =?UTF-8?q?=E3=83=A9=E3=82=B9=E3=81=AB=20font-weight:=20500=20=E3=82=92?= =?UTF-8?q?=E5=8F=8D=E6=98=A0=EF=BC=88CLI=202.2.2=EF=BC=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - sparkle-design-cli 2.2.2 で sparkle-design.css を再生成 （.icon-*-fill-* 全 24 クラスに font-weight: var(--font-weight-icon) 追加） - Vercel ビルドの CLI ピンを 1.3.11 → 2.2.2 に更新 （ビルド時の再生成にも新テンプレートを反映させるため） - goodpatch/sparkle-design-internal#198 の根本対応（テンプレート側） Co-Authored-By: Claude Opus 4.8 (1M context) --- scripts/build-registry-vercel.sh | 2 +- src/app/sparkle-design.css | 25 +++++++++++++++++++++++++ 2 files changed, 26 insertions(+), 1 deletion(-) diff --git a/scripts/build-registry-vercel.sh b/scripts/build-registry-vercel.sh index a438beb..90b299c 100755 --- a/scripts/build-registry-vercel.sh +++ b/scripts/build-registry-vercel.sh @@ -9,7 +9,7 @@ echo "🤖 Starting Vercel registry build..." # Step 1: cssを生成 echo "🎨 Generate sparkle-design.css..." -npx --yes sparkle-design-cli@1.3.11 generate +npx --yes sparkle-design-cli@2.2.2 generate # Step 2: registryのjsonに変換 echo "🎨 Generate sparkle-design-theme.json..." diff --git a/src/app/sparkle-design.css b/src/app/sparkle-design.css index 02e0b78..345af79 100644 --- a/src/app/sparkle-design.css +++ b/src/app/sparkle-design.css @@ -159,6 +159,7 @@ /* フォントウェイト */ --font-weight-char-normal: 400; --font-weight-char-bold: 700; + --font-weight-icon: 500; --font-weight-icon-fill-0: 'FILL' 0, 'wght' 500, 'GRAD' 0, 'opsz' 24; --font-weight-icon-fill-1: 'FILL' 1, 'wght' 500, 'GRAD' 0, 'opsz' 24; @@ -781,6 +782,7 @@ /* アイコンスタイル */ font-family: var(--font-family-icon); font-size: var(--font-size-12); + font-weight: var(--font-weight-icon); font-variation-settings: var(--font-weight-icon-fill-0); font-display: optional; letter-spacing: var(--letter-spacing-normal); @@ -789,6 +791,7 @@ .icon-1-fill-1 { font-family: var(--font-family-icon); font-size: var(--font-size-12); + font-weight: var(--font-weight-icon); font-variation-settings: var(--font-weight-icon-fill-1); font-display: optional; letter-spacing: var(--letter-spacing-normal); @@ -797,6 +800,7 @@ .icon-2-fill-0 { font-family: var(--font-family-icon); font-size: var(--font-size-14); + font-weight: var(--font-weight-icon); font-variation-settings: var(--font-weight-icon-fill-0); font-display: optional; letter-spacing: var(--letter-spacing-normal); @@ -805,6 +809,7 @@ .icon-2-fill-1 { font-family: var(--font-family-icon); font-size: var(--font-size-14); + font-weight: var(--font-weight-icon); font-variation-settings: var(--font-weight-icon-fill-1); font-display: optional; letter-spacing: var(--letter-spacing-normal); @@ -813,6 +818,7 @@ .icon-3-fill-0 { font-family: var(--font-family-icon); font-size: var(--font-size-16); + font-weight: var(--font-weight-icon); font-variation-settings: var(--font-weight-icon-fill-0); font-display: optional; letter-spacing: var(--letter-spacing-normal); @@ -821,6 +827,7 @@ .icon-3-fill-1 { font-family: var(--font-family-icon); font-size: var(--font-size-16); + font-weight: var(--font-weight-icon); font-variation-settings: var(--font-weight-icon-fill-1); font-display: optional; letter-spacing: var(--letter-spacing-normal); @@ -829,6 +836,7 @@ .icon-4-fill-0 { font-family: var(--font-family-icon); font-size: var(--font-size-18); + font-weight: var(--font-weight-icon); font-variation-settings: var(--font-weight-icon-fill-0); font-display: optional; letter-spacing: var(--letter-spacing-normal); @@ -837,6 +845,7 @@ .icon-4-fill-1 { font-family: var(--font-family-icon); font-size: var(--font-size-18); + font-weight: var(--font-weight-icon); font-variation-settings: var(--font-weight-icon-fill-1); font-display: optional; letter-spacing: var(--letter-spacing-normal); @@ -845,6 +854,7 @@ .icon-5-fill-0 { font-family: var(--font-family-icon); font-size: var(--font-size-20); + font-weight: var(--font-weight-icon); font-variation-settings: var(--font-weight-icon-fill-0); font-display: optional; letter-spacing: var(--letter-spacing-normal); @@ -853,6 +863,7 @@ .icon-5-fill-1 { font-family: var(--font-family-icon); font-size: var(--font-size-20); + font-weight: var(--font-weight-icon); font-variation-settings: var(--font-weight-icon-fill-1); font-display: optional; letter-spacing: var(--letter-spacing-normal); @@ -861,6 +872,7 @@ .icon-6-fill-0 { font-family: var(--font-family-icon); font-size: var(--font-size-24); + font-weight: var(--font-weight-icon); font-variation-settings: var(--font-weight-icon-fill-0); font-display: optional; letter-spacing: var(--letter-spacing-normal); @@ -869,6 +881,7 @@ .icon-6-fill-1 { font-family: var(--font-family-icon); font-size: var(--font-size-24); + font-weight: var(--font-weight-icon); font-variation-settings: var(--font-weight-icon-fill-1); font-display: optional; letter-spacing: var(--letter-spacing-normal); @@ -877,6 +890,7 @@ .icon-7-fill-0 { font-family: var(--font-family-icon); font-size: var(--font-size-28); + font-weight: var(--font-weight-icon); font-variation-settings: var(--font-weight-icon-fill-0); font-display: optional; letter-spacing: var(--letter-spacing-normal); @@ -885,6 +899,7 @@ .icon-7-fill-1 { font-family: var(--font-family-icon); font-size: var(--font-size-28); + font-weight: var(--font-weight-icon); font-variation-settings: var(--font-weight-icon-fill-1); font-display: optional; letter-spacing: var(--letter-spacing-normal); @@ -893,6 +908,7 @@ .icon-8-fill-0 { font-family: var(--font-family-icon); font-size: var(--font-size-32); + font-weight: var(--font-weight-icon); font-variation-settings: var(--font-weight-icon-fill-0); font-display: optional; letter-spacing: var(--letter-spacing-normal); @@ -901,6 +917,7 @@ .icon-8-fill-1 { font-family: var(--font-family-icon); font-size: var(--font-size-32); + font-weight: var(--font-weight-icon); font-variation-settings: var(--font-weight-icon-fill-1); font-display: optional; letter-spacing: var(--letter-spacing-normal); @@ -909,6 +926,7 @@ .icon-9-fill-0 { font-family: var(--font-family-icon); font-size: var(--font-size-36); + font-weight: var(--font-weight-icon); font-variation-settings: var(--font-weight-icon-fill-0); font-display: optional; letter-spacing: var(--letter-spacing-normal); @@ -917,6 +935,7 @@ .icon-9-fill-1 { font-family: var(--font-family-icon); font-size: var(--font-size-36); + font-weight: var(--font-weight-icon); font-variation-settings: var(--font-weight-icon-fill-1); font-display: optional; letter-spacing: var(--letter-spacing-normal); @@ -925,6 +944,7 @@ .icon-10-fill-0 { font-family: var(--font-family-icon); font-size: var(--font-size-42); + font-weight: var(--font-weight-icon); font-variation-settings: var(--font-weight-icon-fill-0); font-display: optional; letter-spacing: var(--letter-spacing-normal); @@ -933,6 +953,7 @@ .icon-10-fill-1 { font-family: var(--font-family-icon); font-size: var(--font-size-42); + font-weight: var(--font-weight-icon); font-variation-settings: var(--font-weight-icon-fill-1); font-display: optional; letter-spacing: var(--letter-spacing-normal); @@ -941,6 +962,7 @@ .icon-11-fill-0 { font-family: var(--font-family-icon); font-size: var(--font-size-48); + font-weight: var(--font-weight-icon); font-variation-settings: var(--font-weight-icon-fill-0); font-display: optional; letter-spacing: var(--letter-spacing-normal); @@ -949,6 +971,7 @@ .icon-11-fill-1 { font-family: var(--font-family-icon); font-size: var(--font-size-48); + font-weight: var(--font-weight-icon); font-variation-settings: var(--font-weight-icon-fill-1); font-display: optional; letter-spacing: var(--letter-spacing-normal); @@ -957,6 +980,7 @@ .icon-12-fill-0 { font-family: var(--font-family-icon); font-size: var(--font-size-54); + font-weight: var(--font-weight-icon); font-variation-settings: var(--font-weight-icon-fill-0); font-display: optional; letter-spacing: var(--letter-spacing-normal); @@ -965,6 +989,7 @@ .icon-12-fill-1 { font-family: var(--font-family-icon); font-size: var(--font-size-54); + font-weight: var(--font-weight-icon); font-variation-settings: var(--font-weight-icon-fill-1); font-display: optional; letter-spacing: var(--letter-spacing-normal);