====== Zeitleiste – Vorlage ======
 
Diese Seite zeigt die drei Bauformen der Zeitleiste. Unter jedem Beispiel steht der
Quelltext zum Kopieren. Zum Anlegen einer eigenen Chronik: Quelltext dieser Seite
öffnen, den passenden Block kopieren, Daten austauschen.
 
 
===== 1. Chronik – vertikal, abwechselnd =====
 
Die Grundform für Geschichte und Werdegang. Auf schmalen Bildschirmen klappt sie von
selbst auf eine Spalte um.
 
<timeline vertical align="alternate">
  <event date="Jahr 812" title="Der Bund am Fluss" badge="Gründung" icon="I">
    Zwölf Häuser besiegeln am Ostufer den Bund. Die Urkunde liegt bis heute im
    [[spielwelt:organisationen:start|Ordensarchiv]].
  </event>
  <event date="Jahr 847" title="Das lange Hochwasser">
    Drei Ernten fallen aus. Der Rat beschließt die Öffnung der Kornkammern – eine
    Entscheidung, die bis heute nachwirkt.
 
    * Die Zunft der Müller verliert ihr Vorrecht
    * Der Handelsweg nach Norden wird befestigt
  </event>
  <event date="Jahr 903" title="Der Bruch">
    Zwei Häuser verlassen den Bund. Die Gründe sind umstritten; die
    [[spielwelt:bibliothek:start|Bibliothek]] verwahrt beide Fassungen.
  </event>
  <event date="Gegenwart" title="Der Rat tagt wieder" icon="★" active>
    Seit dem Frühjahr trifft sich der Rat erstmals wieder vollzählig.
  </event>
</timeline>
 
<code>
<timeline vertical align="alternate">
  <event date="Jahr 812" title="Der Bund am Fluss" badge="Gründung" icon="I">
    Zwölf Häuser besiegeln am Ostufer den Bund.
  </event>
  <event date="Jahr 847" title="Das lange Hochwasser">
    Drei Ernten fallen aus.
 
    * Die Zunft der Müller verliert ihr Vorrecht
    * Der Handelsweg nach Norden wird befestigt
  </event>
  <event date="Gegenwart" title="Der Rat tagt wieder" icon="★" active>
    Seit dem Frühjahr trifft sich der Rat erstmals wieder vollzählig.
  </event>
</timeline>
</code>
 
 
===== 2. Ablauf – horizontal =====
 
Für Abläufe mit klarer Reihenfolge: Kampagnenbögen, Reisewege, Spielabende. Zum Blättern
dienen die Pfeile, die Pfeiltasten oder das Ziehen mit der Maus.
 
<timeline horizontal align="alternate" width="19em" title="Der Zug flussaufwärts">
  <event date="Tag 1" title="Aufbruch" icon="1">
    Abfahrt am Zollhaus, Proviant für zehn Tage.
  </event>
  <event date="Tag 3" title="Die Untiefe" icon="2" badge="Probe">
    Seefahrt gegen 14. Misslingt sie, geht Ladung über Bord.
  </event>
  <event date="Tag 6" title="Das stille Dorf" icon="3">
    Niemand am Steg. Rauch, aber kein Feuer.
  </event>
  <event date="Tag 9" title="Die Quelle" icon="4" active>
    Ziel der Reise – und Beginn des zweiten Bogens.
  </event>
</timeline>
 
<code>
<timeline horizontal align="alternate" width="19em" title="Der Zug flussaufwärts">
  <event date="Tag 1" title="Aufbruch" icon="1">
    Abfahrt am Zollhaus, Proviant für zehn Tage.
  </event>
  <event date="Tag 3" title="Die Untiefe" icon="2" badge="Probe">
    Seefahrt gegen 14. Misslingt sie, geht Ladung über Bord.
  </event>
  <event date="Tag 9" title="Die Quelle" icon="4" active>
    Ziel der Reise – und Beginn des zweiten Bogens.
  </event>
</timeline>
</code>
 
 
===== 3. Kurzfassung – vertikal, Achse links, kompakt =====
 
Schmal genug für die Seitenleiste, eine Kachel oder einen Personenartikel.
 
<timeline vertical align="left" compact accent="#7c9a6d">
  <event date="812" title="Geboren in Weidenfurt"></event>
  <event date="834" title="Eintritt in die Gilde"></event>
  <event date="851" title="Meisterbrief" badge="belegt"></event>
  <event date="869" title="Verschollen" active></event>
</timeline>
 
<code>
<timeline vertical align="left" compact accent="#7c9a6d">
  <event date="812" title="Geboren in Weidenfurt"></event>
  <event date="834" title="Eintritt in die Gilde"></event>
  <event date="851" title="Meisterbrief" badge="belegt"></event>
  <event date="869" title="Verschollen" active></event>
</timeline>
</code>
 
 
===== Grundgerüst =====
 
Das Minimum – alles Weitere ist freiwillig:
 
<code>
<timeline>
  <event date="" title="">
  </event>
  <event date="" title="">
  </event>
</timeline>
</code>
 
 
===== Spickzettel =====
 
^ am ''<timeline>'' ^ Werte ^ Wirkung ^
| ''vertical'' / ''horizontal'' | – | Richtung der Achse |
| ''align'' | vertikal: ''alternate'', ''left'', ''right''\\ horizontal: ''alternate'', ''above'', ''below'' | Lage der Karten |
| ''width'' | z. B. ''19em'' | Kartenbreite, nur horizontal |
| ''accent'' | z. B. ''#7c9a6d'' | Akzentfarbe statt Gold |
| ''title'' | Text | Überschrift über der Leiste |
| ''compact'' | – | engere Abstände |
| ''animate'' / ''noanimate'' | – | Einblenden beim Scrollen |
 
^ am ''<event>'' ^ Werte ^ Wirkung ^
| ''date'' | frei | Datum, Jahr, Tag, Zeitraum |
| ''title'' | frei | Überschrift der Karte |
| ''badge'' | kurz | Etikett neben dem Datum |
| ''icon'' | ein Zeichen | Zeichen im Punkt, z. B. ''★'' oder ''1'' |
| ''accent'' | Farbe | Akzent nur für diesen Eintrag |
| ''side'' | ''left'', ''right'', ''above'', ''below'' | erzwingt die Seite bei ''alternate'' |
| ''active'' | – | Punkt ausgefüllt |
 
Hinweise:
 
  * Zwischen ''</event>'' und ''<event>'' gehört kein Text – alles, was dorthin gerät, wird verworfen. Inhalte immer in ein Event.
  * In den Karten funktioniert das gewohnte Markup: Fettung, Links, Listen, Bilder, Tabellen.
  * Ohne ''date'' oder ''title'' entfällt die jeweilige Zeile einfach.
  * Farben, Schrift und Rahmen kommen vom Wiki: Beim Umschalten zwischen hell und dunkel zieht die Zeitleiste mit.