ほぼ同じ

朝は太陽が出ていた。

午後から曇り。

夕方から雨かと思ったら、3時のおやつ頃にひと雨。

夕方からは、本格的に降るわけでもなく、降ったり止んだり。

昨日書いた、FirefoxのProtonの件、ちょこちょこと触っていたら、Proton+通常のUI密度状態でも、以前と同じようなインターフェースに出来た！

Protonでは、ボタン的なタブになっていたのを、以前通りのタブに戻せたし、URLバーや検索バーの縦幅やらメニューやアイコンの縦幅や横幅も調整し、ポップアップ・メニューの角丸を四角く出来た。
(若干気に入らないところもあるんだけれどね。)

以前とほぼ同じようになったインターフェース。

Proton有効状態でも、こういう風に出来た。
userChrome.cssが使えなくならない限り、気にしなくてよくなった。よかったよかった。

ちなみに、僕は、タブの位置はツールバーの下がいいのでそうしている。

調べてみたら、色んな人たちがuserChrome.cssを使って、以前のようなタブ形状やメニューの幅にしていた。

参考になると思うので、それらのページを。

まずは、CSSの行数がとても少ないもの。

Customize Firefox Proton Tabs · GitHub

次は、かなり凝ったもの。

GitHub - black7375/Firefox-UI-Fix: 🦊 I respect proton UI and aim to improve it.

どちらもほぼ同じ。

パッと見の大きな違いは、それぞれの最後の画像のメニューにアイコンがあるかどうか。

前者は、40行も満たないコードで、以前と同じような形状に出来ているのがすごいと思う。
それほどこだわらない人は、それで十分。

それから、ポップアップするメニューの角が丸くなっているのが気に入らない人、角ばった方が好きな人は、

* {
border-radius: 0 !important;
}

とすると、全てのポップアップ・メニューの角丸が四角くなる。

次に、タブを複数開いた状態。

前者。

後者。

それぞれによさがある。

前者は、タブの上に横棒が入っているので、どれがアクティブ・タブか、より判別しやすい。僕もそうしている。
後者は、非アクティブ・タブの横に縦線があるので、区切りがわかりやすい。僕もそうしている。(笑)

それぞれの良さを取り入れればいいと思う。

参考までに、前者のシンプルな方の最後に、以下を追加すれば

.tabbrowser-tab:not([selected="true"]) {
border-right: solid 1px #888 !important;
}

アクティブでないタブに区切り線を出せる。
簡易的だけれどね。

アクティブ・タブと非アクティブ・タブをより明確にしたいなら、上記に「opacity: 0.6 !important;」を追加するといいかも。

ちなみに、Protonではこういう感じ。

ほんのちょっとの違いなんだけれど、僕的には、やはり、Protonのボタン的タブではなく、今までのタブ形状が好きだな。

Mozillaは早く、このボタン的タブはタブではなかった！と認めて、元通りにしてくれることを願うよ。

このProtonインターフェース、タブレット向けのものだけ、ということではないらしい。

フルHDのような低DPIではなく、4Kのような高DPI向けとのこと。

確かに、高DPIだと、このくらいの幅があった方が選択しやすいのかもしれない。

そういうことなら、Protonでは、メニューの縦幅を増やした理由もわかる、かな。
タブレット向けという理由より説得力がある。

それでも、まだまだ、4Kのような高DPIのモニターを使っている人はそれほど多くはないと思う。

なんであれ、強制(強要)ではなく、オプションで選択出来るようにしてほしかったとは思う。

Proton対応、どうしようか、と思っていたけれど、結構早い段階で、全く同じではないけれど、なんとか以前とほぼ同じインターフェースに出来てよかったのである。