xarPress5 - wie funktioniert das Framework für Formulare?

In xarPress5 haben wir Formulare in allen Modulen nach einem einheitlichen Schema (so genannten Modellen) mit HTML 5 ausgezeichnet. Natürlich sind damit bereits minimale Vorgaben für die Gestaltung gemacht, aber das lässt sich nicht vermeiden.

Alle Templates können außerdem im Theme überrschrieben werden, für die individuelle Gestaltung von Formularen sollte das aber gar nicht notwendig sein.

Generell gehört Layout zu den Aufgaben des Themes. Deswegen werden im Core nur wirklich basale gestalterische Vorgaben gemacht.

Das Stylesheet xarcore-html5.css im Modul base dient vor allem dazu

1. unvermeidliche Probleme zu lösen, um sie nicht in jedem Theme von Neuem angehen zu müssen
2. einige UI-Elemente zu gestalten
3. eine Reihe generischer Standardklassen zu definieren, um sie kontrolliert wiederverwenden zu können

Wir haben das Stylesheet in verschiedene Bereiche unterteilt:

• /* COMMON SYSTEM UI - VENDOR RELATED VALUES */
• /* COMMON SYSTEM UI - NON BEHAVIOUR */
• /* COMMON SYSTEM UI - MESSAGES */
• /* COMMON SYSTEM UI - ELEMENTS */
• /* COMMON SYSTEM UI - GENERIC CLASSES */
• /* COMMON SYSTEM UI - ADDITIONAL CLASSES */
• /* COMMON SYSTEM UI - BEHAVIOUR - JQUERY RELATED CLASSES */
• /* COMMON SYSTEM UI - FORMS */
• /* COMMON SYSTEM UI - IE HACKS */

Die UI-Elemente werden im Core gestaltet, so dass nicht jedes Theme das Rad wieder neu erfinden muss. Auch diese Vorgaben können aber natürlich im Theme überschrieben werden.

Anmerkung: Es kann sein, dass xarcore-html5.css künftig weiter aufgeteilt wird. Theoretisch könnten auch alle gestalterischen Vorgaben an die Themes delegiert werden, so dass in xarcore-html5.css tatsächlich nur die Probleme gelöst werden, die durch die verwendeten HTML5-Modelle entstehen.

Für Gestaltung der Forumlarelemente kann zwischen 4 Stylesheets gewählt werden, mit denen sich jeweils unterschiedliche Positionierungen realisieren lassen:

1. xarcore-html5_forms_center.css
2. xarcore-html5_forms_left_float.css
3. xarcore-html5_forms_left_inline.css
4. xarcore-html5_forms_top.css

Das jeweilige Stylesheet muss im Theme verlinkt werden. Abweichungen vom gewählten Positionierungsmodell können im Stylesheet des Themes vorgenommen werden.

Für das Layout werden vom Core also nur wirklich minimale Voraussetzungen gemacht. Für die weitere Gestaltung sind die Stylesheets des Themes zuständig. Und auch xarcore-html5.css kann im Theme überschieben werden (allerdings müssen dann die Pfade zu Icons angepasst werden).

Standardmäßig sollte die Gestaltung von Formularen (wie auch von Tabellen) in elements.css vorgenommen werden.