トップ 一覧 置換 検索 ヘルプ RSS ログイン

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

  • 追加された行はこのように表示されます。
  • 削除された行はこのように表示されます。
!!!参考
https://famd.hatenablog.com/entry/2021/06/06/213130

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

!!!タイトルバーの色をOSに合わせる
!!手順
+カスタムcssを使えるようにする
++ about:config を開く
++ toolkit.legacyUserProfileCustomizations.stylesheets を true にする
+ カスタムcssを作成する
++ プロファイルディレクトリ\chrome\userChrome.css を作成する
++ 以下の内容を記載する
 /* ウインドウアクティブ時のタイトルバーの背景色を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;
  }

{{category2 ツール,Web,Firefox}}