FirefoxのuserChrome.css(タブを下に/多段タブ/既読・未読のマウスオーバー等 | ネットショッピングのすすめ

FirefoxのuserChrome.css(タブを下に/多段タブ/既読・未読のマウスオーバー等

約2年ぶりにWaterfoxからFirefoxに戻ってきて、色々設定してだいたい元の環境に戻りました。

万が一userChrome.css等が吹っ飛んだ時のために設定諸々をここに書いておきます。


■■■2023.12.10追記・ここから■■■
userChrome.css等各ファイルについてはこの記事を参考に正しいフォルダに導入し、バージョン119以降の各ファイルについてはこちらの記事を参考に導入してください。

2023.12.10時点で

 Firefox(デスクトップ版):バージョン120.0.1
 Firefox Portable:バージョン120.0.1
 Firefox Developer Edition:バージョン121.0b9

となっており、この3つのFirefoxは

 ・多段タブ
 ・多段ブックマーク
 ・マウスオーバーで自動開閉するサイドバー※サイドバーでのツリー型タブ・ブックマーク等

も問題なく正常に動作しています。
※パソコンのOSは Windows10 Pro バージョン22H2 です。


Waterfoxについては、2023.12.10時点で

 Waterfox:バージョンG6.0.6
  ・プロファイルによって多段タブにならないで横一列のまま(つまりこのバージョンに適した各ファイルが導入されてない)
  ・多段ブックマークは問題なし
  ・マウスオーバーで自動開閉するサイドバーも問題なし

 Waterfox Classic:バージョン2022.11
  ・多段タブ有効(ただし各タブ行の上下に無駄な余白がある。)
  ・多段ブックマークは問題なし
  ・マウスオーバーで自動開閉するサイドバーも問題なし

という状態で、プロファイルによって使用しているテーマが異なるので、多段タブが正常でないのはテーマが関係している可能性もありますが

 ・Waterfox G6については適合する各ファイルの導入(もしかたら & userChrome.cssの修正)
 ・Waterfox ClassicについてはuserChrome.cssの修正

をすればたぶん多段タブも正常に動作するようになると思いますが、

 WaterfoxはG6・Classicの両方ともすでに使ってない
  &
 WaterfoxのuserChrome.css関係のファイル・多段タブ関係のファイルはFirefoxのものとは違う。
   具体的には
   ・FirefoxのuserChrome.cssを少し修正しないとWaterfoxの多段タブは正常動作しない
   ・Waterfox G6・ClassicともにFirefox ESRのバージョン78.14.0あたりをベースにしているはずなので、Firefox78用のconfig.js・MultiRowTabLiteforFx.uc.jsを使う
   ・タブの高さは MultiRowTabLiteforFx.uc.js 内の記述にて調整する※userChrome.css にて修正しても効かない。
  &
 上記諸々のファイルがFirefoxのどのバージョンのやつなのか、Waterfoxのバージョンごとにその都度調べるのが面倒くさい

ので、修正・深追いせずそのまま放置しています。


Waterfoxは長らく使ってないので、上記Waterfoxついての記述はうろ覚えの箇所もあり不正確な可能性があります。
m(_ _)m
■■■2023.12.10追記・ここまで■■■


●userChrome.cssの導入準備

https://github.com/alice0775/userChrome.js
から『Code』→『Download ZIP』にて
①config.js
②config-prefs.js
③userChrome.css
④userChrome.js
の4ファイルを用意する。
※使用しているFirefoxのバージョンに1番近い番号のフォルダに最新版が入ってる。あるいは修正の必要がないファイルはフォルダ外にあります。


それぞれの入れる場所は

■Firefox(デスクトップ版)の場合
①Firefoxのインストールフォルダー内にconfig.js
例、C:\Program Files (x86)\Mozilla Firefox\config.js

②Firefoxのインストールフォルダー → 『defaults』 → 『pref』フォルダ内にconfig-prefs.js
例、C:\Program Files (x86)\Mozilla Firefox\defaults\pref\config-prefs.js

③④Firefoxのプロファイルフォルダー内※1に『chrome』フォルダーを作成し『chrome』フォルダー内にuserChrome.cssとuserChrome.js
※1のプロファイルフォルダーは、『ヘルプ』 → トラブルシューティング情報 → プロファイルの右にある『about:profiles』 → 『これは使用中のプロファイルです。削除できません。』 のルートディレクトリの右にある『フォルダを開く』

例、
C:\Users\●ほにゃらら●\AppData\Roaming\Mozilla\Firefox\Profiles\●ほにゃらら●\chrome\userChrome.css

C:\Users\●ほにゃらら●\AppData\Roaming\Mozilla\Firefox\Profiles\●ほにゃらら●\chrome\userChrome.js


■Firefox Portableの場合(例、インストールフォルダがM:の場合)
①Firefox Portableのインストールフォルダー → 『App』 → 『Firefox』のフォルダ内にconfig.js
例、M:\FirefoxPortable\App\Firefox\config.js

②Firefox Portableのインストールフォルダー → 『App』 → 『Firefox』 → 『defaults』 → 『pre』フォルダ内にconfig-prefs.js 
および
Firefox Portableのインストールフォルダー → 『App』 → 『Firefox64』 → 『defaults』 → 『pre』フォルダ内にconfig-prefs.js 

例、
M:\FirefoxPortable\App\Firefox\defaults\pref\config-prefs.js
および
M:\FirefoxPortable\App\Firefox64\defaults\pref\config-prefs.js

2箇所に入れるのはFirefox PortableはOSが32bitか64bitかを自動判定してどちらかのフォルダ内のFirefoxを起動するからです。

③④Firefox Portableのインストールフォルダー →『Data』 → 『profile』フォルダ内に『chrome』フォルダーを作成し『chrome』フォルダー内にuserChrome.cssとuserChrome.js

例、
M:\FirefoxPortable\Data\profile\chrome\userChrome.css
M:\FirefoxPortable\Data\profile\chrome\userChrome.js


●必要なuserChrome.js用スクリプト(ほにゃらら.uc.js)を用意して『chrome』フォルダ内に入れる

userChrome.cssに必要な記述を追加する※後述


userChrome.cssおよびほにゃらら.uc.jsの文字コードはUTF-8です。

Firefox Portableで使うuserChrome.cssはShift-Jisと書いてあるサイトがありましたが、私の環境ではFirefox PortableもuserChrome.cssおよびほにゃらら.uc.jsの文字コードはUTF-8でOKでした。


●念の為、about:configにて toolkit.legacyUserProfileCustomizations.stylesheets
をtrueにする
※なければ新規作成する。


●Firefox 本体を再起動する

これでFirefoxを多少自由にいじくれるようになります。





さて、万が一色々吹っ飛んだ時のために、導入したほにゃらら.uc.jsの一覧
および
userChrome.cssの中身
および
about:configで変更したもの(メモが残っている範囲で)

を書いておきます。

タブを下にする
多段タブ
既読・未読の色やマウスオーバーした時の色・挙動を自分好みに変更
タブロック
タブプロテクト
タブロック&タブプロテクト
再起動ボタン
再起動メニュー
不要なコンテキストメニューを非表示
多段ブックマークバー(MAX10段・変更できる/フェードインは個人的になしにしてあります。)
ブックマークアイコンの色を変更
アドレスバーを拡大しない
画像を右クリックで拡大・縮小・回転
『画像だけを表示』を新しいタブで開く
ツールバーボタンをいくつか追加
『Ctrl+F』で検索バーの表示切り替え
タブをダブルクリックでリロード


もしかして記述漏れがあるかもしれません。


既読・未読の色やマウスオーバーした時の色・挙動を自分好みに変更についておおまかに書くと、

タブをマウスオーバー・・・タブの右側に閉じるボタン(『X』ボタン)が表示

アクティブタブ・・・背景黄色で透過・文字黒で太字・タブの上に黒い線

非アクティブタブ(未読)・・・背景薄い灰色を透過・文字は薄い紫
非アクティブタブ(既読)・・・背景少し濃い灰色を透過・文字は黒

アクティブタブをマウスオーバー・・・『X』ボタン以外は変わらず
非アクティブタブ(未読)をマウスオーバー・・・背景薄い水色を透過・文字は薄いオレンジ・タブの上にピンクの線
非アクティブタブ(既読)をマウスオーバー・・・背景少し濃い水色を透過・文字は黒で太字・タブの上に濃いピンクの線

読み込み途中?で遷移したタブ(読み込み終了時にアクティブではないタブ?)・・・文字が濃いピンク色
※私はFirefoxを起動してもいきなり全タブ読み込まない設定にしてあります。

***追記***
この記事の最後に追記してありますが、
※バージョン96.0でアクティブタブの枠がつくようになりました(角丸で1・2pxくらい?)。

※いつの頃からなのか覚えてませんが、少なくともバージョン96.0では
・非アクティブタブ(未読)をマウスオーバー時の『タブの上にピンクの線』
・非アクティブタブ(既読)をマウスオーバー時の『タブの上に濃いピンクの線』
が機能してません。
******


仕事で使ってるので常にタブを30~50個以上開いているので、
どのタブを開いたのか・どのタブを再起動してから読んでないのか等がはっきりわかるようにしました。



●導入したほにゃらら.uc.jsの一覧
AddonsPage_fx72.uc.js
addRestartButton.uc.js
contextMenuImageRotate.uc.js
Firefox_ToolBarButtons.uc.js
ImageZoomINcontentAreaContextMenu.uc.js
MultiRowTabLiteforFx.uc.js
OpenWith_1.2.1b.uc.js
setAttribute_unread.uc.js
tabLock_mod2.uc.js
tabProtect_mod2.uc.js
toggle-findbar.uc.js
unreadTabs.uc.js
viewImageInNewTab.uc.js
zzzz-tabContextMenu_combining_tabProtect_and_tabLock.uc.js
タブをダブルクリックでリロードv2.uc.js


tabProtect_mod2.uc.jsは134・135行目の
margin-top: 0x; /*要調整*/
margin-left: 0px; /*要調整*/

margin-top: -8px; /*要調整*/
margin-left: 1px; /*要調整*/
に変更しました。



setAttribute_unread.uc.jsは2行目の
chrome://browser/content/browser.xul

chrome://browser/content/browser.xhtml
に変更しました。



動かないスクリプトがある場合は
①修正版がないか探してみる
②chrome://browser/content/browser.xul を chrome://browser/content/browser.xhtml に変更してみる
等試してください。



●userChrome.cssの中身
※以下、アメブロの仕様でスマホだと完全表示できません。

@charset "utf-8";



#titlebar { -moz-box-ordinal-group: 3; }



/* メニューを上へ移動 */
#toolbar-menubar { position: fixed; display: inline-flex; }
[sizemode="maximized"]:not([tabsintitlebar="true"]) #toolbar-menubar,
[sizemode="normal"] #toolbar-menubar { top: 1px; }
[sizemode="maximized"] #toolbar-menubar { top: 8px; }



/* ツールバーの上にメニューバーのスペースを確保する */
#navigator-toolbox:not([inFullscreen="true"]) { border-top: solid 30px transparent !important; }



/* ブックマークアイコンの色を変更 */
.bookmark-item[container] {fill:#e8bb00 !important;}







/* ●多段タブ */
:root{ --multirow-n-rows: 5}



#tabbrowser-tabs{
min-height: unset !important;
padding-inline-start: 0px !important
}



/* Test for Firefox > 66 */
@supports (inset-block:auto){
#tabbrowser-tabs > .tabbrowser-arrowscrollbox > .arrowscrollbox-scrollbox{
display: flex;
flex-wrap: wrap;
overflow-y: auto;
max-height: calc(var(--tab-min-height) * var(--multirow-n-rows));
scrollbar-color: var(--toolbar-bgcolor) var(--lwt-accent-color);
scrollbar-width: thin;
}
#tabbrowser-tabs > .tabbrowser-arrowscrollbox {
overflow: -moz-hidden-unscrollable;
display: block;
}
}



