だから、私が最初に気に入らなかったのは、役に立たないホームボタンでした。Operaには、ホームページという名前で（15+）もありました。
次に「戻る」ボタンと「遷移」ボタンがあります。
最後に、右側に追加の検索バーを表示したくありません。
最初は非常に簡単です。 フォルダ\ Application \ 1.0.83.38 \ resources \ vivaldi \ resources \に家のアイコンがあり、「symbol-home.png」という名前が表示されています。
Vivaldiの記事に関するコメントで、彼らはcommon.cssというスタイルファイルがあることを示唆しました 。 ここで、「symbol-home.png」という行を探します。
検索は単一の結果を返します。
(-webkit-min-device-pixel-ratio:2){.button-addressfield.loading,.button-tabbar.loading,.button-toolbar-small.loading,.button-toolbar.loading{background-image:url(/resources/symbol-stopload@2x.png)}}.button-addressfield.home,.button-tabbar.home,.button-toolbar-small.home,.button-toolbar.home{background-image:url(/resources/symbol-home.png)}@media
私たちがする必要があるのは、
background-image:url(/resources/symbol-home.png)
代わりに
display:none
前/後に書き込むことです。
それは判明します：
(-webkit-min-device-pixel-ratio:2){.button-addressfield.loading,.button-tabbar.loading,.button-toolbar-small.loading,.button-toolbar.loading{background-image:url(/resources/symbol-stopload@2x.png)}}.button-addressfield.home,.button-tabbar.home,.button-toolbar-small.home,.button-toolbar.home{display:none}@media
保存して確認してください。 今、愚かなボタンは本当になくなっています。
戻るボタンと遷移ボタンについて：サムネイルをすばやく検索すると、イメージ「symbol-next.png」と「symbol-rewind.png」が生成されました。
同じ手順を実行しています。
コードスニペットを見つけます。
(-webkit-min-device-pixel-ratio:2){.button-addressfield.forward,.button-tabbar.forward,.button-toolbar-small.forward,.button-toolbar.forward{background-image:url(/resources/symbol-forward@2x.png)}}.button-addressfield.next,.button-tabbar.next,.button-toolbar-small.next,.button-toolbar.next{background-image:url(/resources/symbol-next.png);min-width:24px!important;max-width:24px!important}@media
そして、「！重要」の後に追加し
;display:none
。
戻りボタンコード。
宛先：
.button-toolbar.rewind{background-image:url(/resources/symbol-rewind.png);min-width:24px!important;max-width:24px!important}@media
後：
.button-toolbar.rewind{background-image:url(/resources/symbol-rewind.png);min-width:24px!important;max-width:24px!important;display:none}@media
すべてが本当に機能します：
右側にある検索フィールドが残ります。
リソースを検索しても「input-search.png」しか得られなかったため、コードで必要なフィールドの名前を見つける問題を解決できませんでした。
それから私は少し不器用な道を行くことにしました。 ウィンドウのサイズを変更しても、フィールドのサイズは変わらないことに気付き、サイズがコードに明確に記述されていると結論付けました。 そして、通常のMSPaintでは、175ピクセルのフィールド長を測定して認識しました。
この番号を検索して、正しい行に移動しました。
.searchfield{margin:4px 4px 4px 0;background:#fff;position:relative;height:26px;flex:0 1 175px;display:flex}.searchfield
ここでは、
display:flex
代わりに、
display:none
も記述し
display:none
。
保存して実行し、私が追求した結果を確認します。
はい、インターフェースはネイティブではなく、パフォーマンスに打撃を与えますが、同時に完全なカスタマイズ性などの利点もあります。
この記事では、Vivaldiでさらに微調整ができる可能性があることを示したかっただけです。 jsファイルとcssファイルは開いた形式になっているため、ユーザーはインターフェイスを完全にアクセスおよび制御できます。 必要に応じて、独自のアイコンと機能を持つ独自のボタンをパネルに追加できます。 ユーザーが快適さのために何かを必要とする場合、彼はそれを行うことができます。
Vivaldi開発者が、将来のバージョンで* .pak拡張子を持つコンテナにこれらのファイルを隠さず、Operaのように起動時にチェックサムをチェックしないことを願っていますが、この素晴らしい機会をユーザーに残します。