Skip to content

表のヘッダーの文字色を本文と同じ段にする (#459) - #460

Merged
ma91n merged 1 commit into
mainfrom
fix/th-text-color-459
Sep 11, 2026
Merged

ma91n merged 1 commit into
mainfrom
fix/th-text-color-459

Conversation

@ma91n

@ma91n ma91n commented Sep 11, 2026

Copy link
Copy Markdown
Collaborator

Fixes #459

変更内容

.vp-doc th の文字色を --vp-c-text-2 から --vp-c-text-1 にする(.vitepress/theme/style.css の1宣言)。技術ブログは th に color を書かず本文色をそのまま継ぐので、同じ表の中で th と td の文字が同じ濃さになる。本サイトは VitePress 既定の一段薄い段が残っていて、ヘッダーだけ薄く見えていた。

判断した点

太さの 600 は触らない。 ブログの th は 700 だが、VitePress は見出し(vp-doc.css 12行)・strong(base.css 70行)・th(192行)をすべて 600 で組んでいて、600 がこのサイトの太字の段になっている。th だけ 700 にすると本文の中で唯一 700 のものが生まれ、strong や見出しより重くなる。寄せるのは「th の文字は本文と同じ段」という決まりの側で、太字の具体値は各サイトの段が持つ。

#431 の「寄せないもの」を1行覆す。 あそこは --vp-c-text-2 #67676c とブログの ink-mute #616161 を突き合わせて「明度差 13/255 の内側なので同じ色」としていたが、ブログの th はそもそも弱い段に乗っていない(ink-strong を継ぐ)。比べる軸が違っていた。表の行の「#408 / #421 で寄せ終えている」も縞・地・罫線の話で、文字色には触れていない。

確認したこと

ライト

文字色 地 比
ブログ th #424242 #f5f5f5 9.22
本サイト th(変更前) #67676c #f6f6f7 5.21
本サイト th(変更後) #3c3c43 #f6f6f7 10.28
本サイト td #3c3c43 #fff 10.94

th の文字と td の文字の比は 1.94 → 1.00。

注記の中の表

地は注記ごとのコードの地(#427)。変更前は AA(4.5)を割るものがあり、ダークは4種とも 2.5 前後だった。

注記 ライト 変更前 → 後 ダーク 変更前 → 後
tip 4.60 → 8.94 2.49 → 5.32
info 4.30 → 8.36 2.47 → 5.29
warning 4.98 → 9.69 2.47 → 5.29
danger 3.61 → 7.02 2.47 → 5.28

ダーク(注記の外)

th は 5.60 → 11.97。td(11.97 相当、#dfdfd6 / #1b1b1f で 12.81)とそろう。

その他

  • npm run lint / npm run build が通ること
  • ビルド後の docs/assets/style.*.css で、追加した .vp-doc th(同じ詳細度)が VitePress 既定より後ろに出ていること。th の color を後から当て直す規則が他に無いこと(.vp-doc .custom-block th は background-color だけ)
  • th の中のリンク(5表、本文リンクを地の文と同じ太さにする #444 で font-weight: inherit にしたもの)は .vp-doc a の色が当たるので変わらない

🤖 Generated with Claude Code

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
@bolt-new-by-stackblitz

Copy link
Copy Markdown

Review PR in StackBlitz Codeflow Run & review this pull request in StackBlitz Codeflow.

@ma91n
ma91n merged commit 328ac59 into main Sep 11, 2026
1 check passed
@ma91n
ma91n deleted the fix/th-text-color-459 branch September 11, 2026 03:04
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

表のヘッダーの文字色を本文と同じ段にする(技術ブログにそろえる)

1 participant