Icons in Kontenliste ändern

    In Betterbird 102 hatte ich die Icons in der Kontenliste per CSS-Code geändert. Das sah so aus:

    Der entsprechende Code war dieser:

    Leider funktioniert dieser Code nicht mehr unter Betterbird 115.

    Da ich mich mit CSS gar nicht auskenne (ich kann nur einen Code aus dem Forum in die userChrome.css kopieren ;) ) würde ich mich freuen wenn jemand eine Lösung hätte.

    Vielen Dank.

    Quote from Road-Runner

    Leider funktioniert dieser Code nicht mehr unter Betterbird 115.

    Offenbar funktioniert die Eigenschaft -moz-image-region nun auch in Thunderbird und demzufolge auch in Betterbird nicht mehr. Versuche stattdessen Folgendes:

    CSS
    background-image: url( … ) !important;
background-position: 5px 5px !important;
background-repeat: no-repeat !important;

    Du musst also jetzt Teileigenschaften der Sammeleigenschaft background verwenden. Die Positionierung erfolgt mit background-position: Der erste Wert ist für die horizontale Positionierung und der zweite Wert für die vertikale Positionierung. Du musst da ein bisschen zurecht schaukeln. Es lassen sich auch Ausrichtungswerte verwenden, also left, right und center. Da backgroundeigentlich für Hintergrundgrafiken gedacht ist, die man kacheln kann, musst du noch background-repeat: no-repeat verwenden, um die Kachelung zu verhindern.

    Hier noch zwei Links in Threads vom Firefox-Forum:

    -moz-image-region ersetzen, Bilddatei mit vielen Symbolen - camp-firefox.de
    […] Ich habe noch nicht verstanden, wie ich -moz-image-region ersetzen muss, wenn ich eine Datei mit vielen Symbolen nicht in einzelne Dateien aufspalten…
    www.camp-firefox.de
    -moz-image-region entfällt - camp-firefox.de
    Ich habe insgesamt 12 CSS-Codes, die o.a. Code-String enthalten. Gibt es eine Möglichkeit (Ersatz-String) um sie relativ einfach zu ändern. Beispiel:…
    www.camp-firefox.de
    Quote from Road-Runner

    das sind für mich böhmische Dörfer.

    Du wirst doch die drei Eigenschaften eintragen können: Statt list-style-image schreibst du background-image. Die Zeile mit -moz-image-region lässt du weg und schreibst dann stattdessen:

    background-position: 5px 5px !important;

    background-repeat: no-repeat !important;

    Was soll daran kompliziert sein?

    Aber ich will mal nicht so sein:

    Hallo zusammen,

    ich habe das so gelöst.

    Code geändert am 21.08.2023 um 18:45 Uhr
    So wie ich das sehe benutzt Du auch den alten Code von mir.

    Gruß

    EDV-Oldie

    Quote from dharkness21

    Teste bitte mal diese ↓ Form,

    Hallo, ich habe gerade festgestellt das man das eigentliche Icon nicht mehr ausblenden muss es geht auch ohne.

    Nachtrag:
    Ich habe den Code oben geändert. (Code geändert am 21.08.2023 um 18:45 Uhr)

    Gruß

    EDV-Oldie

    Quote from dharkness21

    Das würde aber auch so gar nicht gehen,

    Es funktioniert bei mir aber.

    Gruß

    EDV-Oldie

    Mein Code mit als base64 codierten Icons (Code entspricht dem aus Beitrag 7).

    Quote from dharkness21

    Teste bitte mal diese ↓ Form, müsste eigentlich funktionieren und würde alles ein wenig kürzen.

    CSS
    /* Posteingang */
#folderTree li[data-folder-type="inbox"] > .container > .icon {
    background: transparent url("file:///C:/Dropbox/Chrome/Icons/mail_1.png") no-repeat !important;
}

    Ich versuche das gerade für meinen Zweck zu adaptieren:

    und zwar stecken die Icons in einem einzelnen PNG und werden per Koordinaten eingeblendet.

    Bis TB102 sah das bei mir so aus:

    Etwas wie ...

    CSS
    #folderTree li[data-folder-type="sent"] > .container > .icon {
background: transparent url("folder.png") !important;
-moz-image-region: rect(0 64px 16px 48px) !important;
}

    blendet mir aber immer nur den Bereich links oben ein, weil moz-image-region wohl nicht auf background anwendbar ist.

    Wie kann man das umschiffen?

    Falls jemand evtl. noch einen Tipp hat, wie man die folder.png 1x übergeordnet definiert und dann wie im Original per Vererbung nur noch die Regionen definiert, wäre ich restlos begeistert. :)

    Quote from dharkness21

    Leider gibt es -moz-image-region nicht mehr, Du musst also einzelne Icons verwenden.

    Über background ist auch nichts zu holen?

    CSS Sprites sind doch eigentlich nach wie vor gängig, oder?

    Edit: Arg, lese gerade erst den Post #2 - habe es hinbekommen.

    Aus

    -moz-image-region: rect(0 48px 16px 32px) !important;

    wird z.B.

    background: url("folder.png") -32px 0px no-repeat !important;

    Edited 2 times, last by tiloba (October 4, 2023 at 9:32 PM).

    Quote from tiloba

    Existieren eigentlich auch noch Zustände für Dinge mit neuem Inhalt?

    Teste bitte mal etwas in der ↓ Form.

    CSS
    ul[role="group"] > li[class~="new-messages"] > .container > .icon {
    background: url(file:///Laufwerksbuchstabe:/vollständiger/Pfad/zur/Grafik/Deine_Grafik.png) no-repeat !important;
    background-position: 1px 1px !important;
}

    und wech

    Dharkness