about:config CSS-Schnipsel

clio

Hallo liebes Forum,

ich würde gerne auf der Seite about:config den Rand des Suchfeldes farblich verändern.

Es geht um den Bezeichner #about-config-search in meiner user.Content.css. Ich nutze ein dunkles Systemtheme und zusätzlich in den

Einstellungen unter Farben - Farben verwalten - Oben ausgewählte Farben ..... den Wert "immer", damit alle Farben zusammenpassen.

Leider wird durch diese Einstellung aber der Rand des Suchfeldes in weiß dargestellt, was sich nun störend zum Rest der Anzeige auswirkt.

Den Feldinhalt kann ich verändern, aber leider nicht den Rand.

Wenn das überhaupt möglich ist mit meinen Einstellungen, würde ich mich freuen, wenn jemand eine Idee dazu hätte.

Dharkness

Zitat von clio

Es geht um den Bezeichner #about-config-search in meiner user.Content.css.

Hm, die ID hast Du doch schon jetzt brauchst Du doch nur noch etwas passendes bauen.

CSS

#about-config-search {
    border: 1px solid #F20 !important;
}

grisu2099

Wo ist das Problem?

Den richtigen Selektor hast du doch?
Hier funktioniert das einwandfrei...

clio

Nein, leider nicht durch die Einstellung in "Farben verwalten".

Ich suche nach einer Möglichkeit, dies zu übergehen, finde aber leider nichts.

grisu2099

Hast du den ccs-Schnipsel aus #2 ausprobiert?

Der funktioniert doch...

clio

Ja, selbstverständlich, das war auch meine erste Einstellung.

Das Problem ist doch die Einstellung in "Farben verwalten". Sobald man die selbst gewählten Farben dort einträgt, obwohl sich diese ja nur auf Hintergrund und Text beziehen, wird die Möglichkeit wie von mir oben beschrieben ausgeschaltet.

Probiers mal bei Dir ...

und Danke für Deine Antwort.

2002Andreas

Zitat von clio

Probiers mal

ist hier auch so.

Wie man das umgehen kann, bin ich allerdings überfragt

Auch mit einem Skript lässt sich der Rahmen dann nicht farblich ändern.

clio

Vielen Dank Andreas für Deine Bestätigung, das hab ich mir schon gedacht. Ich habe lange rumgesucht und ausprobiert und letztlich nichts gefunden, schade auch.

Na ja, so oft ruft man das auch nicht auf ...

2002Andreas

Zitat von clio

schade auch.

Gedulde dich bitte, evtl. fällt einem anderen User ja noch etwas dazu ein.

Ich bin ja kein Fachmann wie man so sagt.

clio

Stell Dein Licht mal nicht unter den Scheffel ... wie man so schön altertümlich sagt ...:-)

grisu2099

Also hier wird nix überschrieben...

Probiert bitte selber mit folgender CSS für about:config:

CSS

@-moz-document url("about:config") {


    /*** Hintergrund allgemein ***/
html,
body {
    background-color: rgb(40,40,42) !important; 
    color: white !important;
    }

:root {
    --in-content-border-active-shadow: unset !important;
    --in-content-border-active: 1px solid red !important;
    }

    /*** Warnseite ***/
.container {
    border: 2px ridge lightgrey !important;
    border-radius: 20px !important;
    padding: 80px 27px 76px 80px !important;
    }
.title {
    border: 2px ridge lightgrey !important;
    border-radius: 20px !important;
    background-position: 280px 20px !important;
    background-color: rgb(200,0,0) !important;
    min-width: 200px !important;
    max-width: 625px !important;
    padding: 25px 0 0 100px !important;
    margin-left: 0 !important;
    }
#warningTitle {
    color: white !important;
    margin-left: 250px !important;
    }
#warningText,
#showWarningNextTime {
    padding-left: 20px !important;
    }
#showWarningNextTime {
    border: 2px ridge lightgrey !important;
    border-radius: 5px !important;
    fill: rgb(0,200,0) !important;
    height: 24px !important;
    }
input[type="checkbox"] {
    background-color: black !important;
    }
input[type="checkbox"]:checked {
    background-image: url("file:///F:/FIREFOX-ICONS/Icons/checkmark.png") !important;
    }

#warningButton {
    border: 2px ridge lightgrey !important;
    border-radius: 10px !important;
    background-color: red !important;
    color: white !important;
    outline: none! important;
    margin-left: 250px !important;
    }