/* Test for Firefox < 66 */
@supports not (inset-block:auto){
#tabbrowser-tabs > .tabbrowser-arrowscrollbox{
min-height: unset !important;
}
#tabbrowser-tabs .scrollbox-innerbox{
display: flex;
flex-wrap: wrap;
}
#tabbrowser-tabs .arrowscrollbox-scrollbox {
overflow: -moz-hidden-unscrollable;
display: block;
}
}



.tabbrowser-tab{ height: var(--tab-min-height); }
#tabbrowser-tabs .tabbrowser-tab[pinned]{
position: static !important;
margin-inline-start: 0px !important;
}





.tabbrowser-tab > stack{ width: 100%; height: 100% }



#tabbrowser-tabs .scrollbutton-up,
#tabbrowser-tabs .scrollbutton-down,
#alltabs-button,
:root:not([customizing]) #TabsToolbar #new-tab-button,
#tabbrowser-tabs spacer,
.tabbrowser-tab::after{ display: none !important }







/* タブ幅の設定 */
.tabbrowser-tab[fadein]:not([pinned]) {
min-width: 150px !important;/* タブ幅の設定 最小値 デフォルト 76px */
max-width: 250px !important;/* タブ幅の設定 最大値 デフォルト 225px */
flex-grow: 1;

/* 上記の幅設定では、タブ幅は可変されます(minとmaxを一緒にすれば固定になります) */
}



