focusのスタイルをoutlineにする

Question

Closed this issue 2 years ago · 0 comments

セルフディスカッション ※ により、focusのスタイルをできる限りoutlineで表現することになりました。ただし一部今の実装を残したい部分があるので、リストアップして作業を進めます。

※ 実際は @MasatoHonda と相談しています。

Old

box-shadow: 0 0 0 1px var(--color-surface-secondary),
    0 0 0 3px var(--color-focus-clarity);

3pxの青い線を敷いてその上に1pxの白乗せてオフセット作ってます。

outline: 2px solid var(--color-focus-clarity);
outline-offset: 1px;

Safariは角丸のoutlineに対応していないので四角くなってしまいますが、 @MasatoHonda 認識済みです。