Theme-Anpassung

Zuletzt geändert am:

Eigene Themes können Sie mit dem Formcentric Theme-Customisation-Workspace gestalten. Dieser wurde speziell für die Anpassung von Formcentric-Themes entwickelt. Hier können Sie bestehende Formcentric-Themes modifizieren oder ein eigenes Theme erstellen. Mit Funktionen wie der Anpassung von Theme-Variablen, SCSS-Partials und JavaScript-Templates können Sie das Design, das Markup und das Styling der Formulare nach Ihren Vorstellungen gestalten. Zudem haben Sie die Möglichkeit, eigene Custom-Themes zu erstellen, Fonts und Bilder hinzuzufügen und Ihre Anpassungen für verschiedene Zielumgebungen zu exportieren.

Einrichten des Workspaces

Um mit der Entwicklung eines eigenen Themes zu beginnen, klonen Sie den Formcentric Theme-Customisation-Workspace mit folgendem Befehl:


Damit Sie bei der Entwicklung auf alle Vorteile von Git zurückgreifen und Deployments Ihrer Themes mit Github Actions einrichten können, empfiehlt es sich den Workspace zu forken. Folgen Sie hierfür der entsprechenden GitHub-Dokumentation .

Dokumentation

Wichtige allgemeine Bestandteile eines Themes sind:

  1. definition.json für Cloud- und Design-Definitionen
  2. styles.scss als zentraler Style-Entry
  3. templateEntry.js als Entry für das Template-Bundling
  4. _variables.json für Laufzeit-Variablen in nicht-SCSS-Integrationen
  5. variables/_variables.scss für SCSS-basierte Theme-Integrationen


Zweite-Generation-Themes arbeiten zusätzlich mit einem tokenbasierten Designsystem. Das erleichtert:

  1. konsistente Farb- und Spacing-Systeme
  2. zentrale Pflege von Tokens
  3. Variantenbildung
  4. langfristige Wartbarkeit

Feedback