/* 非アクティブタブにマウスを載せた時に閉じるボタンを表示する */
/* Showing close button on tabs */
.tabbrowser-tab:not(:hover) .tab-close-button{ display:none; }
.tabbrowser-tab:not([pinned]):hover .tab-close-button{ display:block !important; }




/* ******************●追加●****************** */
/* https://dev.macha795.com/firefox72-unread-tab-customize-enable/ */



/* 色は https://note.cman.jp/color/base_color.cgi */
/* https://developer.mozilla.org/ja/docs/Web/CSS/color_value */
/* 説明 http://ssbsblg.blogspot.com/2020/05/22.html */


/* 選択中のタブ */
.tabbrowser-tab[selected] .tab-text {
font-weight: bold !important;
}





/* アクティブタブ */
.tab-background[multiselected="true"], .tab-background[selected="true"] {
background-color: rgb(255,255,0,0.5) !important;
}


/* ダークテーマの場合はこのコードを追加する(改変厳禁) */
#tabbrowser-tabs:not([movingtab]) > #tabbrowser-arrowscrollbox > .tabbrowser-tab > .tab-stack > .tab-background[multiselected="true"]:-moz-lwtheme, #tabbrowser-tabs:not([movingtab]) > #tabbrowser-arrowscrollbox > .tabbrowser-tab > .tab-stack > .tab-background[selected="true"]:-moz-lwtheme {
background-image: none !important;
}


