Wikivoyage:CSS-Klassen

Aus Wikivoyage

Diese Seite dient der Dokumentation der auf Wikivoyage verwendeten CSS-Klassen. Benutzer können sich damit das Outfit des Wikis anpassen und Anwendungen programmieren. Historisch bedingt herrscht auf Wikivoyage (noch) ein unübersichtlicher Zoo an Klassen. Irgendwann soll dies vereinheitlicht werden. Auf dieser Seite sind bis auf einige allgemeine Standard-Klassen nur die Klassen definiert, die mit dem künftig bevorzugten Präfix voy- beginnen.

Standard-CSS-Klassen auf Wikivoyage[Bearbeiten]

Die folgenden Klassen sind standardisiert und können auf allen Seiten verwendet werden.

Standard-CSS-Klassen auf Wikivoyage
CSS-Klasse(n) CSS-Datei Bemerkungen
nomobile Entfernt das Element auf mobilen Endgeräten. Mit dieser Klasse versehene Elemente werden bereits auf Ebene des Parsers herausgefiltert und erreichen somit nie das Endgerät und können daher auch nicht mehr mittels CSS oder JavaScript eingeblendet werden.
Zum Testen der Funktionalität kann der URL-Parameter useformat=mobile benutzt werden.
notpageimage Die Klasse verhindert, dass ein Bild als Vorschaubild für den Artikel benutzt wird. Beispiel: [[File:Example.png|class=notpageimage]][1][2]
mw-collapsed jquery.makeCollapsible.js Klappt ein mit mw-collapsible versehenes Element standardmäßig ein.
mw-collapsible jquery.makeCollapsible.js Erweitert ein Element um die Möglichkeit es einzuklappen.
prettytable MediaWiki:Common.css Standard-Klasse für Tabellen im Wikivoyage-Design. Sieh auch Hilfe:Tabellen.
sortable Fügt eine Sortiermöglichkeit im Kopf jeder Tabellenspalte ein.
voy-only-mobile MediaWiki:Common.css Zeigt das Element ausschließlich auf mobilen Endgeräten an.
voy-small MediaWiki:Common.css Macht Texte etwas kleiner. Kann auf jedes Tag angewendet werden.
voy-bold MediaWiki:Common.css Formatiert Texte in Fettschrift. Kann auf jedes Tag angewendet werden.
voy-table-odd-even MediaWiki:Common.css Anzuwenden auf die Tabelle, wenn ein zeilenweiser Wechsel der Farbe gewünscht ist. Nicht notwendig, bei der Standardklasse multiline, da in dieser enthalten.
voy-table-cell-vAlignTop MediaWiki:Common.css Die Klasse richtet in Tabellenzellen alle Inhalte am oberen Rand aus. Anzuwenden auf die Tabelle.
wikitable Dies ist eine Standard-Klasse von Mediawiki, die Tabellen zugewiesen werden kann und diese mit einem Grundstyling (hellgrauer Hintergrund, Rahmen, Innenabstand und Linksausrichtung) formatiert. Auf Wikivoyage dagegen ist die Klasse prettytable Standard.
wrap
nowrap
MediaWiki:Common.css Erlaubt und verhindert Umbrüche. Anwendbar überall.

Vorlagenspezifische CSS-Klassen auf Wikivoyage[Bearbeiten]

Diese Klassen werden nur innerhalb von bestimmten Vorlagen verwendet. Sie werden im Regelfall über TemplateStyles eingebunden.

Quickbars[Bearbeiten]

Quickbarelemente, die Daten aus Wikidata enthalten, können weitere Klassen besitzen. Weitere Infos dazu findest du weiter unten auf dieser Seite.