#warningButton:hover {
    background-color: green !important;
    }

    /*** Hauptseite ***/
    /* Kopf */
#toolbar {
    background-color: rgb(40,40,42) !important;
    padding: 0 !important;
    }
#search-container {
    background: transparent !important;
    max-width: 1300px !important;
    margin: 30px 0 0 300px !important;
    }
#about-config-search {
    border: 2px ridge lightgrey !important;
    border-radius: 10px !important;
    background: black url("file:///F:/FIREFOX-ICONS/Icons/Lupe.png") no-repeat 1435px center !important;
    color: white !important;
    opacity: .99 !important;
    outline: none !important;
    max-width: 1367px !important;
    margin: 20px 50px 20px 100px !important;
    }
#about-config-show-only-modified {
    border: 2px ridge lightgrey !important;
    border-radius: 5px !important;
    width: 24px !important;
    height: 24px !important;
    fill: green !important;
    margin: 0 9px 0 -2px !important;
    }
.checkbox-container {
    margin: 0 0 0 2px !important;
    }
.checkbox-container > span:nth-child(2) {
    color: rgb(0,200,0) !important;
    }
#show-all {
    border: 2px ridge lightgrey !important;
    border-radius: 10px !important;
    background-color: green !important;
    padding: 0px 20px !important;
    }

    /* Tabelle */
#prefs {
    border: 2px ridge lightgrey !important;
    border-radius: 10px !important;
    max-width: 1705px !important;
    margin: 0 100px 50px !important;
    }
#prefs > tr:hover {
    background-color: darkgreen !important;
    }
#prefs > tr > td > button:nth-child(1) {
    border: 2px ridge lightgrey !important;
    border-radius: 5px !important;
    }
.deleted > th:nth-child(1),
.deleted > td:nth-child(2),
.deleted > td:nth-child(3),
.deleted > td:nth-child(4) {
    border-top: 2px ridge lightgrey !important;
    }
.deleted > th:nth-child(1)::before,
.deleted > td:nth-child(2)::before,
.deleted > td:nth-child(3)::before,
.deleted > td:nth-child(4)::before {
    display: none !important;
    }
input[type="radio"] {
    border: 2px ridge lightgrey !important;
    background-color: black !important;
    fill: rgb(0,200,0) !important;
    }

    /* Symbole rechts */
#prefs > tr > td.cell-reset {
    padding-right: 30px !important;
    }
.button-delete {
    fill: red !important;
    }
.button-edit {
    background-color: transparent !important;
    fill: yellow !important;
    }
.button-toggle {
    background-color: transparent !important;
    fill: green !important;
    }
.button-reset {
    fill: yellow !important;
    }
.button-add {
    background-color: transparent !important;
    fill: green !important;
    }

html body.table-shown table#prefs tr.deleted.add.odd:hover {
    background-color: rgb(40,40,42) !important;
    }


}

Alles anzeigen

Mit diesen Farbeinstellungen getestet...

Oder brauch ich doch langsam eine neue Brille?

2002Andreas

Zitat von grisu2099

Probiert bitte

Ich habe die Farbe mal auf rot geändert, zwecks besserer Erkennung:

Nichts zu sehen davon.

Du hast diese Einstellung bei dir auch so?

grisu2099

Siehe Bild in #11

2002Andreas

Zitat von grisu2099

Siehe Bild in #11

Sorry, nicht so genau beachtet

Trotzdem funktioniert es hier nicht.

So sieht das mit deinem Code hier aus:

grisu2099

Dann bin ich mit meinem Latein auch am Ende...

2002Andreas

So sieht dein Code hier aus, wenn ich das mit den Farben in den Einstellungen deaktiviere.

Ich habe dem Rahmen nur mal die Farbe rot gegeben, dann funktioniert es hier.

grisu2099

Zitat von 2002Andreas

So sieht dein Code hier aus

Hast du die Rahmenstärke auch geändert?

Kommt mir jedenfalls so vor.

2002Andreas

Zitat von grisu2099

Hast du die Rahmenstärke auch geändert?

Ja, zwecks besserer Erkennung

grisu2099

Dann funktionieren meine Augen ja noch...

2002Andreas

Zitat von grisu2099

Dann funktionieren meine Augen ja noch.

Sehr gut sogar