/* 非アクティブタブ */
.tabbrowser-tab {
background-color: rgb(128,128,128,0.1) !important;
}


/* 非アクティブタブ(マウスオーバー) */
.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected="true"]):not([multiselected]) {
background-color: transparent; !important;
background-color: rgb(0,255,255,0.2) !important;
}


/* ●既読の非アクティブタブ・マウスオーバーで文字を太字 */
.tabbrowser-tab:hover:not([visuallyselected="true"]):not([multiselected])>.tab-stack>.tab-content {
font-weight: bold !important;
color: rgb(0,0,0) !important;
}



/* ******************●未読タブunreadTabs.uc.js●****************** */

/* https://egg.5ch.net/test/read.cgi/software/1544138804/236-239 */

/* 未読タブのタイトル文字色を変更する */
.tabbrowser-tab[unread="true"] .tab-text {
color: mediumvioletred !important;
font-weight: bold !important;
}
/* 非ロードTabのタイトル文字色の変更 */
.tabbrowser-tab[pending="true"] .tab-text {
color: #1E0EBE !important;
font-weight: bold !important;
}
/* タブ復元時にまだ読み込まれていないタブを半透明化する */
.tabbrowser-tab[pending] {
opacity: .6 !important;
}


/* 非ロードTab・マウスオーバーで文字を太字 */
.tabbrowser-tab:hover[pending="true"] .tab-text {
font-weight: bold !important;
color: rgb(255,0,0) !important;
}


/* ●非アクティブタブ上部の線(マウスオーバー) */
.tabbrowser-tab:hover > .tab-stack > .tab-background > .tab-line:not([selected="true"]):not([multiselected]) {
background-color: deeppink !important;
}

/* ●既読・非アクティブのタブの背景色 */
.tabbrowser-tab:not([selected]):not([unread="true"]) {

background-color: rgb(128,128,128,0.3) !important;
}





/* ●アドレスバーを拡大しない● */
/* based on https://old.reddit.com/comments/fwhlva//fmolndz */
#urlbar[breakout][breakout-extend]:not([open]) {
top: calc((var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2) !important;
left: 0 !important;
width: 100% !important;
}
#urlbar[breakout][breakout-extend]:not([open]) > #urlbar-input-container {
height: var(--urlbar-height) !important;
padding-block: 0px !important;
padding-inline: 0px !important;
}
#urlbar[breakout][breakout-extend][breakout-extend-animate] > #urlbar-background {
animation-name: none !important;
}
#urlbar[breakout][breakout-extend]:not([open]) > #urlbar-background {
box-shadow: none !important;
}







/* ******************●コンテキストメニューを削除●****************** */
/*
先頭の/*を追加/削除することでメニューの表示/非表示を制御出来ます。お好みで変更してください。先頭の/*を追加すると表示で、削除すると非表示です。

※全角文字を含む場合(拡張機能用の[スクリーンショットを撮る]を指定する場合)、@charsetの指定が必要になります。また、userChrome.cssファイルを指定した文字コードで保存してください。
*/


/* ファイルの文字コードを設定 */
@charset "UTF-8";