CSS-Klassen in Quickbars
CSS-Klasse(n) Vorlage/Modul CSS-Datei Bemerkungen
voy-qb
voy-qb-ort
voy-qb-region
voy-qb-country
voy-qb-<top-level-domain>
{{Quickbar Ort}}
{{Quickbar Region}}
{{Quickbar Land}}
Quickbar/styles.css Diese Klassen besitzt jeweils die gesamte Tabelle (<table>...</table>). Die Klasse mit der Top-Level-Domain kennzeichnet zusätzlich das Land, in dem der beschriebene Ort liegt. Diese wird, wenn möglich über Wikidata ermittelt.
voy-qb-item
voy-qb-item-<Eigenschaft>
{{Quickbar Ort}}
{{Quickbar Region}}
Quickbar/styles.css Diese Klassen besitzt jeweils die Tabellenzeile (<tr>...</tr>). Die Eigenschaft kennzeichnet dabei spezifische Zeilen der Quickbar, z. B. voy-qb-item-capital die Angabe der Hauptstadt.
voy-qb-empty Vorlagen:Quickbars Quickbar/styles.css Diese Klassen besitzt jeweils die Tabellenzeile (<tr>...</tr>). Sie macht eine Quickbarzeile in der Artikelansicht unsichtbar und wird Quickbareinträgen hinzugefügt, wenn eine Information nicht verfügbar ist. Im HTML ist die Zeile aber vorhanden, genau wie die Datenattribute (z. B. die Wikidata-ID). So können Programmierungen under Helferlein die Zeile benutzen.
voy-wikidata-content {{Quickbar Ort}}
{{Quickbar Region}}
Quickbar/styles.css Diese Klassen besitzt jeweils die Tabellenzelle (<td>...</td>), wenn die dargestellte Information von Wikidata bezogen wird.
voy-qb-item-value-nowikidata {{Quickbar Ort}}
{{Quickbar Region}}
Quickbar/styles.css Diese Klassen besitzt jeweils die Tabellenzelle (<td>...</td>), wenn die gewünschte Information auf Wikidata verfügbar ist.
voy-qb-item-value-wikidata-equal
voy-qb-item-value-wikidata-noequal
{{Quickbar Ort}}
{{Quickbar Region}}
Quickbar/styles.css Eine dieser Klassen besitzt jeweils die Tabellenzelle (<td>...</td>), je nachdem wie der Vergleich des lokal angegebenen Wertes mit dem auf Wikidata ausfiel.
Info- und Navigationsboxen[Bearbeiten]
CSS-Klassen in Infoboxen
CSS-Klasse(n) Vorlage/Modul CSS-Datei Bemerkungen
voy-box-archive {{Archiv}} Archiv/styles.css
voy-archive-nav-textbox
voy-archive-nav-navbox
voy-archive-nav-navbox-left
voy-archive-nav-navbox-right
voy-archive-nav-navbox-center
{{Archivnavigation}} Archiv/styles.css Kleine Navigationsvorlage zum Blättern durch Archive. Die Vorlage besitzt Unterseiten für die einzelnen Archive.
voy-klappbox
voy-klappbox-titel
voy-klappbox-inhalt
{{Klappbox}} Klappbox/styles.css  
voy-deletion-request
voy-deletion-request-running-info
{{Löschantrag}} Löschantrag/styles.css  
voy-navigation-block {{Navigationsblock}} Navigationsblock/styles.css  
voy-navigation-bar
voy-navigation-bar-xx
{{Navigationsleiste}} Box/styles.css Bei der Klasse voy-navigation-bar-xx entspricht das Präfix der Top-Level-Domain des Landes, in der die Navigationsleiste Verwendung findet. Alle Navigationsleisten für Thailand besitzten somit die zusätzliche Klasse voy-navigation-bar-th.
voy-regionListFrame
voy-regionListMap
voy-regionList
voy-regionName
voy-regionHeader
voy-regionDescription
voy-regionColon
voy-regionItems
voy-regionVersion2
{{Region List}}
{{Region Item}}
Region List/styles.css
Region Item/styles.css
Der Aufbau des HTML und die Anwendung der einzelnen Klassen kann im zugrunde liegenden Modul RegionList eingesehen werden.
voy-shortcut-box {{Shortcut}} Shortcut/styles.css  
Tabellen und Listen[Bearbeiten]
CSS-Klassen in Tabellen
CSS-Klasse(n) Vorlage/Modul CSS-Datei Bemerkungen
voy-toc-left-box {{TOC left}} TOC left/styles.css Die Klasse wird dem Inhaltsverzeichnis (<div>...</div>) zugewiesen.
voy-toc-right-box {{TOC right}} TOC right/styles.css Die Klasse wird dem Inhaltsverzeichnis (<div>...</div>) zugewiesen.
voy-holiday {{Feiertage Anfang}}
{{Feiertag}}
{{Feiertage Ende}}
Feiertag/styles.css Die Klasse wird der Tabelle (<table>...</table>) zugewiesen.
voy-slopes {{Skipisten Anfang}}
{{Skipiste}}
{{Skipisten Ende}}
  Die Klasse wird der Tabelle (<table>...</table>) zugewiesen.
