Breadcrumbs

CSS-Konfigurationen

Layout-Design mittels CSS-Element

Im CSS können Angaben zu Layout, Farben und Typografie definiert werden. So können Sie unter anderem Schriftarten, -größen und -farben für Ihre Formulare festlegen. Auch feldgenaue Designs sind über das CSS möglich: Einzelne Formularfelder können verändert werden oder alle Formularfelder eines Typs.

Über CSS-Anweisungen kann zum Beispiel die Hintergrundfarbe aller Auswahllisten eines App Projektes verändert werden - oder nur die einer konkreten Auswahlliste in einem bestimmten Formular. Auch das Einbinden von Firmenlogos oder Hintergrundbildern ist über das CSS möglich - und vieles Weitere mehr.

Die entsprechenden Festlegungen werden im Projekt-Element CSS gespeichert:

css (1).png

Das CSS-Element findet sich im Projekt-Editor und kann auf Projekt-Ebene abgelegt werden. Ein CSS-Modell ist referenzierbar für jedes EPK-Modell oder Formular, das sich innerhalb desselben Profils befindet.

Hinweis zur Arbeit mit BPaaS bis Version 17.2

Bis Scheer BPaaS Version 17.2 war das CSS-Element auch im Prozess-Editor verfügbar und konnte auf der Arbeitsfläche einer EPK abgelegt werden.

Beispiel: CSS-Modell Layout Katalog im Prozess-Editor

Das CSS-Modell Layout Katalog enthält Design-Anweisungen für die Formulare Artikel Übersicht und Bestellübersicht . Das Modell wurde in der EPK angelegt, in der sich die zugehörigen Formulare befinden. Da das CSS-Modell ein Projekt-Element ist, kann es nicht mit den EPK-Elementen verbunden werden:

css_prozesseditor.png

Beispiel: CSS-Modell Layout Beschaffung im Projekt-Editor

Das CSS-Modell Layout Beschaffung enthält Design-Anweisungen für das App Projekt Beschaffung. Es wurde deshalb im Projekt-Editor auf der Ebene des App Projektes abgelegt:

css_projekteditor.png

Die CSS-Vorlagen

Sie können für Ihre App Projekte komplett eigene CSS-Modelle erstellen. Es gibt aber auch die Möglichkeit, vorhandene Vorlagen zu nutzen, denn jedes neu angelegte App Projekt enthält drei vorkonfigurierte CSS-Modelle:

css_rot.png
css_blau.png
css_grau.png

Diese drei Vorlagen enthalten bereits eine Reihe von CSS-Anweisungen. Sie können die Vorlagen Ihren EPK-Modellen direkt zuordnen oder die darin gespeicherten CSS-Anweisungen nach Ihren Wünschen verändern. Standardmäßig ist dem Referenzmodell und dem Übersichtsmodell eines neu angelegten App Projekts die CSS-Vorlage CSS Blau zugewiesen.

Die Standard-Vorlagen sind übersichtlich strukturiert, sodass individuelle Anpassungen einfach möglich sind:

css_blau_editor.png

Beispiel: Ausführung des Standardformulars mit CSS Blau, CSS Rot und CSS Grau

Related Pages: