コンテナクエリは機能しますが、これを簡素化するために、CSSのネイティブなlight-dark()関数を使用することもできます:
.my-thing {
background: light-dark(#fff, #000);
color: light-dark(#222, #eee);
}
一般的に、Discourseでは、このように特定の色を設定するのを避けるために、自動的に切り替わるカラー変数(--primary、--secondaryなど)に依存しています。これにより、どのようなカラースキームでも色が正しく表示されます。
例はここで確認できます:https://meta.discourse.org/styleguide/atoms/colors 。ダークモードとライトモードを切り替えると、これらの変数がどのように変化するかを確認できます。これらの変数は、/admin/config/colorsのカラーパレットで設定されています。