MediaWiki:Common.css: Difference between revisions

From Twisted
No edit summary
No edit summary
Line 1: Line 1:
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap');
body,
body,
.skin-chameleon,
.skin-chameleon,
Line 5: Line 7:
.skin-chameleon .col {
.skin-chameleon .col {
     background: #181d22 !important;
     background: #181d22 !important;
     color: #f0f2f5 !important;
     color: #e7eaf0 !important;
     font-family: 'Inter', 'Roboto', 'Segoe UI', Arial, sans-serif !important;
     font-family: 'Inter', 'Roboto', 'Segoe UI', Arial, sans-serif !important;
}
}


a, a:visited, .navbar a, .footer a {
a, a:visited, .navbar a, .footer a {
     color: #49c8fa !important;
     color: #42baff !important;
     text-decoration: none !important;
     text-decoration: none !important;
    transition: color 0.2s;
}
}


a:hover, .navbar a:hover, .footer a:hover {
a:hover, .navbar a:hover, .footer a:hover {
     color: #00aaff !important;
     color: #1ebaff !important;
     text-decoration: underline !important;
     text-decoration: underline !important;
}
}
Line 22: Line 25:
     color: #fff !important;
     color: #fff !important;
     font-family: 'Inter', 'Roboto', 'Segoe UI', Arial, sans-serif !important;
     font-family: 'Inter', 'Roboto', 'Segoe UI', Arial, sans-serif !important;
    font-weight: 700 !important;
    letter-spacing: 0.01em;
}
}


pre, code, .mw-code, .mw-highlight pre {
pre, code, .mw-code, .mw-highlight pre {
     background: #21272e !important;
     background: #21272e !important;
     color: #6ee7ff !important;
     color: #67d3fa !important;
     font-family: 'JetBrains Mono', 'Consolas', 'monospace' !important;
     font-family: 'JetBrains Mono', 'Fira Mono', 'Consolas', 'monospace' !important;
     border-radius: 4px;
     border-radius: 6px;
    padding: 0.5em;
}
}


table, th, td {
table, th, td {
     background: #22262c !important;
     background: #23272c !important;
     color: #f0f2f5 !important;
     color: #e7eaf0 !important;
     border-color: #32363c !important;
     border-color: #32363c !important;
}
}


input[type="search"], input[type="text"], .form-control, textarea {
input[type="search"], input[type="text"], .form-control, textarea {
     background: #232a32 !important;
     background: #22262c !important;
     color: #f0f2f5 !important;
     color: #e7eaf0 !important;
     border: 1px solid #49c8fa !important;
     border: 1px solid #42baff !important;
}
}


.navbar, .footer, .chameleon-navbar, .chameleon-footer, .chameleon-header {
.navbar, .footer, .chameleon-navbar, .chameleon-footer, .chameleon-header {
     background: #181d22 !important;
     background: #14181d !important;
     color: #f0f2f5 !important;
     color: #e7eaf0 !important;
     border: none !important;
     border: none !important;
}
#mw-head, #mw-panel, .navbar-header {
    background: #171b21 !important;
}
.mw-body, .mw-body-content {
    background: transparent !important;
}
::-webkit-scrollbar {
    background: #22262c;
    width: 12px;
}
::-webkit-scrollbar-thumb {
    background: #42baff;
    border-radius: 8px;
}
/* --- SEARCH BAR GLOW-UP --- */
input[type="search"], .chameleon-search input, .form-control {
    background: #20262c !important;
    color: #e7eaf0 !important;
    border: 1.5px solid #42baff !important;
    border-radius: 7px !important;
    padding: 6px 14px !important;
    font-size: 1.05rem !important;
    font-family: 'Inter', 'Roboto', 'Segoe UI', Arial, sans-serif !important;
    box-shadow: none !important;
    transition: border-color 0.18s, box-shadow 0.18s;
}
input[type="search"]:focus, .chameleon-search input:focus, .form-control:focus {
    outline: none !important;
    border-color: #1ebaff !important;
    box-shadow: 0 0 0 2px rgba(66,186,255,0.17) !important;
    background: #232b34 !important;
    color: #fff !important;
}
/* Optional: Modernize the search icon if possible */
input[type="search"]::placeholder, .form-control::placeholder {
    color: #8ea8be !important;
    opacity: 1 !important;
}
}

Revision as of 23:32, 13 August 2025

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap');

body,
.skin-chameleon,
.skin-chameleon .container,
.skin-chameleon .row,
.skin-chameleon .col {
    background: #181d22 !important;
    color: #e7eaf0 !important;
    font-family: 'Inter', 'Roboto', 'Segoe UI', Arial, sans-serif !important;
}

a, a:visited, .navbar a, .footer a {
    color: #42baff !important;
    text-decoration: none !important;
    transition: color 0.2s;
}

a:hover, .navbar a:hover, .footer a:hover {
    color: #1ebaff !important;
    text-decoration: underline !important;
}

h1, h2, h3, h4, h5, h6 {
    color: #fff !important;
    font-family: 'Inter', 'Roboto', 'Segoe UI', Arial, sans-serif !important;
    font-weight: 700 !important;
    letter-spacing: 0.01em;
}

pre, code, .mw-code, .mw-highlight pre {
    background: #21272e !important;
    color: #67d3fa !important;
    font-family: 'JetBrains Mono', 'Fira Mono', 'Consolas', 'monospace' !important;
    border-radius: 6px;
    padding: 0.5em;
}

table, th, td {
    background: #23272c !important;
    color: #e7eaf0 !important;
    border-color: #32363c !important;
}

input[type="search"], input[type="text"], .form-control, textarea {
    background: #22262c !important;
    color: #e7eaf0 !important;
    border: 1px solid #42baff !important;
}

.navbar, .footer, .chameleon-navbar, .chameleon-footer, .chameleon-header {
    background: #14181d !important;
    color: #e7eaf0 !important;
    border: none !important;
}

#mw-head, #mw-panel, .navbar-header {
    background: #171b21 !important;
}

.mw-body, .mw-body-content {
    background: transparent !important;
}

::-webkit-scrollbar {
    background: #22262c;
    width: 12px;
}
::-webkit-scrollbar-thumb {
    background: #42baff;
    border-radius: 8px;
}
/* --- SEARCH BAR GLOW-UP --- */
input[type="search"], .chameleon-search input, .form-control {
    background: #20262c !important;
    color: #e7eaf0 !important;
    border: 1.5px solid #42baff !important;
    border-radius: 7px !important;
    padding: 6px 14px !important;
    font-size: 1.05rem !important;
    font-family: 'Inter', 'Roboto', 'Segoe UI', Arial, sans-serif !important;
    box-shadow: none !important;
    transition: border-color 0.18s, box-shadow 0.18s;
}

input[type="search"]:focus, .chameleon-search input:focus, .form-control:focus {
    outline: none !important;
    border-color: #1ebaff !important;
    box-shadow: 0 0 0 2px rgba(66,186,255,0.17) !important;
    background: #232b34 !important;
    color: #fff !important;
}

/* Optional: Modernize the search icon if possible */
input[type="search"]::placeholder, .form-control::placeholder {
    color: #8ea8be !important;
    opacity: 1 !important;
}