Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Eigenes Theme erstellen

Kopiere das Default Theme jedhoc im Ordner /usr/share/jedhoc/webapp/VAADIN/themes/jedhoc in einen neuen Ordner im gleichen Verzeichnis, z.B. /usr/share/jedhoc/webapp/VAADIN/themes/meinTheme (Name frei wählbar).

Code Block
cp -a /usr/share/jedhoc/webapp/VAADIN/themes/jedhoc /usr/share/jedhoc/webapp/VAADIN/themes/meinTheme

 Unter Docker muss der Ordner /app/webapp zusätzlich als volume auf das Host System gemountet werden. Von dem Speicherort müssen die Änderungen dann weiterhin so vorgenommen werden.


Lösche nun folgende Dateien im neu erstellten Ordner:

Code Block
styles.scss.cache
styles.css

...


In der Datei /etc/jedhoc/jedhoc.xml das Theme auswählen.

Code Block
title/etc/jedhoc/jedhoc.xml
<theme>meinTheme</theme>

 


jEDHOC Dienst neustarten

Code Block
service jedhoc restart

...


Anpassung des Theme

Um das Theme jetzt nach eigenen Wünschen anzupassen, bearbeite die wird primär die Datei styles.scss verwendet. Diese importiert widerum CSS Klassen aus der Datei jedhoc.scss.  Änderungen Hier sind alle Styles des Standard Themes definiert.

Änderungen am Theme können während der Laufzeit erfolgen.
Nachdem die Datei Dateien styles.scss oder jedhoc.scss verändert wurde, wird beim nächsten Aufruf der Webseite wurden, muss in jEDHOC der Button SCSS kompilierenImage Added im Menü Administration → Theme geklickt werden. Dadurchwird das Cache File styles.scss.cache neu generiert.
Kommt es zu Darstellungsproblemen, kann ein Löschen der Datei styles.scss.cache Abhilfe schaffen.

Bei Versionsupdates von jEDHOC können aufgrund neuer Funktionen Darstellungsprobleme auftreten!
Somit muss das Theme überarbeitet werden.