MediaWiki:Common.css

Aus Ardapedia

Hinweis: Leere nach dem Veröffentlichen den Browser-Cache, um die Änderungen sehen zu können.

  • Firefox/Safari: Umschalttaste drücken und gleichzeitig Aktualisieren anklicken oder entweder Strg+F5 oder Strg+R (⌘+R auf dem Mac) drücken
  • Google Chrome: Umschalttaste+Strg+R (⌘+Umschalttaste+R auf dem Mac) drücken
  • Edge: Strg+F5 drücken oder Strg drücken und gleichzeitig Aktualisieren anklicken
/* ===== Ardapedía: Common.css (bestehend + Icon-Fixes inkl. mobil) ===== */

/* Bestehende Regeln */
#mw-content-container {
    background-color: #858B62;
}

body {
    background-color: #FDFBEA;
}

.mw-footer-container {
    color: #000000;
    padding-top: 0.5em;
}

#mw-content, #mw-site-navigation .sidebar-chunk, #mw-related-navigation .sidebar-chunk {
    background-color: #FDFBEA;
}

a, .mw-footer-container a {
    color: #8E4A25;
}

.mw-footer ul, .mw-footer li {
    margin: 0;
}

a:visited, .mw-footer-container a:visited, .mw-footer-container a:hover, a:hover {
    color: #6F4630;
}

.mw-body h1.firstHeading {
    border-bottom: solid 4px #515C17;
}

.h3 {
    font-family: 'Linux Libertine', 'Times New Roman', 'Liberation Serif', 'Nimbus Roman', 'Noto Serif', 'Times', serif;
}

#mw-content-container {
    border-bottom: solid 4px #333a0f;
}

h1, h2, h3, h4, h5, h6 {
    color: #8E4A25;
    border-bottom: 1px solid #c0c0c0;
}

.color-middle, .color-left, .color-right {
    background: #333a0f;
}

.ardapedia_column, .yui-u {
    float: left;
    width: 49%;
}

.yui-g .first {
    margin-right: 2%;
}

.ardapedia_row:after, yui-g:after {
    content: "";
    display: table;
    clear: both;
}

@media screen and (max-width: 851px) {
    .ardapedia_column, .yui-u {
        float: none;
        width: 100%;
    }

    .overlay h2 {
        font-size: 20px;
        margin: 5px !important;
    }
}

.mw-search-results {
    margin: 0;
    max-width: 76em;
}

div.float-right, table.float-right, ul.float-right, .float-right {
    clear: right;
    float: right;
    margin: 1em 0 1em 1em;
}

.toc, .toccolours {
    border: 1px solid #8e4924;
    background-color: #f8f9fa;
    padding: 5px;
    font-size: 95%;
}

#f-list {
    color: #7F855D;
    line-height: 1.4em;
    font-size: 85%;
}

/* ===== Icon-FIXES: ersetzt defekte background-image:url(?hash) ===== */

/* Externe Links: kleines Pfeil-Icon */
a.external,
a[rel~="external"] {
    position: relative;
    padding-right: 14px;
}
a.external::after,
a[rel~="external"]::after {
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    width: 12px;
    height: 12px;
    transform: translateY(-50%);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 12px 12px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12"><path fill="%23555" d="M8.5 0h3v3h-1V1.707L6.854 5.354l-.708-.708L9.793 1H8.5V0z"/><path fill="%23555" d="M10 6v5H1V2h5v1H2v7h7V6h1z"/></svg>') !important;
}

/* Persönliches Menü: Chevron-Down ersetzen */
#personal h2::after {
    display: inline-block;
    content: "";
    width: 22px;
    height: 12px;
    vertical-align: middle;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 22px 12px !important;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="22" height="12" viewBox="0 0 22 12"><path fill="%23555" d="M2 2l9 8 9-8-1.5-1.5L11 7.8 3.5.5z"/></svg>') !important;
}

/* Generische Inline-Icons (optional für Menü/Buttons) */
.mw-icon-inline {
    display: inline-block;
    width: 16px;
    height: 16px;
    vertical-align: text-bottom;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 16px 16px;
}
.mw-icon-inline--hamburger {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"><rect width="14" height="2" x="1" y="3" fill="%23555"/><rect width="14" height="2" x="1" y="7" fill="%23555"/><rect width="14" height="2" x="1" y="11" fill="%23555"/></svg>');
}
.mw-icon-inline--search {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"><circle cx="7" cy="7" r="5" stroke="%23555" stroke-width="2" fill="none"/><path d="M11 11l4 4" stroke="%23555" stroke-width="2"/></svg>');
}

/* Vector/Dropdowns: Tabs/Chevrons reparieren */
.vector-menu-dropdown > h3::after,
.vector-menu-tabs .vector-menu-content li a::after {
    content: "";
    width: 10px;
    height: 10px;
    margin-left: .25em;
    display: inline-block;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 10px 10px !important;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 10 10"><path fill="%23555" d="M1 3l4 4 4-4z"/></svg>') !important;
}

/* Mobile/Minerva: Icons für Menü, Suche, Pfeile etc. */
.skin-minerva .minerva-icon,
.skin-minerva .minerva-icon--secondary {
    width: 16px;
    height: 16px;
    display: inline-block;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 16px 16px !important;
}
.skin-minerva .minerva-icon--menu,
.skin-minerva .drawer-toggle .icon {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"><rect width="14" height="2" x="1" y="3" fill="%23555"/><rect width="14" height="2" x="1" y="7" fill="%23555"/><rect width="14" height="2" x="1" y="11" fill="%23555"/></svg>') !important;
}
.skin-minerva .minerva-icon--search,
.skin-minerva .header .search-toggle .icon {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"><circle cx="7" cy="7" r="5" stroke="%23555" stroke-width="2" fill="none"/><path d="M11 11l4 4" stroke="%23555" stroke-width="2"/></svg>') !important;
}
.skin-minerva .minerva-icon--arrow,
.skin-minerva .menu__item--collapsible > .indicator {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12"><path fill="%23555" d="M2 4l4 4 4-4z"/></svg>') !important;
}

/* Harte Überschreibung gegen kaputte Deklarationen mit url(?hash) */
#personal h2:after,
a.external:after,
a[rel~="external"]:after,
.vector-menu-dropdown > h3:after,
.vector-menu-tabs .vector-menu-content li a:after,
.skin-minerva .minerva-icon,
.skin-minerva .minerva-icon--secondary {
    background-image: initial; /* Basis reset */
}

/* Kleinere Screens: zusätzliche mobile Feinschliffe */
@media screen and (max-width: 851px) {
    /* Abstand falls Icons rechts sitzen */
    a.external,
    a[rel~="external"] { padding-right: 14px; }
}

/* Optional: Dunklere Variante bei Hover/Fokus für bessere Sichtbarkeit */
a.external:hover::after,
a[rel~="external"]:hover::after,
.vector-menu-tabs .vector-menu-content li a:hover::after {
    filter: brightness(0.6);
}
Abgerufen von „https://www.ardapedia.org/w/index.php?title=MediaWiki:Common.css&oldid=114241“