テキスト選択の帯に当てているブランドのネイビー(--selection-bg / --selection-ink)をやめて、ブラウザ既定に戻します。
なぜ
typescript-guide の CSS をこのブログへ寄せる作業(future-architect/typescript-guide#158)の中で、向こうにも同じネイビーの選択色を入れる PR を出したところ、本文の選択は従来どおり(ブラウザ既定)のほうがよいという判断になりました。あわせてこちらとアーキテクチャガイドラインからもネイビーの選択色を外すことにします。
変更するもの
theme-styles.styl の ::selection / ::-moz-selection(ページ全体・フッター、明るい側と暗い側)
--selection-bg / --selection-ink のトークンと、_variables.styl の dark-selection
- スタイルガイドの見本(
.sg-selected)とダークの段の表の selection-bg の行
- 「ネイビーはインタラクション(selection / hover / focus)専用」と書いている箇所(
_variables.styl のコメント・スタイルガイドのブランド色の節・CLAUDE.md)
変えないもの
- 「選択されると色が消えるので、下線だけが残る」の節と
link-underline-offset(2px)はそのまま。 帯の文字色で塗り直されるのはブラウザ既定でも同じで、下線が帯からはみ出すと消える制約も変わりません
- 見本(
.sg-selected)は作り直さずに落とします。 色がブラウザのものになるので、こちらで塗った見本は実物と違うものになります。節の文章そのものを選択すれば実物が見えます
テキスト選択の帯に当てているブランドのネイビー(
--selection-bg/--selection-ink)をやめて、ブラウザ既定に戻します。なぜ
typescript-guide の CSS をこのブログへ寄せる作業(future-architect/typescript-guide#158)の中で、向こうにも同じネイビーの選択色を入れる PR を出したところ、本文の選択は従来どおり(ブラウザ既定)のほうがよいという判断になりました。あわせてこちらとアーキテクチャガイドラインからもネイビーの選択色を外すことにします。
変更するもの
theme-styles.stylの::selection/::-moz-selection(ページ全体・フッター、明るい側と暗い側)--selection-bg/--selection-inkのトークンと、_variables.stylのdark-selection.sg-selected)とダークの段の表のselection-bgの行_variables.stylのコメント・スタイルガイドのブランド色の節・CLAUDE.md)変えないもの
link-underline-offset(2px)はそのまま。 帯の文字色で塗り直されるのはブラウザ既定でも同じで、下線が帯からはみ出すと消える制約も変わりません.sg-selected)は作り直さずに落とします。 色がブラウザのものになるので、こちらで塗った見本は実物と違うものになります。節の文章そのものを選択すれば実物が見えます