102 lines
4.2 KiB
Typst
102 lines
4.2 KiB
Typst
#import "@preview/wrap-it:0.1.1": *
|
|
|
|
#pagebreak()
|
|
|
|
== Modelle
|
|
|
|
=== Global
|
|
Im @single-type *Global* können Werte hinterlegt werden, die im Kontext der gesamten Website zur Verfügung stehen sollen. Diese Einträge umfassen die Navigationsleiste, die Fußzeile und SEO, welche die Anzeige in einer Suchmaschine steuern. Diese Werte müssen definiert werden, damit die Webseite funktionsfähig angezeigt werden kann.
|
|
\
|
|
\
|
|
*Navigation*
|
|
#figure(
|
|
image("../../images/global-navbar.png", width: 100%),
|
|
)
|
|
Die Navigationsleiste kann mit einem Logo und eigenen Links definiert werden. Die Links können entweder eigenständig oder mit Sublinks erstellt werden. Außerdem kann ein Top-Level-Link direkt auf eine Seite oder auf einen Sub-Link verweisen. Die Links erhalten immer eine Bezeichnung und einen Text, wie der Link in der URL aussehen soll. Jedem Link, der etwas anzeigen soll, muss eine Seite zugeordnet werden. Das Anlegen von Seiten wird in @page erklärt.
|
|
|
|
#pagebreak()
|
|
|
|
#wrap-content(
|
|
figure(
|
|
image("../../images/navbar_single.png", width: 6.5cm),
|
|
),
|
|
align: right
|
|
)[
|
|
Links in der Navigation ohne untergeordneten Links:
|
|
#figure(
|
|
image("../../images/navbar_single_example.png", width: 100%),
|
|
)
|
|
Top-Level-Links ohne Unterlinks werden in der Hauptnavigationsleiste angezeigt. Diese Links verweisen auf eine zugeordnete Seite. Die angelegten Seiten können über das angezeigte Dropdown-Menü ausgewählt werden.
|
|
]
|
|
|
|
#wrap-content(
|
|
figure(
|
|
image("../../images/navbar_sublink.png", width: 6.5cm),
|
|
),
|
|
align: right
|
|
)[
|
|
Links in der Navigation mit untergeordneten Links:
|
|
#figure(
|
|
image("../../images/navbar_sublink_example.png", width: 100%),
|
|
)
|
|
Top-Level-Links mit Unterlinks werden in der Hauptnavigationsleiste angezeigt.
|
|
Wenn ein Link ausgewählt wird, werden die erzeugten Sublinks angezeigt. Je nach Konfiguration des Links wird dann entweder direkt eine Seite oder eine Seite des Sublinks aufgerufen. Beim Verweis auf Sublinks muss der Verweis `default_active_child` mit dem Wert der URL des Sublinks übereinstimmen.
|
|
]
|
|
\
|
|
*Fußleiste*
|
|
#figure(
|
|
image("../../images/global-footer.png", width: 100%),
|
|
)
|
|
Die Fußzeile kann mit Verweisen auf den Betreiber und eigenen Links definiert werden. Die Links können entweder auf eine in den Seiten definierte URL (@page) oder auf externe Webseiten verweisen. Um auf eine definierte Seite zu verweisen, muss nur der Pfad angegeben werden. Ein Pfad kann mit einem `/` beginnen oder ein ganzer Pfad sein (`aktuelles/einsaetze`). Soll ein Link auf eine externe Seite verweisen, muss dem Link `https://` oder `http://` vorangestellt werden.
|
|
\
|
|
\
|
|
*SEO (Search Engine Optimization)*
|
|
#figure(
|
|
image("../../images/global-seo.png", width: 100%),
|
|
)
|
|
Der Abschnitt SEO ist optional und kann verwendet werden, um den Titel der Registerkarte und die Beschreibung der Seite festzulegen. Dies optimiert die Ergebnisse in Suchmaschinen, da u.a. die Beschreibung direkt angezeigt wird.
|
|
|
|
=== Startseite
|
|
@single-type *Startseite*
|
|
|
|
Hier können die Inhalte der Startseite angepasst werden.
|
|
- BackdropBildschirmfüllendes Bild, das im Hintergrund angezeigt wird.
|
|
- Das in Global angegebene Logo wird unten im Eck über den Backdrop gelegt.
|
|
|
|
=== Sammlungs Referenz
|
|
@collection-type *Sammlungs Referenz*
|
|
|
|
Verwaltung und Erstellung von Referenzen auf Artikel, Einsätze, Termine und Fahrzeuge.
|
|
- Image ItemSoll das Element in der Liste ein Bild anzeigen.
|
|
- Date ListSollen die Listenelemente gruppiert nach Jahren angezeigt und navigiert werden.
|
|
- Numbered ItemSoll bei den ListenElementen ohne Bild statt dem Tag als große Zahl eine Nummerierung erfolgen.
|
|
- Inverse CountSoll die Zählweise umgekehrt sein. (Sinnvoll bei Einsätzen)
|
|
|
|
=== Seiten <page>
|
|
@collection-type *Seiten*
|
|
|
|
Verwaltung und Erstellung von Seiten mit Dynamischen Inhalten.
|
|
- HeroBild mit Text als Einleitung.
|
|
|
|
=== Artikel
|
|
@collection-type *Artikel*
|
|
|
|
Verwaltung und Erstellung von Artikeln.
|
|
|
|
=== Einsätze
|
|
@collection-type *Einsätze*
|
|
|
|
Verwaltung und Erstellung von Einsätzen.
|
|
|
|
=== Fahrzeuge
|
|
@collection-type *Fahrzeuge*
|
|
|
|
Verwaltung und Erstellung von Fahrzeugen.
|
|
|
|
=== Termine:
|
|
@collection-type *Termine*
|
|
|
|
Verwaltung und Erstellung von Terminen.
|
|
|
|
=== User
|
|
Die Verwendung des @collection-type *User* ist nicht erforderlich, da diese nur benötigt wird, wenn sich Besucher der Website auf der Website anmelden können.
|