Marker und Karten[Bearbeiten]
CSS-Klassen in Marker und Karten
CSS-Klasse(n) Vorlage/Modul CSS-Datei Bemerkungen
voy-coord-style {{Coord}} Coord/styles.css  
voy-locmap Location map (Doku) Location map/styles.css Die Klasse wird dem Wrapper-Element zugewiesen.
voy-locmap-marker-box Location map (Doku) Location map/styles.css Die Klasse wird dem -label und -symbol umgebenden <div>...</div> zugewiesen. In diesem Element erfolgt die Positionierung.
voy-locmap-marker-label Location map (Doku) Location map/styles.css Die Klasse wird dem umgebenden <div>...</div> der zum Marker gehörenden Bezeichnung zugewiesen.
voy-locmap-marker-symbol Location map (Doku) Location map/styles.css Die Klasse wird dem umgebenden <div>...</div> des Marker-Bildes zugewiesen.
voy-copy-marker {{Marker Kopie}}
Symbole[Bearbeiten]
CSS-Klassen in weiteren Vorlagen
CSS-Klasse(n) Vorlage/Modul CSS-Datei Bemerkungen
voy-flag-icon {{Flagicon}}    
voy-rsign
voy-rsign-⟨Landeskürzel⟩
{{RSIGN}}    
voy-symbol-aotm {{Symbol Artikel des Monats}}    
voy-symbol-bus {{Bus}}    
voy-symbol-gay {{Gay}}    
voy-symbol-inline {{Symbol}}
{{Flagicon}}
{{Gay}}
{{Symbol Artikel des Monats}}
{{Symbol Unesco}}
{{RSIGN}}
  Die Klasse wird für alle im Fließtext verwendbaren Symbolen verwendet. Sie wird dem das Bild umgebenden <span>...</span> zugewiesen.
voy-symbol-unesco {{Symbol Unesco}}    
weitere Vorlagen[Bearbeiten]
CSS-Klassen in weiteren Vorlagen
CSS-Klasse(n) Vorlage/Modul CSS-Datei Bemerkungen
Mehrspaltiges Layout
voy-two-columns
voy-two-columns-rule
{{2 Spalten}} 2 Spalten/styles.css  
voy-three-columns
voy-three-columns-rule
{{3 Spalten}} 3 Spalten/styles.css  
voy-four-columns
voy-four-columns-rule
{{4 Spalten}} 4 Spalten/styles.css  
Abstimmungen
voy-voting-deletion {{Behalten}}
{{Löschen}}
{{Neutral}}
   
voy-voting-deletion-keep {{Behalten}}    
voy-voting-deletion-delete {{Löschen}}    
voy-voting-deletion-neutral {{Neutral}}    
weitere Vorlagen
voy-audio {{Audio}}
{{Fremdsprache}} + abgeleitete Vorlagen
{{IPA}}
   
