Wikipedia:Redaktion Musik/styles

[Verwendung]   [CSS bearbeiten]

Diese Seite dokumentiert TemplateStyles betreffend Wikipedia:Redaktion Musik.

CSS

.redmus-titel {
	font-family: 'Gill Sans', 'Gill Sans MT', Futura, sans-serif; 
	font-size:120%; 
	border-bottom: solid 1px #547892;
}

.redmus-kasten {
	font-size: 95%; 
	margin-bottom:0.5em; 
	vertical-align:top; 
	overflow:auto;
}

.redmus-untereinander {
	display: flex;
}

.redmus-spalten {
	vertical-align:top;
}

.redmus-edit {
	float:right; 
	margin-top:6px; 
	font-size:smaller;
}

.redmus-mobileonly {
	display:none;
}

/* 
Mobilgeräte
*/
@media 
only screen and (max-width: 720px)  {
	
	.redmus-untereinander {
		display: block;
		clear: right;
	}
	.redmus-spalten {
		width: 100% !important;
		margin:0 !important;
	}
	.redmus-linkbox {
		float: none !important;
		margin: 0 !important;
		width: auto !important;
	}
	.redmus-portale {
		font-variant: normal;
		font-size: smaller;
		font-weight: normal;
	}
	.redmus-hidemobile {
		display:none !important;
	}
	.redmus-mobileonly {
		display: block !important;
	}
	.redmus-layouttabelle table, .redmus-layouttabelle th, .redmus-layouttabelle tbody, .redmus-layouttabelle tr {
		display:block;
		border:none;
	}
	.redmus-layouttabelle table {
		width:100% !important;
	}
	.redmus-layouttabelle td {
		display:block;
		border:none;
		width:unset !important;
	}
	.redmus-layouttabelle th {
		padding:0;
		width:unset !important;
	}
	.redmus-bildbreite img {
		max-width:100%;
		height:auto;
	}
	.redmus-tabs {
		display:grid;
	}
}

Kopiervorlage

<templatestyles src="Wikipedia:Redaktion Musik/styles.css" />

---

Zweck

Die Styles dienen in erster Linie dazu, Projekt- und Portalseiten aus dem Musikbereich für Mobilgeräte zugänglicher zu machen. Sie werden über {{Index-Musik}} sowie über {{Linkbox Redaktion Musik}} automatisch eingebunden.

Klassen

Responsives Layout

redmus-hidemobile

Element wird auf Mobilgeräten nicht angezeigt.

redmus-mobileonly

Element wird nur auf Mobilgeräten (als block) angezeigt.

redmus-layouttabelle

Eine Tabelle und sämtliche Bestandteile werden auf Mobilgeräten in block-Elemente umgewandelt und ohne Rahmen oder Innenabstände sowie mit 100 % Breite dargestellt.

redmus-bildbreite

Bilder innerhalb des Elements werden auf Mobilgeräten maximal mit 100 % Breite dargestellt und im Verhältnis skaliert.

redmus-tabs

Element wird auf Mobilgeräten als grid dargestellt.

redmus-untereinander

Element wird als Flexbox formatiert und auf Mobilgeräten in ein block-Element umgewandelt.

redmus-spalten

Element wird auf Mobilgeräten mit 100 % Breite dargestellt.

redmus-linkbox

Die Linkbox wird auf Mobilgeräten zentriert.

redmus-portale

Die Auflistung der Portale im Index-Musik wird auf Mobilgeräten kompakter dargestellt.

Weitere Klassen

redmus-titel

Text wird in Gill Sans, 120 % groß und mit einer grauen, unteren Rahmenlinie dargestellt.

redmus-kasten

Element wird mit weißem Hintergrund, 95 % Schriftgröße, 0.5em unterem Abstand, oberer Ausrichtung und automatischem overflow dargestellt.