web-dev-qa-db-ja.com

Firefox Reader ViewのCSSをカスタマイズする方法はありますか？

Firefox ReaderViewが大好きです。しかし、そのフォントではありません。より具体的には、これらは最良の選択ではありません。

body.serif, body.serif .remove-button {
    font-family: Georgia, "Times New Roman", serif;
}

body.sans-serif, body.sans-serif .remove-button {
    font-family: Helvetica, Arial, sans-serif;
}

私はむしろこれが欲しいです：

body.serif, body.serif .remove-button {
    font-family: "Cambria", serif;
}

body.sans-serif, body.sans-serif .remove-button {
    font-family: "Open Sans", "Segoe UI", "Tahoma", "Calibri", sans-serif;
}

これで、開発者ツールを使用してリーダービューを開くたびに、これらの変更を手動で適用できます。しかし、これを自動化する方法はありますか？

Stylishを試しましたが、正しくコーディングできたか、Stylishがうまくいきませんでした。

firefoxfontscssstylish
5
user477799

まだこれを追い詰めるのに慣れていない場合、および/または後世のために、FF v60の時点で、解決策は次のとおりです。

  • プロファイルフォルダを見つけます（about:supportにリストされています）
  • そこに、「chrome」というフォルダがまだ存在しない場合は作成します
  • そのフォルダーに、「userContent.css」というファイルを作成します

次に、正しいCSS at-ruleが必要になり、準備が整います。

@-moz-document url-prefix("about:reader") {
    body.serif {
        font-family: 'Besley*' !important;
    }
}

N.B.サイドバーとそのボタンのスタイルを設定することもできます。これは、暗いテーマのコントラストを下げるのに役立ちます。

.toolbar {
    background-color: #333 !important;
    border-right: 1px solid #444 !important;
}
.button {
    color: #ccc !important;
    background-color: #444 !important;
}
3
linefeed