MediaWiki:Common.css: Unterschied zwischen den Versionen

Aus wiki.rbs-it.de
Zur Navigation springen Zur Suche springen
Keine Bearbeitungszusammenfassung
Keine Bearbeitungszusammenfassung
Zeile 18: Zeile 18:
}
}


/* --- Dark Mode & Corporate Design (Reinhold IT) --- */
/* --- Standard (Hellmodus) --- */
body, html {
    background-color: #FFFFFF;
    color: #000000;
}


/* 1. Gesamter Wiki-Hintergrund & Text auf Dunkelmodus stellen */
/* --- Dunkelmodus (Wird aktiv, wenn der Schalter gedrückt wird) --- */
body, html {
html.dark-mode, html.dark-mode body {
     background-color: #121212 !important;
     background-color: #121212 !important;
     color: #E0E0E0 !important;
     color: #E0E0E0 !important;
}
}


#content, .mw-body {
html.dark-mode #content,  
html.dark-mode .mw-body {
     background-color: #1E1E1E !important;
     background-color: #1E1E1E !important;
     color: #E0E0E0 !important;
     color: #E0E0E0 !important;
Zeile 32: Zeile 37:
}
}


/* 2. Linke Menüleiste & Kopfbereich anpassen */
html.dark-mode div#mw-panel,  
div#mw-panel, div#left-navigation, div#right-navigation {
html.dark-mode div#left-navigation,  
html.dark-mode div#right-navigation {
     background-color: #181818 !important;
     background-color: #181818 !important;
}
}


/* 3. Überschriften in hellem Weiß mit rotem Strich */
/* Überschriften im Dunkelmodus mit rotem Akzent */
h1, h2, h3, h4 {
html.dark-mode h1,  
html.dark-mode h2,  
html.dark-mode h3 {
     color: #FFFFFF !important;
     color: #FFFFFF !important;
     border-bottom: 2px solid #DE2126;
     border-bottom: 2px solid #DE2126;
    padding-bottom: 4px;
}
h1#firstHeading {
    color: #FFFFFF !important;
}
}


/* 4. Die Boxen/Tabellen: Edles Dunkelgrau mit feinem Rand */
/* Boxen im Dunkelmodus: Angenehmes Dunkelgrau statt knallrot */
table.wikitable, .mw-parser-output table {
html.dark-mode table.wikitable,  
html.dark-mode .mw-parser-output table {
     background-color: #2A2A2A !important;
     background-color: #2A2A2A !important;
     border: 1px solid #444444 !important;
     border: 1px solid #444444 !important;
}
}


/* Tabellenköpfe (Titel der Boxen): Kräftiges Rot mit schwarzem Text für Kontrast */
html.dark-mode table.wikitable th,  
table.wikitable th, .mw-parser-output th {
html.dark-mode .mw-parser-output th {
     background-color: #DE2126 !important;
     background-color: #DE2126 !important;
     color: #000000 !important;
     color: #000000 !important;
     border: 1px solid #111111 !important;
     border: 1px solid #111111 !important;
    font-weight: bold;
}
}


/* Zellen in den Boxen (Hintergrund dunkelgrau, Text hell) */
html.dark-mode table.wikitable td,  
table.wikitable td, .mw-parser-output td {
html.dark-mode .mw-parser-output td {
     background-color: #222222 !important;
     background-color: #222222 !important;
     color: #E0E0E0 !important;
     color: #E0E0E0 !important;
Zeile 68: Zeile 72:
}
}


/* 5. Links gut lesbar im Dunkelmodus (Hellblau, beim Drüberfahren Rot) */
/* Links im Dunkelmodus */
a {
html.dark-mode a {
     color: #4EA8DE;
     color: #4EA8DE;
}
}
a:hover {
html.dark-mode a:hover {
     color: #DE2126;
     color: #DE2126;
}
/* Design für den Theme-Schalter-Button oben */
#theme-toggle-btn {
    background: transparent;
    border: 1px solid #ccc;
    padding: 4px 10px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 13px;
    margin-left: 10px;
    color: inherit;
}
#theme-toggle-btn:hover {
    border-color: #DE2126;
}
}

Version vom 11. August 2026, 08:27 Uhr

/* Logo auf Hauptseite und allen Spezialseiten/Einstellungen global korrigieren */
div#p-logo,
.mw-wiki-logo,
#mw-head-base #p-logo {
    background-size: contain !important;
    background-position: left center !important;
    background-repeat: no-repeat !important;
}

div#p-logo a,
#mw-head-base #p-logo a {
    display: block;
    width: 100% !important;
    height: 120px !important;
    background-size: contain !important;
    background-position: left center !important;
    background-repeat: no-repeat !important;
}

/* --- Standard (Hellmodus) --- */
body, html {
    background-color: #FFFFFF;
    color: #000000;
}

/* --- Dunkelmodus (Wird aktiv, wenn der Schalter gedrückt wird) --- */
html.dark-mode, html.dark-mode body {
    background-color: #121212 !important;
    color: #E0E0E0 !important;
}

html.dark-mode #content, 
html.dark-mode .mw-body {
    background-color: #1E1E1E !important;
    color: #E0E0E0 !important;
    border-color: #333333 !important;
}

html.dark-mode div#mw-panel, 
html.dark-mode div#left-navigation, 
html.dark-mode div#right-navigation {
    background-color: #181818 !important;
}

/* Überschriften im Dunkelmodus mit rotem Akzent */
html.dark-mode h1, 
html.dark-mode h2, 
html.dark-mode h3 {
    color: #FFFFFF !important;
    border-bottom: 2px solid #DE2126;
}

/* Boxen im Dunkelmodus: Angenehmes Dunkelgrau statt knallrot */
html.dark-mode table.wikitable, 
html.dark-mode .mw-parser-output table {
    background-color: #2A2A2A !important;
    border: 1px solid #444444 !important;
}

html.dark-mode table.wikitable th, 
html.dark-mode .mw-parser-output th {
    background-color: #DE2126 !important;
    color: #000000 !important;
    border: 1px solid #111111 !important;
}

html.dark-mode table.wikitable td, 
html.dark-mode .mw-parser-output td {
    background-color: #222222 !important;
    color: #E0E0E0 !important;
    border: 1px solid #333333 !important;
}

/* Links im Dunkelmodus */
html.dark-mode a {
    color: #4EA8DE;
}
html.dark-mode a:hover {
    color: #DE2126;
}

/* Design für den Theme-Schalter-Button oben */
#theme-toggle-btn {
    background: transparent;
    border: 1px solid #ccc;
    padding: 4px 10px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 13px;
    margin-left: 10px;
    color: inherit;
}
#theme-toggle-btn:hover {
    border-color: #DE2126;
}