Skip to content

選択の帯のネイビーをやめ、ブラウザ既定に戻す #3299

Description

@ma91n

テキスト選択の帯に当てているブランドのネイビー(--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)は作り直さずに落とします。 色がブラウザのものになるので、こちらで塗った見本は実物と違うものになります。節の文章そのものを選択すれば実物が見えます

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions