MediaWiki:Vector-2022.css: Unterschied zwischen den Versionen
Erscheinungsbild
Keine Bearbeitungszusammenfassung Markierung: Zurückgesetzt |
Keine Bearbeitungszusammenfassung Markierung: Manuelle Zurücksetzung |
||
| Zeile 2: | Zeile 2: | ||
HEADER: Layout & Optik | HEADER: Layout & Optik | ||
========================= */ | ========================= */ | ||
/* Header-Container: Hintergrund, Rahmen, sticky */ | /* Header-Container: Hintergrund, Rahmen, sticky */ | ||
.vector-header-container { | .vector-header-container { | ||
| Zeile 10: | Zeile 9: | ||
background-color: #AE9E86; | background-color: #AE9E86; | ||
border-bottom: 1px solid #333; | border-bottom: 1px solid #333; | ||
} | } | ||
.vector-header-container, | .vector-header-container, | ||
.vector-header-container .vector-header { | .vector-header-container .vector-header { | ||
background-color: #AE9E86 !important; | background-color: #AE9E86 !important; | ||
} | } | ||
/* Sticky-Header von Vector 2022 deaktivieren */ | /* Sticky-Header von Vector 2022 deaktivieren */ | ||
.client-js.vector-sticky-header-enabled .vector-sticky-header, | .client-js.vector-sticky-header-enabled .vector-sticky-header, | ||
| Zeile 27: | Zeile 19: | ||
display: none !important; | display: none !important; | ||
} | } | ||
/* Username-Link im Header einfärben */ | /* Username-Link im Header einfärben */ | ||
.vector-user-links .mw-list-item a { | .vector-user-links .mw-list-item a { | ||
color: #a86666 !important; | color: #a86666 !important; | ||
} | } | ||
/* Hover/Fokus-Farbe | /* Optional: Hover/Fokus-Farbe anpassen */ | ||
.vector-user-links .mw-list-item a:hover, | .vector-user-links .mw-list-item a:hover, | ||
.vector-user-links .mw-list-item a:focus { | .vector-user-links .mw-list-item a:focus { | ||
| Zeile 45: | Zeile 36: | ||
flex-direction: column; | flex-direction: column; | ||
align-items: center; | align-items: center; | ||
padding: | padding: 6px 0; | ||
} | } | ||
/* Zeile 1: Logo zentriert (ohne Userlinks) */ | /* Zeile 1: Logo zentriert (ohne Userlinks) */ | ||
.vector-header-start { | .vector-header-start { | ||
| Zeile 54: | Zeile 44: | ||
justify-content: center; /* Logo mittig */ | justify-content: center; /* Logo mittig */ | ||
align-items: center; | align-items: center; | ||
margin-bottom: | margin-bottom: 4px; | ||
padding: 0; | padding: 0; | ||
} | } | ||
.vector-header-start .mw-logo { | .vector-header-start .mw-logo { | ||
display: flex; | display: flex; | ||
| Zeile 64: | Zeile 52: | ||
gap: 8px; | gap: 8px; | ||
} | } | ||
//* Zeile 2: Suche mittig, Userlinks rechts */ | |||
/* Zeile 2: Suche mittig, Userlinks rechts */ | |||
.vector-header-end { | .vector-header-end { | ||
width: 100%; | width: 100%; | ||
| Zeile 77: | Zeile 60: | ||
margin: 0; | margin: 0; | ||
padding: 0; | padding: 0; | ||
gap: | gap: 8px; | ||
} | } | ||
/* Suche in der Mitte: alles alte Layout killen */ | |||
/* Suche in der Mitte: | |||
.vector-header-end #p-search { | .vector-header-end #p-search { | ||
grid-column: 2 !important; | grid-column: 2 !important; | ||
| Zeile 88: | Zeile 70: | ||
margin: 0 !important; | margin: 0 !important; | ||
padding: 0 !important; | padding: 0 !important; | ||
/* jedes Flex-Verhalten im Container deaktivieren */ | |||
display: block !important; | display: block !important; | ||
} | } | ||
/* Userlinks-Block rechts */ | /* Userlinks-Block rechts */ | ||
.vector-header-end .vector-user-links { | .vector-header-end .vector-user-links { | ||
| Zeile 100: | Zeile 83: | ||
display: block !important; | display: block !important; | ||
} | } | ||
/* Alle direkten Kinder in Zeile 2 neutralisieren */ | /* Alle direkten Kinder in Zeile 2 neutralisieren */ | ||
.vector-header-end > * { | .vector-header-end > * { | ||
margin: 0 !important; | margin: 0 !important; | ||
float: none !important; | float: none !important; | ||
} | } | ||
| Zeile 123: | Zeile 92: | ||
HEADER: Layout & Optik ENDE | HEADER: Layout & Optik ENDE | ||
========================= */ | ========================= */ | ||
/* Gesamte Seite dunkel setzen */ | /* Gesamte Seite dunkel setzen */ | ||
| Zeile 167: | Zeile 135: | ||
/* Links weiterhin in eigener Farbe lassen (nur falls du sie schon überschrieben hast) */ | /* Links weiterhin in eigener Farbe lassen (nur falls du sie schon überschrieben hast) */ | ||
.skin-vector-2022 .mw-body a { | .skin-vector-2022 .mw-body a { | ||
color: #4ea3ff; | color: #4ea3ff; | ||
} | } | ||
Version vom 12. Februar 2026, 13:32 Uhr
/* =========================
HEADER: Layout & Optik
========================= */
/* Header-Container: Hintergrund, Rahmen, sticky */
.vector-header-container {
position: sticky;
top: 0;
z-index: 1000;
background-color: #AE9E86;
border-bottom: 1px solid #333;
}
.vector-header-container,
.vector-header-container .vector-header {
background-color: #AE9E86 !important;
}
/* Sticky-Header von Vector 2022 deaktivieren */
.client-js.vector-sticky-header-enabled .vector-sticky-header,
.client-js.vector-sticky-header-enabled .vector-sticky-header-container {
display: none !important;
}
/* Username-Link im Header einfärben */
.vector-user-links .mw-list-item a {
color: #a86666 !important;
}
/* Optional: Hover/Fokus-Farbe anpassen */
.vector-user-links .mw-list-item a:hover,
.vector-user-links .mw-list-item a:focus {
color: #c87878 !important;
}
/* ## Layout Header ## */
/* Innerer Header als Spalte (Zeile 1: Logo, Zeile 2: Suche+Userlinks) */
.vector-header {
display: flex;
flex-direction: column;
align-items: center;
padding: 6px 0;
}
/* Zeile 1: Logo zentriert (ohne Userlinks) */
.vector-header-start {
width: 100%;
display: flex;
justify-content: center; /* Logo mittig */
align-items: center;
margin-bottom: 4px;
padding: 0;
}
.vector-header-start .mw-logo {
display: flex;
align-items: center;
gap: 8px;
}
//* Zeile 2: Suche mittig, Userlinks rechts */
.vector-header-end {
width: 100%;
display: grid !important;
grid-template-columns: 1fr auto auto; /* links leer, Mitte Suche, rechts Userlinks */
align-items: center;
margin: 0;
padding: 0;
gap: 8px;
}
/* Suche in der Mitte: alles alte Layout killen */
.vector-header-end #p-search {
grid-column: 2 !important;
justify-self: center !important;
float: none !important;
margin: 0 !important;
padding: 0 !important;
/* jedes Flex-Verhalten im Container deaktivieren */
display: block !important;
}
/* Userlinks-Block rechts */
.vector-header-end .vector-user-links {
grid-column: 3 !important;
justify-self: end !important;
float: none !important;
margin: 0 !important;
display: block !important;
}
/* Alle direkten Kinder in Zeile 2 neutralisieren */
.vector-header-end > * {
margin: 0 !important;
float: none !important;
}
/* =========================
HEADER: Layout & Optik ENDE
========================= */
/* Gesamte Seite dunkel setzen */
body {
background-color: #101218;
color: #f5f5f5;
}
.vector-sticky-pinned-container {
display: none !important;
}
/* Haupt-Inhaltsbereich an den dunklen Hintergrund anpassen */
.mw-page-container,
.vector-body,
.mw-content-container,
.mw-content-ltr {
background-color: transparent; /* oder #101218, falls nötig */
color: inherit;
}
/* Links etwas heller, damit sie lesbar bleiben */
.mw-body a {
color: #4ea3ff;
}
/* =====================
Texte Lesbar
===================== */
/* Grundtext im Vector‑2022-Skin hell machen */
.skin-vector-2022 body,
.skin-vector-2022 .mw-body,
.skin-vector-2022 .mw-body-content {
color: #ffffff;
}
/* Seitentitel (H1 „Start“) explizit weiß */
.skin-vector-2022 .mw-first-heading,
.skin-vector-2022 #firstHeading,
.skin-vector-2022 .mw-page-title-main {
color: #ffffff;
}
/* Links weiterhin in eigener Farbe lassen (nur falls du sie schon überschrieben hast) */
.skin-vector-2022 .mw-body a {
color: #4ea3ff;
}