Firefox91以降でタイトルバーをOSに合わせる

参考

https://famd.hatenablog.com/entry/2021/06/06/213130

概要

Firefox91以降Proton UIが強制的に適用される。
これによりウインドウのアクティブ、非アクティブに関わらずタイトルバーの色が白になった。
そのためアクティブウインドウがどれなのかわかりにくい状態になっている。

タイトルバーの色をOSに合わせる

 手順

1. カスタムcssを使えるようにする
   1. about:config を開く
   2. toolkit.legacyUserProfileCustomizations.stylesheets を true にする
2. カスタムcssを作成する
   1. プロファイルディレクトリ\chrome\userChrome.css を作成する
   2. 以下の内容を記載する

/* ウインドウアクティブ時のタイトルバーの背景色をOSのテーマ色に変更（以前の規定テーマと同じ） */
:is(#TabsToolbar, #toolbar-menubar):not(:-moz-window-inactive) {
  color: -moz-accent-color-foreground;
  background-color: -moz-accent-color;
}

/* タブとタブバーの高さを調整 */
:root {
  --tab-min-height: 26px !important;
}
:root[uidensity="compact"] {
  --tab-min-height: 26px !important;
}

/* ブックマークアイテムの高さを変える */
.bookmark-item,
.bookmark-item > menupopup,
.bookmark-item > menupopup > menuitem {
  padding-block: 0.2em !important;
}

Firefox 103以降

以下の変更があるので注意
-moz-accent-color-foreground は AccentColorText に変更
-moz-accent-color は AccentColor に変更

 /* ウインドウアクティブ時のタイトルバーの背景色をOSのテーマ色に変更（以前の規定テーマと同じ） */
 :is(#TabsToolbar, #toolbar-menubar):not(:-moz-window-inactive) {
   /* color: -moz-accent-color-foreground;
   background-color: -moz-accent-color; */
   color: AccentColorText;
   background-color: AccentColor;
 }
 
 /* タブとタブバーの高さを調整 */
 :root {
   --tab-min-height: 26px !important;
 }
 :root[uidensity="compact"] {
   --tab-min-height: 26px !important;
 }
 
 /* ブックマークアイテムの高さを変える */
 .bookmark-item,
 .bookmark-item > menupopup,
 .bookmark-item > menupopup > menuitem {
   padding-block: 0.2em !important;
 }