MediaWiki:Common.css: Revizyonlar arasındaki fark

01.02, 9 Haziran 2026 tarihindeki hâli

/* ============================================================
   UO Blood Wiki — dark/brown theme  →  paste into MediaWiki:Common.css
   (v1 starting point; we'll fine-tune after you send a screenshot)
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@600;700&family=Lato:wght@300;400;700&display=swap');

/* ---- Page / chrome backgrounds ---- */
html, body,
.mw-page-container,
.vector-header-container,
.mw-header,
.vector-sticky-header { background-color: #1a120b !important; }

body, .mw-body, .mw-body-content, .mw-parser-output {
    color: #e9ddc2 !important;
    font-family: 'Lato', sans-serif;
}

/* ---- Content area ---- */
.mw-body, #content, .vector-body, .mw-content-container {
    background-color: #241812 !important;
    border-color: #5a3a1e !important;
}

/* ---- Links ---- */
a, .mw-parser-output a { color: #d9a066 !important; }
a:hover { color: #f0c088 !important; }
a:visited { color: #c4925a !important; }
a.new { color: #cc6a5a !important; }            /* missing-page (red) links */

/* ---- Headings: Cinzel, gold ---- */
h1, h2, h3, h4, h5, h6,
.mw-body h1, .mw-body h2, .mw-body h3, .mw-body h4 {
    font-family: 'Cinzel', serif !important;
    color: #e0b070 !important;
    border-bottom-color: #5a3a1e !important;
}

/* ---- Sidebar / menus / tabs ---- */
.vector-main-menu, .vector-menu, .mw-portlet,
.vector-page-titlebar, .vector-page-toolbar { color: #e9ddc2 !important; }
.vector-main-menu a, .mw-portlet a, .vector-menu a { color: #d9a066 !important; }
.vector-menu-heading { color: #b89060 !important; }

/* ---- Inputs / search ---- */
input, textarea, .cdx-text-input__input, .cdx-search-input__input {
    background-color: #1a120b !important;
    color: #e9ddc2 !important;
    border-color: #5a3a1e !important;
}

/* ---- Tables ---- */
.wikitable {
    background-color: #2c1d12 !important;
    color: #e9ddc2 !important;
    border-color: #5a3a1e !important;
}
.wikitable > * > tr > th { background-color: #3a2616 !important; color: #e0b070 !important; border-color: #5a3a1e !important; }
.wikitable > * > tr > td { border-color: #5a3a1e !important; }

/* ============================================================
   Main Page portal cards + pills (used by the Main Page markup)
   ============================================================ */
.uob-hero {
    background: linear-gradient(180deg, #2c1d12, #1a120b);
    border: 1px solid #6a4523;
    border-radius: 10px;
    padding: 26px 22px;
    margin: 0 0 24px;
    text-align: center;
    color: #e9ddc2;
}
.uob-hero h1 { border: 0 !important; margin: 0 0 8px; font-size: 2rem; }

.uob-portals {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 16px;
    margin: 20px 0;
}
.uob-card {
    background: linear-gradient(180deg, #3a2616, #241812);
    border: 1px solid #6a4523;
    border-radius: 8px;
    overflow: hidden;
    transition: transform .12s ease, border-color .12s ease, box-shadow .12s ease;
}
.uob-card:hover {
    transform: translateY(-3px);
    border-color: #c98a4b;
    box-shadow: 0 6px 18px rgba(0,0,0,.45);
}
.uob-card a {
    display: block;
    padding: 24px 16px;
    text-align: center;
    color: #e9ddc2 !important;
    text-decoration: none !important;
}
.uob-card a b {
    display: block;
    font-family: 'Cinzel', serif;
    font-size: 1.15rem;
    color: #e0b070;
    margin-bottom: 4px;
}
.uob-card a small { color: #c4a87e; font-size: .85rem; }
.uob-card:hover a b { color: #f0c088; }

.uob-popular {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    gap: 10px;
    margin: 14px 0;
}
.uob-pill {
    background: #2c1d12;
    border: 1px solid #5a3a1e;
    border-radius: 6px;
    overflow: hidden;
    transition: background .12s ease, border-color .12s ease;
}
.uob-pill:hover { background: #3a2616; border-color: #c98a4b; }
.uob-pill a {
    display: block;
    padding: 11px 12px;
    text-align: center;
    font-weight: 700;
    color: #d9a066 !important;
    text-decoration: none !important;
}
.uob-pill:hover a { color: #f0c088 !important; }

/* ============================================================
   Header / logo / footer  —  skin: LEGACY VECTOR ("vector")
   Targets #mw-head, #mw-page-base, #p-logo, .vectorTabs, #footer.
   ============================================================ */

/* The light gradient strips across the very top */
#mw-page-base { background: #1a120b !important; }
#mw-head-base { background-color: #5a3a1e !important; }     /* thin divider line */

/* Top bar that holds the tabs + search + personal tools */
#mw-head { background-color: #1a120b !important; }
#left-navigation, #right-navigation { background: transparent !important; }

/* Personal tools (Oturum aç / login / username, top-right) */
#p-personal ul li a { color: #d9a066 !important; }

/* Page + namespace tabs (Oku / Kaynağı gör / Geçmişi gör · Anasayfa / Tartışma) */
.vectorTabs ul, .vectorTabs li, .vectorTabs span { background-image: none !important; }
.vectorTabs li a,
.vectorMenu h3 {
    background-image: none !important;
    background-color: #2c1d12 !important;
    color: #d9a066 !important;
    border: 1px solid #5a3a1e !important;
    border-bottom: 0 !important;
}
.vectorTabs li.selected a { background-color: #241812 !important; color: #e0b070 !important; }
.vectorTabs li a:hover { color: #f0c088 !important; }

/* Search box */
#p-search #searchInput, #searchInput, #p-search input[type="search"] {
    background-color: #241812 !important;
    color: #e9ddc2 !important;
    border: 1px solid #5a3a1e !important;
}

/* Logo (top-left) — shrink + contain so it fits and stops overflowing */
#p-logo a.mw-wiki-logo,
#p-logo a {
    width: 150px !important;
    height: 110px !important;
    background-size: contain !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
}

/* Sidebar (legacy #mw-panel) */
#mw-panel .portal h3 { color: #b89060 !important; }
#mw-panel .portal .body a, #mw-panel a { color: #d9a066 !important; }

/* Footer */
#footer, .mw-footer { background-color: #1a120b !important; color: #b89060 !important; }
#footer a { color: #d9a066 !important; }
#footer li, #footer #footer-info li { color: #b89060 !important; }