Das Standard-Kalender-Widget des Xfce-Desktops ist funktional, aber optisch nicht jedermanns Geschmack. Mit wenigen Schritten lässt sich das Design deutlich aufwerten – alles, was dafür benötigt wird, ist eine kleine Anpassung per CSS.
Xfce-Desktop: Original Kalender-Widget
Schritt 1: Texteditor starten
Öffnen sie einen einfachen Texteditor (z.B. Mousepad, Gedit oder Nano). Es wird lediglich eine reine Textdatei ohne Formatierungen erstellt bzw. bearbeitet.
Schritt 2: CSS-Code einfügen
Kopieren Sie folgenden CSS-Code in den Editor:
/* =======================================
XFCE Kalender-Widget (optimierte Version)
======================================= */
/* Grundstruktur */
calendar,
GtkCalendar {
font-size: 18pt;
background-color: #3e7ea1; /* Haupt-Hintergrund */
color: #ffffff;
border-radius: 8px;
padding: 8px 10px;
transition: background-color 0.3s ease;
}
/* Auswahlzustand */
calendar:selected,
GtkCalendar:selected {
background-color: #66b4d8; /* heller Blauton für Auswahl */
color: #ffffff;
font-weight: bold;
border-radius: 4px;
}
/* Wochentage (Kopfzeile) */
calendar.highlight,
GtkCalendar.highlight {
background-color: rgba(21, 83, 111, 0.5); /* kräftiger Balken */
color: #ffffff;
font-weight: normal;
border-radius: 4px;
padding: 4px 0;
}
/* Kalenderwochen-Spalte */
calendar.week-number,
GtkCalendar.week-number {
background-color: rgba(21, 83, 111, 0.5);
color: #ffffff;
font-weight: bold;
padding: 2px 8px;
border-radius: 4px;
}
/* Aktuelles Datum */
calendar.today,
GtkCalendar.today {
background-color: #0e3b4f; /* dunkler Akzent */
color: #ffffff;
border-radius: 4px;
font-weight: bold;
box-shadow: 0 0 14px rgba(255, 255, 255, 0.7);
animation: pulse-today 4s ease-in-out infinite;
transition: background-color 0.4s ease, box-shadow 0.4s ease;
}
/* Sanftes Pulsieren des heutigen Datums */
@keyframes pulse-today {
0%, 100% {
box-shadow: 0 0 0px rgba(255, 255, 255, 0.6);
background-color: #0e3b4f;
}
50% {
box-shadow: 0 0 20px rgba(255, 255, 255, 0.9);
background-color: #145674; /* sanft heller Übergang */
}
}
/* Dezenter Verlauf über Kalendergitter */
calendar,
GtkCalendar box,
GtkCalendar grid {
background-image: linear-gradient(
to bottom,
rgba(21, 83, 111, 0.45),
rgba(21, 83, 111, 0.45)
);
}
/* Header (Monat/Jahr) */
calendar.header,
GtkCalendar.header {
color: #ffffff;
font-weight: bold;
text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}
/* Tage-Buttons */
calendar button,
GtkCalendar button {
border-radius: 4px;
padding: 4px 6px;
color: #ffffff;
background: transparent;
transition: background-color 0.2s ease;
}
/* Hover-Effekt */
calendar button:hover,
GtkCalendar button:hover {
background-color: rgba(102, 180, 216, 0.8);
}
Schritt 3: CSS-Datei abspeichern
Speichern sie die Datei als gtk.css im versteckten Ordner .config/gtk-3.0/ unter Ihrem Home-Verzeichnis (/home/USERNAME/.config/gtk-3.0/gtk.css) ab. Falls der Ordner noch nicht existiert, erstellen sie ihn.
Schritt 4: Xfce-Panel neu starten
Damit die Änderungen sofort übernommen werden, starten Sie das Xfce-Panel neu. Am einfachsten geht das mit dem Befehl:
xfce4-panel -rAlternativ ab- und wieder anmelden.
Was bewirken diese Änderungen
– Ein farblich passender Hintergrund mit Abrundungen schafft ein weicheres und moderneres Erscheinungsbild.
– Das ausgewählte Datum hebt sich klar ab.
– Unterschiedliche Blautöne für Kalenderwochen und Wochentage schaffen visuelle Hierarchie.
– Leichte Hover-Effekte auf den Tagen erhöhen die Interaktivität.
– Genügend Innenabstand (Padding) sorgt für Luftigkeit und bessere Übersichtlichkeit.
Das Kalender-Widget zeigt nun größere Schrift, farbige Akzente und ist optisch klarer hervorgehoben. Sollte das neue Design nicht sofort aktiv sein, hilft eine Überprüfung der Pfade oder den Dateinamen.
Xfce-Desktop: Angepasstes Kalender-Widget
Anmerkung
Sollte die gtk.css-Datei im beschriebenen Ordner bereits bestehen, fügen Sie den o.g. CSS-Code am Ende der Textdatei ein, speichern es einfach und fahren laut Anleitung fort.
Fazit
Mit diesen wenigen Schritten lässt sich das Xfce Kalender-Widget individuell anpassen und deutlich übersichtlicher gestalten. Perfekt für alle, die auf dem Xfce-Desktop ein modernes und klares Erscheinungsbild bevorzugen.
16
Eine Reaktion
Danke für diese tolle Anleitung. Das war mir schon lange ein Dorn im Auge. Bei meiner bisherigen Suche bin ich auf das gestoßen: https://www.pling.com/s/XFCE/p/2303779
Das sieht zwar gut aus, funktioniert aber hinten und vorne nicht.
Besten Dank an @zebolon nochmal für diesen Tipp.