Firefox 97 と小規模な anti-Proton CSS の修正

私は Firefox をメインのブラウザとして使用しています。事実。どちらかがなくなるまでそうするつもりです。事実。しかし、新しい UI スタイルは無意味だと思います。それは Proton と呼ばれ、数か月前に Firefox に導入されました。しばらくの間、トグルで無効にすることができましたが、今ではトグルはありません.

正常で生産的な UI レイアウトを取り戻すために、一連の CSS ファイルの変更を通じて Firefox を手動で変更することにしました。この素敵な冒険は、プロトンを無効にする方法に関する私のガイドで詳しく説明されています.タブをより見やすくし、コンテナー タブに色を追加し、URL バーを整理しました。ここまでは順調ですが、最近リリースされたばかりのバージョン 97 で、コンテナ タブが少し乱れていることに気付きました。 CSS ルールは、以前ほどうまく機能しなくなりました。この記事では、変更したインターフェースを再びクールに見せるために必要な小さな修正の小さなセットを示します。もしあなたが私の反プロトン調整を既に使っているなら、これは役に立つはずです.

問題の詳細

これが Firefox 97 で起こることです。2 つの問題があります。アクティブなコンテナー タブの場合、上部の境界線の強調表示が部分的に隠され、アクティブなタブが見えにくくなります。タブの背景色の領域も、タブ バーの少し上に突き出ています。 2 つ目の問題は、非アクティブなタブの場合、背景領域がかなりはみ出しており、これが粗雑に見えることです。

私は、Firefox で何かを解決しようとして解決しようとしたように、これが自傷行為であることを十分に認識していますが、結果としてアーティファクトが発生しています。しかし、それは問題ありません。それは、良好で明確なコントラストとタブの簡単な分離を備えた通常の UI を得るために喜んで支払う価格だからです。もうプロトンの暴言は吐きません。

解決策

現時点で、コンテナ タブの CSS は次のとおりです:

.tabbrowser-tab[usercontextid] .tab-background {
background:var(--identity-tab-color) !important;
border-left:1px solid rgba(130, 130, 130, 0.5) !重要;
border-right:1px solid rgba(130, 130, 130, 0.5) !重要;
border-bottom:var(--identity-tab-color) !重要;
border-top:3px ベタ赤 !重要;
不透明度:0.8 !重要;
}

現在、修正は次のとおりです:

.tabbrowser-tab[usercontextid] .tab-background {
background:var(--identity-tab-color) !important;
border-left:1px solid rgba(130, 130, 130, 0.5) !重要;
border-right:1px solid rgba(130, 130, 130, 0.5) !重要;
border-bottom:var(--identity-tab-color) !重要;
不透明度:0.8 !重要;
}

.tabbrowser-tab[usercontextid] .tab-background {
border-top:3px 単色の赤 !重要;
padding-top:3px !重要;
}

.tabbrowser-tab[usercontextid]:not([selected="true"]) .tab-background {
border-top:1px solid rgba(130, 130, 130, 0.5) !重要;
padding-top:3px !重要;
}

まず、コードをいくつかのブロックに分割しました。これは、アクティブなコンテナー タブと非アクティブなコンテナー タブの上部の境界線に別の調整が必要なためです。アクティブなタブの見苦しいパディングを取り除くには、3px のパディングを追加するだけです。

によって識別される非アクティブなタブの場合:

.tabbrowser-tab[usercontextid]:not([selected="true"]) .tab-background {

上部の境界線を通常のタブとまったく同じになるように変更する必要があります (前述の 2 つのガイドを参照してください) が、パディング宣言も追加します。これにより、タブの背景が「短く」なり、つまり、タブ バーの上にはみ出さず、境界線が他のすべてのタブと一致し、見栄えが均一になります。

結論

私の微調整には一貫性の問題とメンテナンスコストがあることを認識しています。結局のところ、これまでの Firefox UI の小さな変更すべてを説明することはできず、小さな不具合が時々発生している可能性があります。しかし、これらは軽微なものであり、私はそれらを迅速に修正しますが、最適ではない外観のブラウザーを常に使用することはできません.楽しい状況ではありませんが、それでも Firefox は依然として最高のブラウザであり、実用的かつ哲学的な理由から、流行に敏感であるにもかかわらず、Firefox を使用する必要があります。

とにかく、もしあなたがオタクなら、そうでなければあなたはここにいないでしょうし、物事をきちんと、きれいに、読みやすく、人間工学に基づいて、効率的にするのが好きなら、バージョンで Firefox の UI の外観を変更したことでしょう。 91以降。あなたはおそらく私の微調整のいくつかを使用しているかもしれません.もしそうなら、あなたは Firefox 97 でいくつかの小さな問題に遭遇した場合に備えて、新たな磨きのラウンドを持っています。気をつけて、また会いましょう。

乾杯。