t_wの輪郭

Firefoxのソースコードを調べてみたけど、私のソースコード読解力では「media="(prefers-color-scheme: dark)"を使ってfaviconをダークモードで切り替える(Firefox非対応)」がFirefoxで動かない原因となる箇所が特定できなかった。

<link rel="icon" href="/favicon.svg" type="image/svg+xml" media="(prefers-color-scheme: light)">
<link rel="icon" href="/favicon_dark.svg" type="image/svg+xml" media="(prefers-color-scheme: dark)">

という風にmedia="(prefers-color-scheme: dark)"を付ける

ChromeとEdgeではダークモード時にfaviconが切り替わる。Firefox（v100.0）では切り替わらず、後に設定されたfaviconが表示される。

media="(prefers-color-scheme: dark)"についての一次情報（というか信頼できる情報元）が見つからず、「なんかわからんけどこうするとうまくいく」になっている。

prefers-color-scheme: darkについて↓
https://www.w3.org/TR/mediaqueries-5/#prefers-color-scheme

↑これをmedia="(...)"のかたちで指定することについて↓
https://drafts.csswg.org/mediaqueries/#media-type

たぶんこれかな……。
こういうときの一次情報って難しい。
とりあえず規格だったら「一次情報に近い」とみなせるのかな。

<link rel="stylesheet" href="/highlight/styles/a11y-dark.min.css" media="(prefers-color-scheme: dark)"> 
<link rel="stylesheet" href="/highlight/styles/a11y-light.min.css" media="(prefers-color-scheme: light)"> 
<script src="/highlight/highlight.min.js"></script>