Selektierte Ordner in der Folderpane

allo,

versuch's mal hiermit

html|ul#folderTree html|li[is="folder-tree-row"].selected > html|div.container {
     color: #00bbff !important; 
  background-color: black !important;
}

Zitat von Alphatier

der Eintrag funktioniert nicht.

Schau mal in meine Bildschirmkopie, dort funktioniert der Code offensichtlich (macOS).

Aber wahrscheinlich habe ich dein Problem falsch verstanden.

Bei mir funktioniert mein vorgeschlagener CSS Code nur mit der Zeile

@namespace html url("http://www.w3.org/1999/xhtml");

am Beginn der userChrome.css Datei!

Habe ich gerade eben durch Testen heraus gefunden.

Alphatier

Zitat von Alphatier

Wie sollte der Eintrag in der userChrome.css aussehen dass nur der ausgewählte Ordner farblich hervorgehoben wird?

Hallo Alphatier,

probiere mal folgendes:

/* Blau schwarz in der Folderpane */ 
#folderTree:focus-within [is="folder-tree-row"].selected > div.container {
    background-color: black !important;
    color: #00bbff !important;
}

ul[role="group"] > li[aria-selected="true"] .container {
    background-color: black !important;
    color: #00bbff !important; 
  
}

Gruß

Markus

Zitat von Alphatier

Jetzt muss ich nur noch schauen ob sich das mit meinen anderen Einträgen verträgt.

Falls dadurch andere deiner CSS Code nicht mehr funktionieren, trage sie über der @namespace Zeile in der userChrome Datei ein.

Zitat von Mapenzi

Bei mir funktioniert mein vorgeschlagener CSS Code nur mit der Zeile

@namespace html url("http://www.w3.org/1999/xhtml");

am Beginn der userChrome.css Datei!

Das liegt wohl an dem → html| Teil in Deinem CSS.

Zitat von Alphatier

wenn ich jedoch den Ordner "Entwürfe" anwähle werden alle Unterordner ebenfalls mit ausgewählt.

Jupp, vollkommen klar, hierbei muss Du den Code deutlicher präzisieren, teste bitte mal den ↓ Code.

ul > li > ul > li > ul[role="group"] > li.selected > .container,
ul > li > ul > li > ul[role="group"] > li > ul > li.selected > .container,
ul > li > ul > li > ul[role="group"] > li.selected > .container .name,
ul > li > ul > li > ul[role="group"] > li > ul > li.selected > .container .name {
    appearance: none !important;
    background-image: none !important;
    background-color: #006800 !important;
    color: #FFF !important;
}

Zitat von Alphatier

Wieso funktioniert der Code nur mit dieser Zeile?

Das kann ich dir nicht sagen, da ich zu wenig über CSS Codierung weiß.

Als ich anfing mich damit zu beschäftigen, habe ich nicht gefragt, warum da eine @namespace Zeile ganz oben in userChrome stand.

Spâter fiel mir auf, dass die meisten CSS Code auch ohne diese Formel funktionierten.

Aber einige Code brauchen offenbar immer noch den Vorspann, ohne dass ich das jetzt im einzelnen erklären kann.

Lies mal zu deiner Erbauung hier weiter

Bug 390011

@namespace - CSS: Cascading Style Sheets | MDN

@namespace is an at-rule that defines XML namespaces to be used in a CSS style sheet.

developer.mozilla.org

Why does userChrome.css require a @namespace line?

Zitat von Alphatier

Immer unter der Annahme dass sich die Codezeilen in der userChrome.css nicht "beißen", ist die Reihenfolge der Einträge eigentlich egal?

Auch da kann ich nicht mit Gewissheit antworten.

Nach meiner Erfahrung ist in der Regel egal, in welcher Reihenfolge die einzelnen Code in der Datei userChrome.css angeordnet werden.

Auch ich versuche für einen besseren Überblick, die Code nach Teiloberflächen zu gruppieren, z. B. #folderPane, #threadPane oder das Adressbuch, den Kalender oder die Tabs, ....usw . Dann muss ich nicht lange suchen beim Testen oder ändern.

Es kommt auch selten zu Inkompatibilität: ein neuer Code funktioniert nicht, wenn er sich mittendrin in der Datei befindet.

Er kann Jedoch alleine wirken, ohne den Rest der Code in der Datei, und dann auch wenn man ihn an die Spitze setzt, über die anderen Code.

Zitat von milupo

dharkness21 Diese Kopfstände sind doch gar nicht mehr nötig. Jedes Listenelement des Ordnerbereichs hat jetzt eine eigene, wenn auch sehr lange ID. Beim Erstellen eines eigenen Ordners erhält auch er eine eigene ID. Es gibt allerdings einen Haken. Die ID ist bei jedem Nutzer bzw. bei jeder Installation eine andere. Alphatier müsste also selbst mal in den Entwicklerwerkzeugen nachschauen.

Es geht nicht um die ID die das präzisieren würde, sondern die → > Zeichen selektieren präziser, in diesem Fall sind sie m.M.n. nötig, deshalb so lange Zielzeilen.

Zitat von dharkness21

Das liegt wohl an dem → html| Teil in Deinem CSS.

Vielleicht.

ìnzwischen bin ich bei

#folderPane .container {
  height: 22px !important;
  min-height: 0px !important;
}

gelandet, auch ohne die magische @namespace Formel!! >>>>>>> #55