MediaWiki:Common.css: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
No edit summary Tag: Reverted |
||
| Line 1: | Line 1: | ||
/* ============================================================ | /* ============================================================ | ||
Wiki-style typography: serif page titles, grotesk (sans-serif) | |||
body text — matches MediaWiki's own default font pairing. | |||
============================================================ */ | ============================================================ */ | ||
/* everything defaults to the grotesk/sans-serif body font */ | |||
/* everything defaults to the grotesk/sans-serif | |||
*, | *, | ||
*::before, | *::before, | ||
| Line 10: | Line 9: | ||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !important; | font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !important; | ||
} | } | ||
/* page titles only: serif */ | /* page titles only: serif — same stack MediaWiki uses for #firstHeading */ | ||
#firstHeading, | #firstHeading, | ||
.firstHeading, | .firstHeading, | ||
| Line 16: | Line 15: | ||
font-family: "Linux Libertine", Georgia, Times, "Times New Roman", serif !important; | font-family: "Linux Libertine", Georgia, Times, "Times New Roman", serif !important; | ||
} | } | ||
/* Logo ausblenden — dieser Block (#p-logo, 200x160px) saß ganz | |||
/* | oben im Sidebar und war die eigentliche Ursache des großen | ||
Abstands über "About" */ | |||
#p-logo, | #p-logo, | ||
.mw-wiki-logo, | .mw-wiki-logo, | ||
| Line 31: | Line 29: | ||
width: 0 !important; | width: 0 !important; | ||
} | } | ||
/* Gesamte Seite schwarz machen */ | |||
body { | body { | ||
background-color: #000 !important; | background-color: #000 !important; | ||
| Line 38: | Line 37: | ||
text-decoration: none !important; | text-decoration: none !important; | ||
} | } | ||
/* Inhaltsbereich (Artikel) */ | |||
.mw-body { | .mw-body { | ||
background-color: #000 !important; | background-color: #000 !important; | ||
color: #fff !important; | color: #fff !important; | ||
border: | border: 0px solid #444 !important; | ||
box-shadow: none !important; | box-shadow: none !important; | ||
text-decoration: none !important; | text-decoration: none !important; | ||
} | } | ||
/* Überschriften weiß machen */ | |||
h1, h2, h3, h4, h5, h6 { | h1, h2, h3, h4, h5, h6 { | ||
color: #fff !important; | color: #fff !important; | ||
| Line 50: | Line 51: | ||
text-decoration: none !important; | text-decoration: none !important; | ||
} | } | ||
/* Spezielle MediaWiki-Trennlinien entfernen */ | |||
.mw-headline, .firstHeading, .mw-title { | .mw-headline, .firstHeading, .mw-title { | ||
border: none !important; | border: none !important; | ||
| Line 55: | Line 57: | ||
text-decoration: none !important; | text-decoration: none !important; | ||
} | } | ||
/* Pseudo-Elemente, die Linien erzeugen könnten, entfernen */ | |||
h1::after, h2::after, h3::after, h4::after, h5::after, h6::after { | h1::after, h2::after, h3::after, h4::after, h5::after, h6::after { | ||
content: "" !important; | content: "" !important; | ||
display: none !important; | display: none !important; | ||
box-shadow: none !important; | box-shadow: none !important; | ||
text-decoration: none !important; | |||
} | } | ||
hr { | /* Entfernt alle möglichen Linien in MediaWiki */ | ||
hr, .mw-content-ltr hr, .mw-parser-output hr { | |||
display: none !important; | display: none !important; | ||
border: none !important; | |||
height: 0 !important; | height: 0 !important; | ||
box-shadow: none !important; | |||
text-decoration: none !important; | |||
} | } | ||
/* Kopfzeile und Navigation */ | |||
#mw-head, | #mw-head, | ||
#p-personal, | #p-personal, | ||
#mw-panel | #mw-panel { | ||
background-color: #000 !important; | background-color: #000 !important; | ||
color: #fff !important; | color: #fff !important; | ||
| Line 88: | Line 81: | ||
text-decoration: none !important; | text-decoration: none !important; | ||
} | } | ||
/* Menüleisten und Boxen */ | |||
.vector-menu-content, | .vector-menu-content, | ||
.vector-menu-content ul { | .vector-menu-content ul { | ||
| Line 95: | Line 89: | ||
text-decoration: none !important; | text-decoration: none !important; | ||
} | } | ||
/* Eingabefelder, Suchbox */ | |||
input, textarea { | input, textarea { | ||
background-color: #222 !important; | background-color: #222 !important; | ||
color: #fff !important; | color: #fff !important; | ||
border: | border: 0px solid #444 !important; | ||
box-shadow: none !important; | box-shadow: none !important; | ||
text-decoration: none !important; | text-decoration: none !important; | ||
} | } | ||
/* Links */ | |||
a { | a { | ||
color: #4aa5ff !important; | color: #4aa5ff !important; | ||
| Line 113: | Line 104: | ||
color: #9c77ff !important; | color: #9c77ff !important; | ||
} | } | ||
/* Tabellen, Boxen, Panels ohne Ränder */ | |||
table, th, td, .mw-body-content, .vector-menu-content, .vector-menu-tabs { | table, th, td, .mw-body-content, .vector-menu-content, .vector-menu-tabs { | ||
border: none !important; | border: none !important; | ||
background: #000 !important; | background-color: #000 !important; | ||
box-shadow: none !important; | box-shadow: none !important; | ||
text-decoration: none !important; | text-decoration: none !important; | ||
background-image: none !important; | background-image: none !important; | ||
background: none !important; | |||
} | } | ||
/* Dropdown-Menüs */ | |||
.vector-dropdown { | .vector-dropdown { | ||
background-color: #000 !important; | background-color: #000 !important; | ||
| Line 126: | Line 120: | ||
text-decoration: none !important; | text-decoration: none !important; | ||
} | } | ||
/* Footer (unten) */ | |||
#footer, #footer li, #footer a { | #footer, #footer li, #footer a { | ||
background-color: #000 !important; | background-color: #000 !important; | ||
color: #fff !important; | color: #fff !important; | ||
} | } | ||
/* | /* Hauptnavigation oben */ | ||
#mw-head, | |||
#p-personal, | |||
#left-navigation, | |||
#right-navigation { | |||
background-color: #000 !important; /* Schwarzer Hintergrund */ | |||
color: #fff !important; /* Weiße Schrift */ | |||
box-shadow: none !important; | |||
text-decoration: none !important; | |||
} | |||
/* Tabs ("Read", "Discussion", etc.) */ | |||
#p-views .vector-menu-content ul { | #p-views .vector-menu-content ul { | ||
background-color: #000 !important; | background-color: #000 !important; | ||
| Line 136: | Line 141: | ||
text-decoration: none !important; | text-decoration: none !important; | ||
} | } | ||
/* Einzelne Tabs */ | |||
#p-views li { | #p-views li { | ||
background-color: #000 !important; | background-color: #000 !important; | ||
border: | border: 0px solid #444 !important; /* Optional: Dunkle Ränder */ | ||
box-shadow: none !important; | box-shadow: none !important; | ||
text-decoration: none !important; | text-decoration: none !important; | ||
} | } | ||
/* Ensure "Main Page" and "Discussion" links match the sidebar links */ | |||
#p-views li a, | #p-views li a, | ||
#p-namespaces li a, | #p-namespaces li a, | ||
#p-variants li a { | #p-variants li a { | ||
color: #4aa5ff !important; | color: #4aa5ff !important; /* Same blue as sidebar links */ | ||
text-decoration: none !important; | text-decoration: none !important; | ||
} | } | ||
/* Hover effect */ | |||
#p-views li a:hover, | #p-views li a:hover, | ||
#p-namespaces li a:hover, | #p-namespaces li a:hover, | ||
#p-variants li a:hover { | #p-variants li a:hover { | ||
color: #9c77ff !important; | color: #9c77ff !important; /* Same as visited links */ | ||
} | |||
/* Make the top navigation links match the sidebar link colors */ | |||
#p-views a, | |||
#p-views a:visited, | |||
#p-views a:active, | |||
#p-views a:hover { | |||
color: #4aa5ff !important; /* Same blue as sidebar links */ | |||
text-decoration: none !important; | |||
} | |||
/* If you want a hover effect */ | |||
#p-views a:hover { | |||
color: #9c77ff !important; /* Same as visited links */ | |||
} | } | ||
/* Falls noch weiß auftaucht, versuche dies für spezifische Skins */ | |||
.vector-menu-tabs li, | .vector-menu-tabs li, | ||
.vector-menu-tabs a { | .vector-menu-tabs a { | ||
| Line 162: | Line 181: | ||
text-decoration: none !important; | text-decoration: none !important; | ||
background-image: none !important; | background-image: none !important; | ||
background: none !important; | |||
} | } | ||
/* Remove background gradients from menu tabs and headings */ | |||
#mw-head .vector-menu-dropdown .vector-menu-heading, | #mw-head .vector-menu-dropdown .vector-menu-heading, | ||
.vector-legacy-sidebar .vector-menu-portal .vector-menu-heading { | .vector-legacy-sidebar .vector-menu-portal .vector-menu-heading { | ||
| Line 168: | Line 189: | ||
background: none !important; | background: none !important; | ||
} | } | ||
/* Dropdown-Menüs (z. B. "Mehr") */ | |||
.vector-dropdown { | |||
background-color: #000 !important; | |||
} | |||
/* Suchleiste */ | |||
#p-search input { | |||
background-color: #222 !important; | |||
color: #fff !important; | |||
border: 1px solid #444 !important; | |||
} | |||
/* ALLE Trennlinien entfernen */ | |||
hr, | |||
.mw-body hr, | |||
.vector-menu-content ul, | |||
.vector-menu-content li, | |||
.vector-menu-tabs li, | |||
.vector-menu-tabs a, | |||
table, th, td, | |||
.mw-panel, | |||
.vector-dropdown, | |||
#footer { | |||
border: none !important; | |||
box-shadow: none !important; | |||
} | |||
/* Tabellen ohne Linien */ | |||
table, th, td { | |||
border: none !important; | |||
background-color: #000 !important; | |||
} | |||
.vector-legacy-sidebar .vector-menu-portal .vector-menu-heading { | |||
background-image: none !important; | |||
background: none !important; | |||
} | |||
/* Hide Tools box that Vector 2022 renders itself */ | |||
#p-tb { | #p-tb { | ||
display: none; | display: none; | ||
} | } | ||
/* Hide "Powered by MediaWiki" */ | |||
.mw-footer .poweredby { | .mw-footer .poweredby { | ||
display: none !important; | display: none !important; | ||
} | } | ||
/* Hide the "navigation" heading in the sidebar */ | |||
#p-navigation h3, | #p-navigation h3, | ||
#p-navigation .vector-menu-heading, | #p-navigation .vector-menu-heading, | ||
| Line 179: | Line 236: | ||
display: none !important; | display: none !important; | ||
} | } | ||
/* ============================================================ | /* ============================================================ | ||
ADDED 2: text sizes — content area and sidebar. | |||
============================================================ */ | ============================================================ */ | ||
#content, | #content, | ||
| Line 211: | Line 267: | ||
margin-left: 0.5em !important; | margin-left: 0.5em !important; | ||
} | } | ||
/* ============================================================ | /* ============================================================ | ||
ADDED 3: turn off dark mode toggle, Create account, Log in | |||
============================================================ */ | ============================================================ */ | ||
#pt-darkmode, | #pt-darkmode, | ||
#pt-darkmode-sticky-header, | #pt-darkmode-sticky-header, | ||
#pt-createaccount, | #pt-createaccount, | ||
#pt-login | #pt-login { | ||
display: none !important; | |||
} | |||
#ca-talk { | #ca-talk { | ||
display: none !important; | display: none !important; | ||
} | } | ||
/* ============================================================ | /* ============================================================ | ||
ADDED 4: gap above the page title / below the black header bar, | |||
and cap the content width so right-floated images keep | |||
overlapping the text boxes even on wide/maximized windows. | |||
============================================================ */ | ============================================================ */ | ||
#content { | #content { | ||
| Line 242: | Line 300: | ||
} | } | ||
#mw-content-text, | #mw-content-text, | ||
#mw-content-text > .mw-parser-output | #mw-content-text > .mw-parser-output { | ||
margin-top: 0 !important; | |||
padding-top: 0 !important; | |||
} | |||
.mw-parser-output > p:first-of-type, | .mw-parser-output > p:first-of-type, | ||
.mw-parser-output > p:first-child, | .mw-parser-output > p:first-child, | ||
| Line 251: | Line 312: | ||
padding-top: 0 !important; | padding-top: 0 !important; | ||
} | } | ||
/* ============================================================ | /* ============================================================ | ||
ADDED 5: force black text on the printable version | |||
============================================================ */ | ============================================================ */ | ||
@media print { | @media print { | ||
| Line 264: | Line 324: | ||
} | } | ||
} | } | ||
/* ============================================================ | |||
/* | MONOSKOP-STYLE LAYOUT — running text in 2 columns (browser fills | ||
the left column first, then the right), [[File:…|thumb|right]] | |||
floats right, gallery stays FULL WIDTH (no columns). LAYOUT ONLY — | |||
no colours or boxes changed. | |||
Tune: change "column-count: 2" (e.g. 1 to switch off) or the | |||
"column-gap" spacing between the columns. | |||
============================================================ */ | |||
============================================================ | .mw-parser-output { | ||
column-count: 2 !important; | column-count: 2 !important; | ||
column-gap: | column-gap: 44px !important; | ||
} | } | ||
/* don't split a paragraph / list item / heading across the column break */ | |||
.mw-parser-output > p, | |||
.mw-parser-output > blockquote, | |||
.mw-parser-output > ul:not(.gallery) > li, | |||
.mw-parser-output h2, | |||
.mw-parser-output h3, | |||
.mw-parser-output h4, | |||
.mw-parser-output .mw-heading { | |||
break-inside: avoid !important; | break-inside: avoid !important; | ||
} | } | ||
/* a title-like first line (e.g. <div class="firstHeading">…) spans both columns */ | |||
.mw-parser-output > .firstHeading { | |||
column-span: all !important; | |||
} | } | ||
/* GALLERY: full width, NO columns (as always) */ | |||
.mw-parser-output .gallery, | |||
.mw-parser-output ul.gallery { | |||
column-span: all !important; | |||
} | } | ||
Revision as of 12:57, 16 August 2026
/* ============================================================
Wiki-style typography: serif page titles, grotesk (sans-serif)
body text — matches MediaWiki's own default font pairing.
============================================================ */
/* everything defaults to the grotesk/sans-serif body font */
*,
*::before,
*::after {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !important;
}
/* page titles only: serif — same stack MediaWiki uses for #firstHeading */
#firstHeading,
.firstHeading,
.mw-page-title-main {
font-family: "Linux Libertine", Georgia, Times, "Times New Roman", serif !important;
}
/* Logo ausblenden — dieser Block (#p-logo, 200x160px) saß ganz
oben im Sidebar und war die eigentliche Ursache des großen
Abstands über "About" */
#p-logo,
.mw-wiki-logo,
.mw-logo,
.mw-logo-icon,
.mw-logo-wordmark,
.vector-logo {
display: none !important;
visibility: hidden !important;
height: 0 !important;
width: 0 !important;
}
/* Gesamte Seite schwarz machen */
body {
background-color: #000 !important;
color: #fff !important;
border: none !important;
box-shadow: none !important;
text-decoration: none !important;
}
/* Inhaltsbereich (Artikel) */
.mw-body {
background-color: #000 !important;
color: #fff !important;
border: 0px solid #444 !important;
box-shadow: none !important;
text-decoration: none !important;
}
/* Überschriften weiß machen */
h1, h2, h3, h4, h5, h6 {
color: #fff !important;
box-shadow: none !important;
text-decoration: none !important;
}
/* Spezielle MediaWiki-Trennlinien entfernen */
.mw-headline, .firstHeading, .mw-title {
border: none !important;
box-shadow: none !important;
text-decoration: none !important;
}
/* Pseudo-Elemente, die Linien erzeugen könnten, entfernen */
h1::after, h2::after, h3::after, h4::after, h5::after, h6::after {
content: "" !important;
display: none !important;
box-shadow: none !important;
text-decoration: none !important;
}
/* Entfernt alle möglichen Linien in MediaWiki */
hr, .mw-content-ltr hr, .mw-parser-output hr {
display: none !important;
border: none !important;
height: 0 !important;
box-shadow: none !important;
text-decoration: none !important;
}
/* Kopfzeile und Navigation */
#mw-head,
#p-personal,
#mw-panel {
background-color: #000 !important;
color: #fff !important;
box-shadow: none !important;
text-decoration: none !important;
}
/* Menüleisten und Boxen */
.vector-menu-content,
.vector-menu-content ul {
background-color: #000 !important;
color: #fff !important;
box-shadow: none !important;
text-decoration: none !important;
}
/* Eingabefelder, Suchbox */
input, textarea {
background-color: #222 !important;
color: #fff !important;
border: 0px solid #444 !important;
box-shadow: none !important;
text-decoration: none !important;
}
/* Links */
a {
color: #4aa5ff !important;
}
a:visited {
color: #9c77ff !important;
}
/* Tabellen, Boxen, Panels ohne Ränder */
table, th, td, .mw-body-content, .vector-menu-content, .vector-menu-tabs {
border: none !important;
background-color: #000 !important;
box-shadow: none !important;
text-decoration: none !important;
background-image: none !important;
background: none !important;
}
/* Dropdown-Menüs */
.vector-dropdown {
background-color: #000 !important;
color: #fff !important;
box-shadow: none !important;
text-decoration: none !important;
}
/* Footer (unten) */
#footer, #footer li, #footer a {
background-color: #000 !important;
color: #fff !important;
}
/* Hauptnavigation oben */
#mw-head,
#p-personal,
#left-navigation,
#right-navigation {
background-color: #000 !important; /* Schwarzer Hintergrund */
color: #fff !important; /* Weiße Schrift */
box-shadow: none !important;
text-decoration: none !important;
}
/* Tabs ("Read", "Discussion", etc.) */
#p-views .vector-menu-content ul {
background-color: #000 !important;
box-shadow: none !important;
text-decoration: none !important;
}
/* Einzelne Tabs */
#p-views li {
background-color: #000 !important;
border: 0px solid #444 !important; /* Optional: Dunkle Ränder */
box-shadow: none !important;
text-decoration: none !important;
}
/* Ensure "Main Page" and "Discussion" links match the sidebar links */
#p-views li a,
#p-namespaces li a,
#p-variants li a {
color: #4aa5ff !important; /* Same blue as sidebar links */
text-decoration: none !important;
}
/* Hover effect */
#p-views li a:hover,
#p-namespaces li a:hover,
#p-variants li a:hover {
color: #9c77ff !important; /* Same as visited links */
}
/* Make the top navigation links match the sidebar link colors */
#p-views a,
#p-views a:visited,
#p-views a:active,
#p-views a:hover {
color: #4aa5ff !important; /* Same blue as sidebar links */
text-decoration: none !important;
}
/* If you want a hover effect */
#p-views a:hover {
color: #9c77ff !important; /* Same as visited links */
}
/* Falls noch weiß auftaucht, versuche dies für spezifische Skins */
.vector-menu-tabs li,
.vector-menu-tabs a {
background-color: #000 !important;
color: #fff !important;
box-shadow: none !important;
text-decoration: none !important;
background-image: none !important;
background: none !important;
}
/* Remove background gradients from menu tabs and headings */
#mw-head .vector-menu-dropdown .vector-menu-heading,
.vector-legacy-sidebar .vector-menu-portal .vector-menu-heading {
background-image: none !important;
background: none !important;
}
/* Dropdown-Menüs (z. B. "Mehr") */
.vector-dropdown {
background-color: #000 !important;
}
/* Suchleiste */
#p-search input {
background-color: #222 !important;
color: #fff !important;
border: 1px solid #444 !important;
}
/* ALLE Trennlinien entfernen */
hr,
.mw-body hr,
.vector-menu-content ul,
.vector-menu-content li,
.vector-menu-tabs li,
.vector-menu-tabs a,
table, th, td,
.mw-panel,
.vector-dropdown,
#footer {
border: none !important;
box-shadow: none !important;
}
/* Tabellen ohne Linien */
table, th, td {
border: none !important;
background-color: #000 !important;
}
.vector-legacy-sidebar .vector-menu-portal .vector-menu-heading {
background-image: none !important;
background: none !important;
}
/* Hide Tools box that Vector 2022 renders itself */
#p-tb {
display: none;
}
/* Hide "Powered by MediaWiki" */
.mw-footer .poweredby {
display: none !important;
}
/* Hide the "navigation" heading in the sidebar */
#p-navigation h3,
#p-navigation .vector-menu-heading,
#p-navigation .vector-pinnable-header-label {
display: none !important;
}
/* ============================================================
ADDED 2: text sizes — content area and sidebar.
============================================================ */
#content,
.mw-body,
.mw-body-content {
font-size: 18px !important;
}
#firstHeading, .firstHeading { font-size: 38px !important; }
.mw-body-content h2 { font-size: 32px !important; }
.mw-body-content h3 { font-size: 30px !important; }
.mw-body-content h4 { font-size: 28px !important; }
.vector-legacy-sidebar a,
.portlet a,
.pBody a,
#mw-panel a {
font-size: 18px !important;
line-height: 1.2 !important;
padding-left: 0 !important;
margin-left: 0 !important;
}
.portlet h3,
.portlet h5,
.vector-menu-heading,
.mw-portlet .vector-menu-heading,
.vector-pinnable-header-label {
font-size: 18px !important;
font-weight: normal !important;
line-height: 1.2 !important;
margin-left: 0.5em !important;
}
/* ============================================================
ADDED 3: turn off dark mode toggle, Create account, Log in
============================================================ */
#pt-darkmode,
#pt-darkmode-sticky-header,
#pt-createaccount,
#pt-login {
display: none !important;
}
#ca-talk {
display: none !important;
}
/* ============================================================
ADDED 4: gap above the page title / below the black header bar,
and cap the content width so right-floated images keep
overlapping the text boxes even on wide/maximized windows.
============================================================ */
#content {
padding-top: 0.6em !important;
max-width: 1400px !important;
}
#firstHeading, .firstHeading {
margin: 0 !important;
padding: 0 !important;
line-height: 1.3 !important;
overflow: visible !important;
}
#siteSub, #contentSub, #contentSub2, .mw-indicators {
display: none !important;
margin: 0 !important;
padding: 0 !important;
}
#mw-content-text,
#mw-content-text > .mw-parser-output {
margin-top: 0 !important;
padding-top: 0 !important;
}
.mw-parser-output > p:first-of-type,
.mw-parser-output > p:first-child,
#mw-content-text p:first-of-type,
#firstHeading + p,
.firstHeading + p {
margin-top: 0 !important;
padding-top: 0 !important;
}
/* ============================================================
ADDED 5: force black text on the printable version
============================================================ */
@media print {
body, .mw-body, .mw-body-content,
p, li, td, th, dd, dt,
h1, h2, h3, h4, h5, h6, .firstHeading,
a, a:visited {
color: #000 !important;
background: #fff !important;
}
}
/* ============================================================
MONOSKOP-STYLE LAYOUT — running text in 2 columns (browser fills
the left column first, then the right), [[File:…|thumb|right]]
floats right, gallery stays FULL WIDTH (no columns). LAYOUT ONLY —
no colours or boxes changed.
Tune: change "column-count: 2" (e.g. 1 to switch off) or the
"column-gap" spacing between the columns.
============================================================ */
.mw-parser-output {
column-count: 2 !important;
column-gap: 44px !important;
}
/* don't split a paragraph / list item / heading across the column break */
.mw-parser-output > p,
.mw-parser-output > blockquote,
.mw-parser-output > ul:not(.gallery) > li,
.mw-parser-output h2,
.mw-parser-output h3,
.mw-parser-output h4,
.mw-parser-output .mw-heading {
break-inside: avoid !important;
}
/* a title-like first line (e.g. <div class="firstHeading">…) spans both columns */
.mw-parser-output > .firstHeading {
column-span: all !important;
}
/* GALLERY: full width, NO columns (as always) */
.mw-parser-output .gallery,
.mw-parser-output ul.gallery {
column-span: all !important;
}