Style-Übersicht
Überschriften
Überschrift H1
Überschrift H2
Überschrift H3
Überschrift H4
Überschrift H5
Überschrift H6
Normaler Absatz: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
Wichtig: Bitte immer richtige Absätze machen. Und wenn es einen ganzen Text gibt hier auch komplett den Text in ein Textfenster setzen, damit immer die Abstände der Paragraphen gleich sind. Außer es gibt einen lead-Text.
lead-Text–> bekommt die Klasse bn_lead: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
Listen
Normale Listen ohne Klasse
- eins
- zwei
- drei
Normale Listen mit Klasse bn_list-dashed
- eins
- zwei
- drei
Normale Listen mit Klasse bn_list-dashed und bn_lead (wie auf Startseite neben KLIO)
- eins
- zwei
- drei
Verhalten des Headers
Erste Sektion auf bestimmten Seiten wie auf Referenzen
1) Der umgebende Container bekommt die extra Klasse bn_header. Damit wird die Höhe automatisch festgelegt und die Überschriften anders behandelt.
2) Die H2 bekommt die Klasse bn_highlight, damit wird sie orangefarben hinterlegt und auf color: #ffffff; gesetzt.
Info: die Hinterlegung der H2 sollte nur auf den Hauptseiten des Menüs sein!
3) Der Paragraph bekommt die Klasse bn_lead, damit die Schrift hier etwas größer wird.
4) Padding nach oben und unten ist 50px manuell eingestellt. U.a. damit wie bei Referenzen das padding nach unten weggenommen werden kann, um schneller den Content zu sehen, also um variabler zu sein und auf die Art der Inhalte reagieren zu können
Special Startseite:
Normalerweise ist anstatt des classix Logos hier zuerst einfach eine H1! Auf der Startseite ist aber ein Bild (Logo) und darunter ein p-Tag mit der Klasse bn_highlight. Die H1 kann dadurch sinnvoll belegt werden kann, in dem Fall durch den nachfolgenden lead-Text, der die H1 ist. Das ist NUR für die Startseite so im Stylesheet festgelegt.
die Software Factory
Wo andere noch manuell programmieren, nutzen wir ein systematisiertes Produktionsverfahren
H1 Überschrift,
die in die nächste Zeile weitergeht mit Hinterlegung durch umgebende span-Klasse bn_highlight
H1 Überschrift
Das ist ein p Tag der sich als eine H2 verkleidet hat, indem er die Klasse bn_highlight bekommt
Sektion Orange
Die Sektion Orange erscheint u.a. auf der Startseite
1) Der umgebende Container bekommt die extra Klasse bn_cta-container bg-orange. Damit wird der Hintergrund als orange definiert und das padding festlegt
2) Der Paragraph bekommt die Klasse bn_lead, damit die Schrift etwas größer wird.
3) Die Liste bekommt durch die Klasse bn_product-list besondere Styles hinzugefügt
4) Ist als Template unter Sektion Orange gespeichert
Die industrielle Zukunft der Software!
classix ist mehr als ein Produkt – es ist ein System, ein breit aufgestelltes Software-Ökosystem, das von ERP über Lagerlogistik bis zu branchenspezifischen Anwendungen reicht.
Lernen Sie unsere Prio-Produkte kennen
Sektion Rosa
Die Sektion Rosa erscheint u.a. auf der Startseite
1) Der umgebende Container bekommt die extra Klasse bn_cta-container bg_rosa. Damit wird der Hintergrund als rosa definiert und das padding festlegt
2) Die Liste bekommt durch die Klasse bn_product-list big_lh besondere Styles hinzugefügt.
3) Ist als Template unter Sektion Rosa gespeichert