/* コンテキストメニューを削除 */
/* v82.20201031 */
/* see https://www.bugbugnow.net/2017/12/firefox-quantum-57.html */
/* #mainPopupSet, /* ポップアップ */
/* #tabContextMenu, /* タブコンテキストメニュー */
/* #context_reloadTab, /* [タブを再読み込み] */
#context_reloadSelectedTabs, /* [タブを再読み込み] 67+ */
#context_toggleMuteTab, /* [タブをミュート] */
#context_toggleMuteSelectedTabs,/* [タブをミュート] 67+ */
/* #context_pinTab, /* [タブをピン留め] */
/* #context_unpinTab, /* [タブのピン留めを外す] */
/* #context_pinSelectedTabs, /* [タブをピン留め] 67+ */
/* #context_unpinSelectedTabs, /* [タブのピン留めを外す] 67+ */
/* #context_duplicateTab, /* [タブを複製] */
/* #context_duplicateTabs, /* [タブを複製] 67+ */
/* #context_duplicateTabs + menuseparator, /* [区切り] 67+ */
#context_selectAllTabs, /* [すべてのタブを選択] 64+ */
#context_bookmarkSelectedTabs, /* [タブをブックマーク...] */
#context_bookmarkTab, /* [タブをブックマーク] 64+ */
#context_reopenInContainer, /* [コンテナーを開きなおす] */
#context_moveTabOptions, /* [タブを移動] 64+ */
#moveTabOptionsMenu, /* [タブ移動] 67+ */
/* #context_moveToStart, /* [最初のタブへ移動] 67+ */
/* #context_moveToEnd, /* [最後のタブへ移動] 67+ */
#context_openTabInWindow, /* [新しいウィンドウへ移動] 67+ */
#context_sendTabToDevice, /* [タブを端末へ送信] */
#context_sendTabToDevice + menuseparator, /* [区切り] */
/* #context_reloadAllTabs, /* [すべてのタブを再読み込み] 78- */
#context_bookmarkAllTabs, /* [すべてのタブをブックマーク...] 78- */
/* #context_closeTabOptions, /* [複数のタブを閉じる] 78+ */
/* #context_closeTabsToTheEnd, /* [右側のタブをすべて閉じる] */
/* #context_closeOtherTabs, /* [他のタブをすべて閉じる] */
/* #context_undoCloseTab, /* [閉じたタブを元に戻す] */
#context_closeTab, /* [タブを閉じる] */
#context_closeSelectedTabs, /* [タブを閉じる] 67+ */
/* #context_closeSelectedTabs + menuseparator, /* [区切り] */
/* #contentAreaContextMenu, /* コンテキストメニュー */
/* #context-navigation, /* [ナビゲート] */
/* #context-back, /* [戻る] */
/* #context-forward, /* [進む] */
/* #context-reload, /* [更新] */
/* #context-stop, /* [停止] */
/* #context-bookmarkpage, /* [ブックマーク] */
/* #context-sep-navigation, /* [区切り] */
#page-menu-separator, /* [区切り] */
/* #spell-no-suggestions, /* [(修正候補がありません)] */
/* #spell-add-to-dictionary, /* [辞書に追加] */
/* #spell-undo-add-to-dictionary, /* [辞書への追加を元に戻す] */
/* #spell-suggestions-separator, /* [区切り] */
#context-openlinkincurrent, /* [選択した URL を開く] */
#context-openlinkincontainertab,/* [Open Link in New Personal Tab] */
/* #context-openlinkintab, /* [リンクを新しいタブで開く] */
#context-openlinkinusercontext-menu, /* [リンクを新しいコンテナータブで開く] */
#context-openlink, /* [リンクを新しいウィンドウで開く] */
/* #context-openlinkprivate, /* [リンクを新しいプライベートウィンドウで開く] */
#context-sep-open, /* [区切り] */
#context-bookmarklink, /* [このリンクをブックマーク] */
/* #context-savelink, /* [名前を付けてリンク先を保存...] */
#context-savelinktopocket, /* [リンクを Pocket に保存] */
#context-sendlink, /* ※[リンクのURLをメールで送信] */
#context-copyemail, /* [メールアドレスをコピー] */
/* #context-copylink, /* [リンクの URL をコピー] */
/* #context-sep-copylink, /* [区切り] */
/* #context-media-play, /* [再生] */
/* #context-media-pause, /* [一時停止] */
/* #context-media-mute, /* [ミュート] */
/* #context-media-unmute, /* [ミュート解除] */
/* #context-media-playbackrate, /* [再生スピード] */
/* #context-media-loop, /* [連続再生] */
/* #context-media-showcontrols, /* [コントロールを表示] */
/* #context-media-hidecontrols, /* [コントロールを隠す] */
#context-video-fullscreen, /* [全画面表示] */
#context-leave-dom-fullscreen, /* [全画面表示モードを終了] */
#context-media-sep-commands, /* [区切り] */
#context-reloadimage, /* [画像を再読み込み] */
/* #context-viewimage, /* [画像だけを表示] */
#context-viewvideo, /* [動画だけを表示] */
/* #context-copyimage-contents, /* [画像をコピー] */
/* #context-copyimage, /* [画像の URL をコピー] */
/* #context-copyvideourl, /* [動画の URL をコピー] */
/* #context-copyaudiourl, /* [音声の URL をコピー] */
/* #context-sep-copyimage, /* [区切り] */
/* #context-saveimage, /* [名前を付けて画像を保存...] */
#context-sendimage, /* [画像の URL をメールで送信...] */
#context-setDesktopBackground, /* [デスクトップの背景に設定...] */
#context-blockimage, /* ※[画像をブロックする] */
/* #context-viewimageinfo, /* [画像の情報を表示] */
/* #context-viewimagedesc, /* [画像の詳細情報を表示] */
/* #context-savevideo, /* [名前を付けて動画を保存...] */
/* #context-saveaudio, /* [名前を付けてオーディオを保存...] */
/* #context-video-saveimage, /* [スナップショットを保存...] */
#context-sendvideo, /* [動画の URL をメールで送信...] */
#context-sendaudio, /* [音声の URL をメールで送信...] */
/* #context-ctp-play, /* [このプラグインを有効化] */
/* #context-ctp-hide, /* [このプラグインを非表示] */
/* #context-sep-ctp, /* [区切り] */
/* #context-savepage, /* [名前を付けてページを保存...] */
#context-pocket, /* [ページを Pocket に保存] */
#context-sep-sendpagetodevice, /* [区切り] */
#context-sendpagetodevice, /* [ページを端末へ送信] */
#context-sendpage, /* ※[ページのURLをメールで送信] */
#context-sep-viewbgimage, /* [区切り] */
#context-viewbgimage, /* [背景画像だけを表示] */
/* #context-undo, /* [元に戻す] */
/* #context-sep-undo, /* [区切り] */
/* #context-cut, /* [切り取り] */
/* #context-copy, /* [コピー] */
/* #context-paste, /* [貼り付け] */
/* #context-delete, /* [削除] */
/* #context-sep-paste, /* [区切り] */
/* #context-selectall, /* [すべて選択] */
/* #context-sep-selectall, /* [区切り] */
#context-keywordfield, /* [この検索にキーワードを設定...] */
/* #context-searchselect, /* [[-をweb検索]] */
#context-sep-sendlinktodevice, /* [区切り] */
#context-sendlinktodevice, /* [リンクを端末へ送信] */
/* #frame-sep, /* [区切り] */
/* #frame, /* [このフレーム] */
/* #context-viewpartialsource-selection, /* [選択した部分のソースを表示] */
/* #context-viewpartialsource-mathml, /* [MathML のソースを表示] */
/* #context-sep-viewsource, /* [区切り] */
/* #context-viewsource, /* [ページのソースを表示] */
/* #context-viewinfo, /* [ページの情報を表示] */
/* #context-metadata, /* ※[プロパティを表示する] */
/* #spell-separator, /* [区切り] */
/* #spell-check-enabled, /* [スペルチェックを行う] */
/* #spell-add-dictionaries-main, /* [辞書を追加...] */
/* #spell-dictionaries, /* [言語] */
/* #context-spell-check-enabled, /* ※[スペルチェックを有効にするチェックボックス] */
/* #context-sep-bidi, /* [区切り] */
/* #context-bidi-text-direction-toggle, /* [テキストの記述方向を切り替える] */
/* #context-bidi-page-direction-toggle, /* [ページの記述方向を切り替える] */
/* #fill-login-separator, /* [区切り] */
/* #fill-login, /* [ログイン情報を入力] */
/* #inspect-separator, /* [区切り] */
/* #context-inspect-a11y, /* [アクセシビリティプロパティを調査] 67+ 82+ */
/* #context-inspect, /* [要素を調査] 82+ */
/* #context-media-eme-separator, /* [区切り] */
/* #context-media-eme-learnmore, /* [DRM の詳細...] */
/* #placesContext, /* ブックマークメニュー */
/* #placesContext_open, /* [開く] */
/* #placesContext_open\:newtab, /* [新しいタブで開く] */
/* #placesContext_openContainer\:tabs, /* [タブですべて開く] */
/* #placesContext_openLinks\:tabs, /* [タブですべて開く] */
/* #placesContext_open\:newwindow, /* [新しいウィンドウで開く] */
/* #placesContext_open\:newprivatewindow, /* [新しいプライベートウィンドウで開く] */
/* #placesContext_openSeparator, /* [区切り] */
/* #placesContext_new\:bookmark, /* [新しいブックマーク...] */
/* #placesContext_new\:folder, /* [新しいフォルダー...] */
/* #placesContext_new\:separator, /* [新しい区切り] */
/* #placesContext_newSeparator, /* [区切り] */
/* #placesContext_createBookmark, /* [ページをブックマークに追加] */
/* #placesContext_cut, /* [切り取り] */
/* #placesContext_copy, /* [コピー] */
/* #placesContext_paste, /* [貼り付け] */
/* #placesContext_editSeparator, /* [区切り] */
/* #placesContext_delete, /* [削除] */
/* #placesContext_delete_history, /* [ページを削除] */
/* #placesContext_deleteHost, /* [このサイトの履歴を消去] */
/* #placesContext_deleteSeparator, /* [区切り] */
/* #placesContext_sortBy\:name, /* [名前順に並べ替える] */
/* #placesContext_reload, /* [ライブブックマークを再読み込み] */
/* #placesContext_show\:info, /* [プロパティ] */
/* #pageActionPanel, /* ページアクション */
/* #pageAction-panel-bookmark, /* [このページをブックマーク] */
/* #pageAction-panel-pocket, /* [ページを Pocket に保存] */
/* #pageAction-panel-pinTab, /* [タブをピン留め][タブのピン留めを外す] */
/* #pageAction-panel-bookmarkSeparator, /* [区切り] */
/* #pageAction-panel-copyURL, /* [リンクをコピー] */
/* #pageAction-panel-emailLink, /* [ページの URL をメールで送信...] */
#pageAction-panel-sendToDevice, /* [1 個のタブを端末へ送信] */
#pageAction-panel-shareURL, /* [共有] */
/* #pageAction-panel-screenshots_mozilla_org, /* [スクリーンショットを撮る] */
/* #pageAction-panel-builtInSeparator, /* [区切り] */
#context-dummy-dummy-dummy /* ダミー */
{
display: none !important;
}

