MediaWiki:Vector-2022.css: Unterschied zwischen den Versionen
Erscheinungsbild
Keine Bearbeitungszusammenfassung |
Keine Bearbeitungszusammenfassung |
||
| Zeile 106: | Zeile 106: | ||
} | } | ||
/* Suchleiste im Sticky-Header auf | /* Gesamte Suchleiste im Sticky-Header auf 10vw begrenzen, Hintergrund transparent */ | ||
.vector-sticky-header #vector-sticky-search-form { | .vector-sticky-header #vector-sticky-search-form { | ||
max-width: 10vw; | max-width: 10vw; | ||
width: 10vw; | width: 10vw; | ||
background-color: transparent | background-color: transparent; | ||
} | } | ||
/* | /* Container mit Icon innerhalb des Sticky-Headers auf volle Formularbreite setzen, aber transparent lassen */ | ||
.vector-sticky-header #vector-sticky-search-form .cdx- | .vector-sticky-header #vector-sticky-search-form .cdx-text-input.cdx-text-input--has-start-icon { | ||
width: 100%; | |||
background-color: transparent; | |||
} | } | ||
/* | /* Nur das Input einfärben, ohne Rand */ | ||
.vector-sticky-header #vector-sticky-search-form .cdx-text-input__input | .vector-sticky-header #vector-sticky-search-form .cdx-text-input__input { | ||
width: 100%; | width: 100%; | ||
background-color: #10141842 !important; | background-color: #10141842 !important; | ||
border: none | border: none; | ||
box-shadow: none | box-shadow: none; | ||
} | } | ||
Version vom 14. Februar 2026, 00:14 Uhr
/* Ausgeblendete Elemente */
#vector-appearance,
#vector-appearance-dropdown,
#mw-navigation,
#catlinks,
#mw-normal-catlinks,
#pt-createaccount-2,
#pt-login-2,
#ca-talk,
#ca-unwatch,
#ca-watch,
#pt-watchlist-2,
#ca-talk-sticky-header,
#ca-history-sticky-header,
#ca-watchstar-sticky-header,
#ca-subject-sticky-header,
#ca-viewsource-sticky-header,
#ca-addsection-sticky-header,
nav.vector-appearance-landmark,
.vector-column-start,
.vector-main-menu-container,
.vector-column-end,
.vector-sticky-pinned-container,
.vector-header.mw-header,
.vector-page-tools-dropdown,
.vector-page-toolbar-container,
.vector-sticky-header-icon-start.vector-button-flush-left.vector-button-flush-right,
.cdx-button.cdx-search-input__end-button,
.mw-body-header.vector-page-titlebar,
.catlinks,
.mw-navigation,
.mw-logo-container,
.mw-normal-catlinks {
display: none !important;
}
/* Klassen (.class) */
.mw-page-container,
.mw-page-container-inner {
background: transparent !important;
}
/* Einzelne Klasse überschreiben */
.mw-page-container-inner {
display: block !important;
}
/* =================
Sticky-Header
================= */
/* Sticky-Header als Hauptheader oben fixieren */
.client-js.vector-sticky-header-enabled .vector-sticky-header-container {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 1000;
display: flex !important;
transform: translateY(0);
opacity: 1;
}
/* Sticky-Header-Layout: drei Spalten */
.vector-sticky-header {
display: flex;
align-items: center;
justify-content: space-between;
}
/* neue Mittel-Spalte: Logo + Titel zentriert */
.pixo-sticky-center {
flex: 1 1 auto;
display: flex;
justify-content: center; /* horizontal zentriert */
align-items: center; /* vertikal zentriert */
}
/* optional: linke und rechte Bereiche nicht zu breit werden lassen */
.vector-sticky-header-start,
.vector-sticky-header-end {
flex: 0 0 auto;
}
/* Platz für den fixen Header schaffen (Höhe anpassen) */
.mw-page-container {
padding-top: 4.5rem; /* an reale Header-Höhe anpassen */
}
/* Logo/Titel im Sticky-Header etwas kompakter */
.pixo-sticky-logo .mw-logo-icon {
height: 40px;
width: 40px;
}
/* Anker-Sprünge nicht vom Header überdecken */
body.vector-sticky-header-visible {
scroll-padding-top: 4.5rem;
}
/* Icon im Vector-2022-Logo austauschen */
.mw-logo-icon {
content: url("/resources/assets/wip-logo.png");
width: 200px !important;
height: 60px !important;
margin: 0px !important;
}
/* Gesamte Suchleiste im Sticky-Header auf 10vw begrenzen, Hintergrund transparent */
.vector-sticky-header #vector-sticky-search-form {
max-width: 10vw;
width: 10vw;
background-color: transparent;
}
/* Container mit Icon innerhalb des Sticky-Headers auf volle Formularbreite setzen, aber transparent lassen */
.vector-sticky-header #vector-sticky-search-form .cdx-text-input.cdx-text-input--has-start-icon {
width: 100%;
background-color: transparent;
}
/* Nur das Input einfärben, ohne Rand */
.vector-sticky-header #vector-sticky-search-form .cdx-text-input__input {
width: 100%;
background-color: #10141842 !important;
border: none;
box-shadow: none;
}
/* ==================
Funktionen Einblenden
================== */
.vector-search-box-vue.vector-search-box-show-thumbnail.vector-search-box {
display: block !important;
}
.pixo-sticky-logo .mw-logo-wordmark {
font-size: 1.4rem;
margin-left: 0.5rem;
}