Wie setze ich die Hintergrundfarbe für den ausgewählten Tag bei bereits veränderter Hintergrundfarbe?

• Thunderbird-Version: 102.11.0

• Betriebssystem: Windows 10 22H2

• Google-Kalender mit "Provider for Google-Calendar": nein

• Google- oder sonstiger Kalender mit WebDAV / CalDAV: nein

Dank der Hilfe hier im Forum weiß ich nun, wie ich mit einen Eintrag in userChrome.css Feiertage durch eine andere Hintergrundfarbe hervorheben kann, z.B.

/* Pfingstmontag */
.calendar-month-day-box-current-month[year="2023"][month="5"][day="29"] .calendar-month-day-box-list {
        background-color: var(--viewWeekendBackground) !important;
}

Dieser Eintrag überschreibt allerdings auch die Farbe für den ausgewählten Tag. D.h. wenn ich einen Feiertag im Kalender auswähle, ändert sich dessen Hintergrundfarbe nicht (sondern nur die Farbe des oberen Balkens, in dem die Kalenderwoche und das Datum stehen).

Ist es möglich, eine Hintergrundfarbe anzugeben, die benutzt werden soll, wenn einer der Feiertage im Kalender ausgewählt wird?

Ah, ich muss für jeden Feiertag, dessen Hintergrundfarbe ich geändert habe, zusätzlich einen Eintrag für die Hintergrundfarbe bei Auswahl machen, also z.B.

/* Pfingstmontag */
.calendar-month-day-box-current-month[year="2023"][month="5"][day="29"] .calendar-month-day-box-list {
        background-color: var(--viewWeekendBackground) !important;
}
.calendar-month-day-box-current-month[year="2023"][month="5"][day="29"][selected="true"] .calendar-month-day-box-list {
        background-color: #F20 !important;
}

Denn wenn ich nach all den Einträgen für die Feiertage einen "pauschalen" Eintrag für den ausgewählten Tag mache, etwa so

/* Pfingstmontag */
.calendar-month-day-box-current-month[year="2023"][month="5"][day="29"] .calendar-month-day-box-list {
        background-color: var(--viewWeekendBackground) !important;
}
/* jeder ausgewählte Tag */
.calendar-month-day-box-current-month[selected="true"] .calendar-month-day-box-list {
        background-color: #F20 !important;
}

hat das keine Wirkung auf die Feiertage - zumindest bei meinen Tests.

Und was leider auch nicht funktioniert, ist es, die neue Hintergrundfarbe auf nicht ausgewählte Feiertage zu beschränken. Durch einen Eintrag mit dem Zusatz [selected="false"] wie z.B.

.calendar-month-day-box-current-month[year="2023"][month="5"][day="29"][selected="false"] .calendar-month-day-box-list {
        background-color: var(--viewWeekendBackground) !important;
}

wird die Hintergrundfarbe des Feiertags überhaupt nicht verändert. Das wundert mich, weil [selected="true"] ja Wirkung zeigt.

Zusatzfrage: Wie kann ich zusätzlich zum "großen" Feld eines Feiertags auch den Balken oben, in dem Woche und Datum stehen, eine neue Hintergrundfarbe verpassen? Die Balken haben bislang noch die Farbe "normaler" Tage.

Zitat von dharkness21

Das habe ich so * gelöst.

CSS

.calendar-month-day-box-current-month[month="x"][day="x"] .calendar-month-day-box-dates .calendar-month-day-box-week-label,
.calendar-month-day-box-current-month[month="x"][day="x"] .calendar-month-day-box-dates .calendar-month-day-box-date-label {
    background-color: #8AD1A4 !important;
    color: #000 !important;
}

Ja, danke, das funktioniert so auch bei mir.

Zitat von dharkness21

In diesem Fall gibt es [selected="true"] nicht, es müsste wohl eher :not([selected="true"]) heißen.

Ich habe versucht, :not([selected="true"]) an verschiedenen Stellen einzusetzen, bislang ohne Erfolg. Wo in

/* Pfingstmontag */
.calendar-month-day-box-current-month[year="2023"][month="5"][day="29"] .calendar-month-day-box-list {
        background-color: var(--viewWeekendBackground) !important;
}

gehört müsste das denn hin?

Zitat von dharkness21

für nicht selektierte Felder muss das nicht verwendet werden

Ich dachte, ich könnte damit die Änderung der Hintergrundfarbe auf ausgewählte Felder beschränken und mir zusätzliche Einträge für ausgewählteFelder sparen, in denen dann nur wieder die reguläre Auswahlfarbe gesetzt werden. Im Moment habe ich vier Einträge für jeden Feiertag:

.calendar-month-day-box-current-month[year="2023"][month="5"][day="29"] .calendar-month-day-box-dates .calendar-month-day-box-date-label {
        background-color: var(--viewWeekendBackground) !important;
}

.calendar-month-day-box-current-month[year="2023"][month="5"][day="29"] .calendar-month-day-box-list {
        background-color: var(--viewWeekendBackground) !important;
}

.calendar-month-day-box-current-month[year="2023"][month="5"][day="29"][selected="true"] .calendar-month-day-box-dates .calendar-month-day-box-date-label {
        background-color: var(--viewSelectedBackground) !important;
}

.calendar-month-day-box-current-month[year="2023"][month="5"][day="29"][selected="true"] .calendar-month-day-box-list {
        background-color: var(--viewSelectedBackground) !important;
}

In Wirklichkeit stehen natürlich in den vier Gruppen auch die Einträge für dei anderen Feiertage drin. Aber wenn ich die beiden oberen Gruppen auf nicht ausgewählte Tage beschränken könnte, wären die beiden unteren Gruppen nicht mehr erforderlich.