/* 「…で検索: "…"」を削除 */
/* リンクを右クリックした場合、削除する。 */
/* 選択中のテキストがある場合、削除しない。 */
#context-copylink:not([hidden]) ~ #context-copy[hidden] ~ #context-searchselect, /**/
#context-dummy-dummy-dummy /* ダミー */
{
display: none !important;
}

/* コンテキストメニューを削除(拡張機能用) */
/* @charsetとuserChrome.cssの文字コードに注意 */
menuitem[label="Take a Screenshot"], /* スクリーンショットを撮る */
/* menuitem[label="スクリーンショットを撮る"], /* スクリーンショットを撮る */
/* menuitem[label="NoScript"], /* NoScript */
#context-dummy-dummy-dummy /* ダミー */
{
display: none !important;
}




/* ******************●ブックマークバーを多段●****************** */
/* ●--bookmark_items_lines: 3;」で段数を変更で段数を変更する● */
/* ●右側に動作しないスクロールバーが出てくるので、不要なら#personal-bookmarks #PlacesToolbarに「scrollbar-width: none !important;」を入れると非表示になる。
● */
/*ブックマークツールバーに表示されるブックマークの幅を狭めたいなら。#navigator-toolbox #PersonalToolbarに
toolbarbutton.bookmark-item {
max-width: 100px !important;
}
のコードを記述● */


