☰

Gibt es eine Möglichkeit, das CSS der Firefox Reader-Ansicht anzupassen?

tag-icon • tag-icon firefox fonts css stylish
Gibt es eine Möglichkeit, das CSS der Firefox Reader-Ansicht anzupassen?

Ich liebe die Reader-Ansicht von Firefox. Aber nicht die Schriftarten. Genauer gesagt sind diese nicht die beste Wahl:

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;
}

Ich hätte lieber das hier:

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;
}

Jetzt kann ich diese Änderungen jedes Mal manuell anwenden, wenn ich die Reader-Ansicht über die Entwicklertools öffne. Aber gibt es eine Möglichkeit, dies zu automatisieren?

Ich habe Stylish ausprobiert, aber entweder konnte ich es nicht richtig codieren oder Stylish war der Aufgabe nicht gewachsen.

Antwort1

Falls Sie noch nicht dazu gekommen sind, dies herauszufinden und/oder für die Nachwelt, lautet die Lösung ab FF v60 wie folgt:

  • Suchen Sie Ihren Profilordner (aufgelistet in about:support)
  • Erstellen Sie dort einen Ordner mit dem Namen "Chrome", falls dieser noch nicht vorhanden ist
  • Erstellen Sie in diesem Ordner eine Datei mit dem Namen „userContent.css“.

Dann brauchst du noch die richtige CSS-At-Regel und schon kann es losgehen:

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

NB: Sie können auch die Seitenleiste und ihre Schaltflächen gestalten, was hilfreich ist, um den Kontrast bei dunklen Designs zu reduzieren:

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

verwandte Informationen