voy-audio-description {{Audio}}    
voy-hidden-text {{BlinderText}} BlinderText/styles.css  
voy-currency
voy-currency-⟨ISO-Code⟩
Modul:Exchange rate   Die Klasse wird für Preisangaben verwendet.
voy-keyboard-key {{Key press}}   Die Klasse wird zur Illustration für das Drücken von Tasten verwendet.
citation
voy-cite-title
voy-cite-collection-title
voy-cite-journal-title
voy-cite-chapter-title
voy-cite-website-title
voy-cite-newspaper-title
voy-cite-quotation
voy-cite-series
diese Vorlagen Citation/styles.css  
voy-foreign-lang-ipa {{Fremdsprache}} + abgeleitete Vorlagen
{{IPA}}
   
voy-cite
voy-cite-quotes-block
voy-cite-author
voy-cite-quote
voy-cite-source
{{Zitat}} Zitat/styles.css  
voy-box-intertitle {{Zwischentitel}} Zwischentitel/styles.css  

Kennzeichnung von Wikidata[Bearbeiten]

Diese Klassen kennzeichnen Daten von Wikidata. Sie sind aber nicht in einer CSS-Datei explizit ausgewiesen. Sie dienen lediglich der Möglichkeit der individuellen Gestaltung, Gadgets und Programmierern.

Kennzeichnung von Wikidata
CSS-Klasse(n) Vorlage/Modul CSS-Datei Bemerkungen
voy-wikidata-content Vorlagen:Wikidata MediaWiki:Gadget-Wikidata-Content.css Weist alle Inhalte aus, die von Wikidata eingebunden sind. Das Helferlein Inhalte von Wikidata markieren bietet die Möglichkeit, sich Wikidata-Inhalte kennzeichnen zu lassen.
voy-qb-item-value-nowikidata {{Quickbar Ort}}
{{Quickbar Region}}
  Kennzeichnet Quickbareinträge, bei denen Daten von Wikidata angefordert werden, dort aber keine vorhanden sind. Die Klasse liegt auf der Tabellenzelle <td>...</td>.
voy-qb-item-value-wikidata-equal {{Quickbar Ort}}
{{Quickbar Region}}
  Kennzeichnet Quickbareinträge, bei denen im Artikel ein Wert angegeben wurde und dieser mit der Angabe auf Wikidata identisch ist. Die Klasse liegt auf der Tabellenzelle <td>...</td>. In den Data-Attributen der Zelle sind die Wikidata-Daten für Programmierer verfügbar.
voy-qb-item-value-wikidata-noequal {{Quickbar Ort}}
{{Quickbar Region}}
  Kennzeichnet Quickbareinträge, bei denen im Artikel ein Wert angegeben wurde und dieser sich von der Angabe auf Wikidata unterscheidet. Die Klasse liegt auf der Tabellenzelle <td>...</td>. In den Data-Attributen der Zelle sind die Wikidata-Daten für Programmierer verfügbar.

Programmierungen[Bearbeiten]

Diese Klassen befinden sich nicht in Vorlagen, sondern im Javascript-Programmcode von Erweiterungen, die für Wikivoyage geschrieben wurden.

Programmierungen
CSS-Klasse(n) Programm CSS-Datei Bemerkungen
voy-user-login MediaWiki:Gadget-InitListingTools.js   Diese Klasse wird dem <body>...</body> zugewiesen, wenn der Benutzer aktuell angemeldet ist.
voy-list-delete-requests-item
voy-list-delete-requests-item-classic
voy-list-delete-requests-item-quick
voy-list-delete-requests-entry
voy-list-delete-requests-entry-reason
voy-list-delete-requests-entry-duration
voy-list-delete-requests-entry-links
MediaWiki:ListDeleteRequests.js MediaWiki:Common.css Liste aller Löschanträge auf Wikivoyage:Löschanträge.

Einzelnachweise