/* Firefox Quantum userChrome.css tweaks ************************************************/
/* Github: https://github.com/aris-t2/customcssforfx ************************************/
/****************************************************************************************/


/* NOTE ********************************************************************************/
/* Variables are set inside '.\config\' folders CSS files, if complete package is used! */

/* import old button/bookmark size code *************************************************/
@import "./../buttons/buttons_on_bookmarks_toolbar_old_size_and_appearance.css";

:root {
--bookmark_items_height: 22px; /* <- bookmark items - line height */
--bookmark_items_lines: 10; /* <- maximum amount of lines */
}

#PersonalToolbar {
min-height: var(--bookmark_items_height) !important;
max-height: calc(var(--bookmark_items_height)*(var(--bookmark_items_lines))) !important;
}

#personal-bookmarks,
#PlacesToolbar > hbox {
display: block;
}

#PlacesToolbarItems {
display: flex;
flex-wrap: wrap;
overflow-x: visible;
overflow-y: auto;
}

#PlacesToolbarItems > .scrollbox-innerbox {
display: flex;
flex-wrap: wrap;
overflow-x: hidden !important;
overflow-y: visible !important;
max-height: calc(var(--bookmark_items_height)*(var(--bookmark_items_lines))) !important
}

#personal-bookmarks #PlacesToolbar {
display: block;
min-height: 0;
overflow-x: hidden;
overflow-y: auto;
max-height: calc( var(--bookmark_items_lines) * var(--bookmark_items_height) );
scrollbar-width: none !important;
}

#personal-bookmarks #PlacesToolbar > .bookmark-item{
visibility: visible !important;
}

#personal-bookmarks #PlacesToolbar .chevron{
visibility: collapse;
}
#personal-bookmarks #PlacesToolbar > hbox > hbox{
overflow-x: hidden;
overflow-y: hidden;
}

#personal-bookmarks #PlacesToolbar #PlacesToolbarDropIndicator[collapsed="true"],
#personal-bookmarks #PlacesToolbar #PlacesToolbarDropIndicator{
display: none;
}

#personal-bookmarks #PlacesToolbar toolbarbutton.bookmark-item{
padding-top: 2px !important;
padding-bottom: 2px !important;
margin-top: 0px !important;
margin-bottom: 1px !important;
vertical-align: middle;
}

/*
#personal-bookmarks #PlacesToolbar toolbarbutton.bookmark-item:hover:active:not([disabled="true"]),
#personal-bookmarks #PlacesToolbar toolbarbutton.bookmark-item[open="true"] {
padding-top: 2px !important;
padding-bottom: 2px !important;
}
*/
#personal-bookmarks #PlacesToolbar toolbarseparator{
-moz-appearance: none !important;
visibility: visible !important;
display: inline;
text-shadow: none !important;
border-left: 3px solid ThreeDShadow !important;
border-right: 3px solid ThreeDHighlight !important;
vertical-align: middle;
}

