Styleguide
Colors
Fonts
Text: Roboto variable font
Text bold
h1 - Seitenüberschrift
h2 - Themenüberschrift
h3 - Themenüberschrift
h4 - Themenüberschrift
h5 - Themenüberschrift
Dies ist die Hauptüberschrift der Überschriftengruppe
Dies ist die Unterüberschrift der Überschriftengruppe
Der Einleitungstext (großer Absatz) kann eine Einleitung in den Textabschnitt sein, oder er dient nur zur visuellen Unterscheidung zwischen dem Rest des Textabschnitts.
Ein Absatz (aus dem Griechischen paragraphos, "daneben schreiben" oder "daneben geschrieben") ist eine in sich geschlossene Einheit eines schriftlichen Diskurses über einen bestimmten Punkt oder Gedanken. Ein Absatz besteht aus einem oder mehreren Sätzen. Obwohl die Syntax einer Sprache keine Absätze vorschreibt, sind sie in der Regel ein erwarteter Teil des formalen Schreibens und dienen der Gliederung längerer Prosa.
Tabelle im Textfeld
Jahr | Gebiet A | Gebiet B | Gebiet C |
---|---|---|---|
2013 | 25.000 | 100.000 | 55.000 |
2014 | 50.000000000000000000000000 | 10.000000000000000000000000 | 50.000000000000000000000000 |
2015 | 150.000 | 550.000 | 40.000 |
Rahmen
Pellentesque auctor neque nec urna. Curabitur ligula sapien, tincidunt non, euismod vitae, posuere imperdiet, leo. Fusce fermentum odio nec arcu. Etiam ut purus mattis mauris sodales aliquam. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi.
Donec posuere vulputate arcu. Integer ante arcu, accumsan a, consectetuer eget, posuere ut, mauris. Nulla facilisi. Maecenas egestas arcu quis ligula mattis placerat. Curabitur vestibulum aliquam leo.
Text einrücken 66/33%
Unter dem Reiter Erscheinungsbild → Rahmen → Einrücken 66/33%
kann die Inhaltsbreite verkleinert durch eine Einrückung rechts werden.
Text eingerückt, mittig
Unter dem Reiter Erscheinungsbild → Rahmen → Einrücken
kann die Inhaltsbreite verkleinert werden. Dies ist manchmal notwendig, damit der Text nicht zu breit läuft und somit schlecht lesbar ist.
Text einrücken 33/66%
Unter dem Reiter Erscheinungsbild → Rahmen → Einrücken 33/66%
kann die Inhaltsbreite verkleinert durch eine Einrückung links werden.
Linie davor
Unter dem Reiter Erscheinungsbild → Rahmen → Linie davor
kann eine Linie vor dem Inhaltselement ausgegeben werden.
Linie danach
Unter dem Reiter Erscheinungsbild → Rahmen → Linie danach
kann eine Linie vor dem Inhaltselement ausgegeben werden.
Vivamus aliquet elit ac nisl. Aenean tellus metus, bibendum sed, posuere ac, mattis non, nunc. Fusce pharetra convallis urna. Nunc egestas, augue at pellentesque laoreet, felis eros vehicula leo, at malesuada velit leo quis pede. Praesent egestas tristique nibh.
Maecenas ullamcorper, dui et placerat feugiat, eros pede varius nisi, condimentum viverra felis nunc et lorem. Vestibulum fringilla pede sit amet augue. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; In ac dui quis mi consectetuer lacinia. Aliquam lobortis.
Vivamus aliquet elit ac nisl. Aenean tellus metus, bibendum sed, posuere ac, mattis non, nunc. Fusce pharetra convallis urna. Nunc egestas, augue at pellentesque laoreet, felis eros vehicula leo, at malesuada velit leo quis pede. Praesent egestas tristique nibh.
Maecenas ullamcorper, dui et placerat feugiat, eros pede varius nisi, condimentum viverra felis nunc et lorem. Vestibulum fringilla pede sit amet augue. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; In ac dui quis mi consectetuer lacinia. Aliquam lobortis.
Icons, Examples
Paginator
Lists
Unordered
- This is a list item in an unordered list
- An unordered list is a list in which the sequence of items is not important. Sometimes, an unordered list is a bulleted list. And this is a long list item in an unordered list that can wrap onto a new line.
-
Lists can be nested inside of each other
- This is a nested list item
- This is another nested list item in an unordered list
- This is the last list item
Ordered
- This is a list item in an ordered list
- An ordered list is a list in which the sequence of items is important. An ordered list does not necessarily contain sequence characters.
-
Lists can be nested inside of each other
- This is a nested list item
- This is another nested list item in an ordered list
- This is the last list item
No Bullets
- This is a list item in an unordered list
- An unordered list is a list in which the sequence of items is not important. Sometimes, an unordered list is a bulleted list. And this is a long list item in an unordered list that can wrap onto a new line.
-
Lists can be nested inside of each other
- This is a nested list item
- This is another nested list item in an unordered list
- This is the last list item
Definition List
- Title
- Content
Definition List inline class="dl-horizontal"
- Title
- Content
Alerts
Alert Neutral
Alert Error
Alert Valid
Alert Warning
Alert Information
Modal
Tooltip
HTML element: figure
Class: wrapper-tooltip