Für jeden Ordner und jeden Tag entsteht automatisch eine Seite mit einer Liste.
Von Haus aus
Eine Aufzählung mit Datum, Titel, Beschreibung und Tags, untereinander.
In dieser Vorlage
Ein dreispaltiges Raster: Datum in fester Breite links, Titel in der Mitte, Tags rechts. Die feste Datumsspalte sorgt dafür, dass die Titel eine Kante bilden — und die Ziffern stehen in Ziffernbreite untereinander.
Unter 720 px fällt das auf eine Spalte zusammen; das Datum ist der Teil, der wandert.
Am Desktop behalten Ordner- und Tag-Seiten die rechte Spalte, auch wenn nur die Graphansicht darin steht. Damit beginnt die Liste genau dort, wo auf einer Inhaltsseite der Text beginnt — der Sprung von einem Artikel zu seinem Ordner verschiebt die Zeile nicht mehr.
Beide Seitentypen nutzen den Frame index, der geometrisch derselbe ist wie editorial. Ein
Inhaltsverzeichnis entsteht hier trotzdem nicht — eine Liste von Links hat keine Überschriften. Die
Graphansicht schon, und die steht rechts wie überall sonst; die Rückverweise stehen wie auf jeder
anderen Seite unter der Liste.
Auf einer Ordnerseite zeigt der Graph nur einen Punkt
Auch dann, wenn die Seite verlinkt ist. Das ist ein Fehler im Plugin und von einer Vorlage aus nicht zu beheben — die Einzelheiten stehen unter Graph. Was die Verbindungen trotzdem zeigt, sind die Rückverweise unter der Liste.
Zwei Funde beim Bauen
.desc enthält den Titel, nicht die Beschreibung. Wer den Namen wörtlich nimmt und die Klasse
gedämpft setzt, gräut jeden Eintragstitel auf jeder Listenseite aus.
Dieselben Klassennamen benutzt „zuletzt geändert“. Ohne Eingrenzung auf .page-listing landet
das dreispaltige Raster in der schmalen Seitenleiste.
Die Tag-Seite
Der Titel ist der Tag-Name als reiner Text. Diese Vorlage stellt ihm ein Rautenzeichen voran — als
::before, damit es nicht in der Vorlesereihenfolge landet.
Zwei Sprachen, zwei Sätze Listen
Zu jedem Ordner gibt es eine Ordnerseite, auch zu
en/, und die englischen Seiten tragen englische Tags. Die Listen mischen die Sprachen deshalb nie — mit einer Ausnahme: die Ordnerseite vonenselbst, die die englische Startseite ist und von Hand geschrieben wird.
Welche Variablen hier greifen
Diese 14 Variablen liest der Abschnitt page-listing in pages.scss. Ändern lassen sie sich in QuartzControl unter Stile → Variablen — ohne eine Zeile CSS.
| Variable | Wert | gilt außerdem für |
|---|---|---|
--dark | #17171A · dunkel #FCFCFA | 13 weitere Komponenten |
--gray | #5F5F5F · dunkel #A1A1A1 | 22 weitere Komponenten |
--icon-tag | im Stylesheet gesetzt (foundation.scss) | Tags |
--secondary | #1463A3 · dunkel #699DC3 | 19 weitere Komponenten |
--tpl-rule | var(--lightgray) = #DDDDDD | 19 weitere Komponenten |
--tpl-rule-width | 1px | 25 weitere Komponenten |
--tpl-space-3xs | 0.125rem | 6 weitere Komponenten |
--tpl-space-md | 1rem | 18 weitere Komponenten |
--tpl-space-sm | 0.75rem | 10 weitere Komponenten |
--tpl-space-xl | 2.5rem | 5 weitere Komponenten |
--tpl-space-xs | 0.5rem | 20 weitere Komponenten |
--tpl-text-base | 1rem | 4 weitere Komponenten |
--tpl-text-sm | 0.875rem | 20 weitere Komponenten |
--tpl-underline-offset | 0.18em | 6 weitere Komponenten |
Diese Tabelle ist erzeugt: Sie wird aus den Stylesheets gelesen, nicht von Hand gepflegt.