#personal-bookmarks toolbarbutton.bookmark-item[dragover][open]{
-moz-appearance: toolbarbutton;
}

#navigator-toolbox #PersonalToolbar {
max-height: calc( var(--bookmark_items_lines) * var(--bookmark_items_height) ) !important;
}




/* ブックマークツールバー上部余白調整 */

#PersonalToolbar {

margin-top: -2px !important;

}



/* 透過フェードインフェードアウト */
/*
#PlacesToolbarItems:hover{
transition-delay: 0.1s !important;
opacity: 1 !important;
}


#PlacesToolbarItems{
opacity: 0.3 !important;
transition-delay: 2s !important;
transition-duration: 1s !important;
}
*/






●about:configで変更したもの(メモが残っている範囲で)
toolkit.legacyUserProfileCustomizations.stylesheets を  true
browser.tabs.insertRelatedAfterCurrent を true

browser.tabs.closeWindowWithLastTab を false
browser.search.openintab を true

browser.tabs.loadBookmarksInTabs を true

browser.urlbar.autoFill を false

browser.cache.disk.smart_size.enabled を false

media.gpu-process-decoder を false
browser.urlbar.openintab を true


他にもいくつか変更したはずですがメモの残っているのはこれだけでした。
たぶん上記userChrome.cssおよびほにゃらら.uc.jsに必要な変更は書いてあるはずです。

userChrome.cssの記述内容はあくまで私が使いやすいように試行錯誤した内容なので、変更したい場合はググってご自由に使ってくださいませ。




***追記***
ここに追記していた内容を編集していたら間違って消してしまったのですが、今回WaterfoxからFirefoxにしたのが4つあります。

Firefox(Win10・64bit)のビジネス用
Firefox(Win10・64bit)のプライベート用
Firefox(Win8・64bit)
Firefox Portable(USB)

のFirefoxのうち、アドレスバー(ロケーションバー)にURLを手入力してエンター押しても無反応でタブに開けないFirefoxが2つあり、調べた結果その2つのFirefoxはtabLock_mod2.uc.jsを削除するとアドレスバーの挙動が正常になりました。

tabLock_mod2.uc.jsの何が悪いのかわからなかったのですが、最終的には
https://github.com/alice0775/userChrome.js
の84フォルダ(4つのFirefoxのバージョンと同じ数字のフォルダ名)の中にあるtabLock_mod2.uc.jsと差し替えたら正常になりました。

私がバージョンミスってたのかもしれません。。。



***さらに追記***
バージョン89.0でブックマークツールバーの下に1行余白?が表示され、調べたら
about:config
にて
browser.proton.enabled を false にすれば消えます。

その他
https://it.srad.jp/story/21/06/02/1655255/



***さらに追記***
92.0で
・多段タブじゃなくなった
・タブバーの上の余白が元に戻った。
ので以下の変更・確認にて元通りになりました。


【変更】
というか上書きです。
https://github.com/alice0775/userChrome.js
にて『Code』→『Download ZIP』で全部DLして解凍して『92』フォルダ内のファイルで上書き
※config.js・config-prefs.js・userChrome.jsの3つ


Firefoxを再起動して正常なら以下の確認は不要です。


【確認】
①念の為、以下を確認

about:configにて

browser.proton.contextmenus.enabled
browser.proton.doorhangers.enabled
browser.proton.enabled
browser.proton.modals.enabled
と一応
browser.proton.places-tooltip.enabled
※後々見たら設定すらしてませんでした。

のすべてをfalseにする



②念の為、多段タブ.zipにてMultiRowTabLiteforFx.uc.jsを用意

https://u6.getuploader.com/script/download/2034
をDLして、好みの MultiRowTabLiteforFx.uc.js を使用する。

私は
多段タブ Firefox 89+

タブの高さと見た目を90以前のProton falseにする

03

MultiRowTabLiteforFx.uc.js

これを使ってます。



【その他】
ブックマークやメニューの項目間の余白をもとに戻すというか狭めるにはuserChrome.cssに


/* ブックマークとメニューの項目間の余白幅 */
menupopup > menuitem,
menupopup > menu {
padding-block: 0.15em !important;
}

:root {
--arrowpanel-menuitem-padding: 3px 6px !important;
}

を追加。



***さらに追記***
※バージョン96.0でアクティブタブの枠がつくようになりました(角丸で1・2pxくらい?)。

アクティブタブの枠が太くなってタブを何十個開いていても見やすくなり、アクティブタブの枠が太くなる以外の色・挙動は今までと同じなのでこのまま使います。

※いつの頃からなわかりませんが、少なくともバージョン96.0では
・非アクティブタブ(未読)をマウスオーバーの『タブの上にピンクの線』
・非アクティブタブ(既読)をマウスオーバーの『タブの上に濃いピンクの線』
が機能してません。

それ以外は多段タブ・多段ブックマークもバージョン96.0でも問題ありません。