Skip to content

Farbschema

Beschreibung

Das Farbschema der Anwendung ist im Verzeichnis [Settings.ApplicationTemp]/theme/ in der Datei theme.css gespeichert. Die Datei wird, sofern nicht vorhanden, beim Start der Anwendung aus den in Sektion ThemeColors definierten Angaben erstellt.

Sektion ThemeColors unterstützt folgende Settings:

Setting Beschreibung
BaseColor RGB-Code der Grundfarbe des Headers (z.B: #00796B)
HeaderBorderDefault RGB-Code für die Markierung der nicht selektierten Räume (z.B. "#00796B")
HeaderBorderSelected RGB-Code für die Markierung des aktiven Raums (z.B. #e70c02)
BackgroundTooltipLight RGB-Code für die Hintergrundfarbe eines Tooltipps (z.B. #00796bE6)
FormFilterPanelBackground RGB-Code für den Hintergrund des Filter-Panesl (z.B. #F9F9F9)
MainToolbarItemColor RGB-Code für die Farbe der Toolbar-Items (z.B. #dddddd)

Farbwerte

Alle Farbwerte werden im Hex-Format angegeben. Auf diversen Webseiten kann man Hex zu Farbe und Farbe zu Hex konvertieren lassen, z. B. www.pinetools.com

Beispiel

# Beispiel Sektion ThemeColors in appsettings.json

"ThemeColors": {
  "BaseColor": "#00796B",
  "HeaderBorderDefault": "#00796B",
  "HeaderBorderSelected": "#e70c02",
  "BackgroundTooltipLight": "#00796bE6",
  "FormFilterPanelBackground": "#F9F9F9",
  "MainToolbarItemColor": "#dddddd"
},

Parametrierung aus Anwendung

Das Farbschema kann unter Systemverwaltung -> Modul Farbschema auch direkt aus der Frontend-Anwendung bearbeitet werden. Modul

  • "Farbschema setzen" ermöglicht, das aktuelle Farbschema zu ändern. Die Farbwerte werden direkt in die oben beschriebene Datei theme.css geschrieben. Wird theme.css gelöscht, wird es wieder aus den in ThemeColors definierten Angaben erstellt.

  • "Farbschema zurücksetzen": Setzt das aktuelle Farbschema zurück, indem es die oben beschriebene Datei theme.css löscht. Sie wird aus den in ThemeColors definierten Angaben neu generiert.

Reload

Damit die Änderungen wirksam werden, muss der Browser-Cache geleert werden und die Anwendung mit einem Hard-Reload neu geladen werden. Im Chrome-Brwoser kann das mit Tastenkombination [STRG] + [F5] gemacht werden.