Kategorie: Mozilla

Für: Sunbird 0.8, Lightning 0.8

Wenn ein Termin nur 5 oder 10 Minuten dauert, kann man ihn in Tages- und Wochenansicht nur schwer auswählen, weil man nicht mehr als einen Streifen von ihm sieht:

Nicht perfekt, aber pragmatisch lässt sich das beheben, indem man in einer userChrome.css eine Mindesthöhe für die Termindarstellung in diesen Ansichten vorgibt, z.B.:

/* Mindesthöhe Terminbox */
#day-view .calendar-item,
#week-view .calendar-item {
min-height: 16px !important;
}

So lässt sich der Titel wenigstens lesen:

Wer die Ansichten gerne in die Horizontale rotieren lässt, müsste wohl auf dieser Basis nach der richtigen Größe suchen:

/* Mindestbreite Terminbox */
#day-view .calendar-item[orient=“horizontal“],
#week-view .calendar-item[orient=“horizontal“] {
min-width: 30px !important;
}

Für Version 0.9 von Sunbird und Lightning ist dieser Fehler übrigens schon behoben, dann wird hierfür kein Eintrag in der userChrome.css mehr nötig sein.

Für: Sunbird 0.8, Lightning 0.8

Beim Anpassen der Darstellung von Terminen auf Kategoriebasis hat sich seit Sunbird 0.3 einiges getan – vor allem insofern, als diese Spielereien in Sunbird 0.8 vorerst nur noch für mehrwöchige und Monatsansicht funktionieren.
Mit den Änderungen in Bug 202360 werden Sunbird/Lightning 0.9 zwar wieder wahre CSS-Spielwiesen, aber bis dahin hier mal zwei abgespeckte Beispiele für die kategorieabhängige Gestaltung der Termindarstellung über eine userChrome.css in 0.8-Zeiten:

/* Kategorie: Wichtig */
[item-category=“wichtig“] .calendar-item {
border: solid red 2px !important;
background: #FDD !important;
}

[item-category=“wichtig“] .calendar-item .calendar-event-selection {
border: none !important;
}

[item-category=wichtig] .calendar-month-day-box-item-label {
padding-left:15px !important;
background-image:url(„pics/sign07.png“) !important;
background-position:top left !important;
background-repeat:no-repeat !important;
}

/* Kategorie: Geburtstag */
[item-category=geburtstag] .calendar-month-day-box-item-label {
padding-left:20px !important;
background-image:url(„pics/luftballons.jpg“) !important;
background-position:top left !important;
background-repeat:no-repeat !important;
}

Und so könnte das dann aussehen:

Voraussetzung ist natürlich wie ‚damals‘, dass es (in diesem Beispiel) den Ordner „chrome/pics“ im Profilverzeichnis gibt, in dem die entsprechenden Bilder liegen.

Für: Sunbird 0.8, Lightning 0.8

Um die Hintergrundfarbe des ausgewählten Tages in Wochenansicht, mehrwöchiger Ansicht und Monatsansicht anzupassen, braucht es folgende Einträge in einer userChrome.css:

/* Wochenansicht: Ausgewählten Tag anpassen */
calendar-header-container[selected=“true“],
.calendar-event-column-linebox[selected=“true“] {
background: #ff6633 !important;
}

/* Mehrwöchige Ansicht, Monatsansicht: Ausgewählten Tag anpassen */
.calendar-month-day-box-current-month[selected=“true“],
.calendar-month-day-box-day-off[selected=“true“],
.calendar-month-day-box-other-month[selected=“true“] {
background: #ff6633 !important;
}

Über das Ändern von #ff6633 (z.B. mit Hilfe der Farbpaletten bei SelfHTML) lässt sich die Hintergrundfarbe dann nach Belieben anpassen.

Für: Sunbird 0.8, Lightning 0.8

Um die Hintergrundfarbe des aktuellen Tages in Wochenansicht, mehrwöchiger Ansicht und Monatsansicht anzupassen, braucht es folgende Einträge in einer userChrome.css:

/* Wochenansicht: Heute anpassen */
calendar-header-container[relation=“today“],
.calendar-event-column-linebox[relation=“today“] {
background: #ff6633 !important;
}

/* Wochenansicht: Selected-Standard wiederherstellen */
calendar-header-container[selected=“true“],
.calendar-event-column-linebox[selected=“true“] {
background: #ffe79c !important;
}

/* Mehrwöchige Ansicht, Monatsansicht: Heute anpassen */
.calendar-month-day-box-current-month[today=“true“],
.calendar-month-day-box-day-off[today=“true“],
.calendar-month-day-box-other-month[today=“true“] {
background: #ff6633 !important;
}

/* Mehrwöchige Ansicht, Monatsansicht: Selected-Standard wiederherstellen */
.calendar-month-day-box-current-month[selected=“true“],
.calendar-month-day-box-day-off[selected=“true“],
.calendar-month-day-box-other-month[selected=“true“] {
background: #ffe79c !important;
}

Über das Ändern von #ff6633 (z.B. mit Hilfe der Farbpaletten bei SelfHTML) lässt sich die Hintergrundfarbe dann nach Belieben anpassen.