Jump to content

MediaWiki:Vector-2022.css

From ATRONIA Wiki
Revision as of 17:22, 19 February 2026 by WikiManagement (talk | contribs)

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
/* ========================================================= */
/* ================= LOGO CONFIG ============================ */
/* ========================================================= */

.skin-vector-2022 .mw-header-start {
    flex-wrap: nowrap !important;
}

.skin-vector-2022 .mw-logo-icon {
    max-height: 48px !important;
    height: 38px !important;
    max-width: 200px !important;
    width: auto !important;
}

.skin-vector-2022 .mw-logo-wordmark img {
    height: 32px !important;
    width: auto !important;
}


/* ========================================================= */
/* ================= FONT CONFIG ============================ */
/* ========================================================= */

@font-face {
    font-family: 'Wiki Font Title';
    src: url('/resources/assets/Nohemi-VF.ttf') format('truetype');
}

@font-face {
    font-family: 'Wiki Font Subtitle';
    src: url('/resources/assets/Rubik-Medium.ttf') format('truetype');
}

@font-face {
    font-family: 'Wiki Font Body';
    src: url('/resources/assets/Roboto-Regular.ttf') format('truetype');
}

.mw-body-content {
    font-family: 'Wiki Font Body', sans-serif;
}

.mw-page-title-main {
    font-family: 'Wiki Font Title', sans-serif;
}

.mw-headline {
    font-family: 'Wiki Font Subtitle', sans-serif;
}


/* ========================================================= */
/* ================= HEADER ATRONIA ========================= */
/* ========================================================= */

/* Background */
.skin-vector-2022 .mw-header,
.skin-vector-2022 .vector-sticky-header {
    background-color: #1B2826 !important;
    border-bottom: none !important;
    color: #ffffff !important;
}

/* Links + title */
.skin-vector-2022 .mw-header a,
.skin-vector-2022 .vector-sticky-header a,
.skin-vector-2022 .vector-sticky-header .mw-page-title-main {
    color: #ffffff !important;
}

/* Force ALL header icons to white */
.skin-vector-2022 .mw-header .vector-icon,
.skin-vector-2022 .vector-sticky-header .vector-icon,
.skin-vector-2022 .mw-header .mw-ui-icon,
.skin-vector-2022 .vector-sticky-header .mw-ui-icon {
    background-color: #ffffff !important;
}


/* ========================================================= */
/* ================= DROPDOWN RESET ========================= */
/* ========================================================= */

.skin-vector-2022 .vector-dropdown-content {
    background-color: #ffffff !important;
}

.skin-vector-2022 .vector-dropdown-content a {
    color: #202122 !important;
}


/* ===== CORRIGIR ÍCONES DO DROPDOWN ===== */

.skin-vector-2022 .vector-dropdown-content .vector-icon,
.skin-vector-2022 .vector-dropdown-content .mw-ui-icon {
    background-color: #202122 !important;
    color: #202122 !important;
}


/* ===== FORÇAR COR DA SETA (DROPDOWN ARROW) ===== */

.skin-vector-2022 .mw-header .vector-dropdown-label::after,
.skin-vector-2022 .vector-sticky-header .vector-dropdown-label::after {
    background-color: #ffffff !important;
}




/* ========================================================= */
/* FIX DEFINITIVO DO HOVER DOS ICON BUTTONS (CODEx) */
/* ========================================================= */

.skin-vector-2022 .mw-header .cdx-button:hover,
.skin-vector-2022 .vector-sticky-header .cdx-button:hover {
    mix-blend-mode: normal !important;
    background-color: rgba(146,255,0,0.30) !important; /* ← reduzido */
}

.skin-vector-2022 .mw-header .cdx-button:hover .vector-icon,
.skin-vector-2022 .vector-sticky-header .cdx-button:hover .vector-icon,
.skin-vector-2022 .mw-header .cdx-button:hover .mw-ui-icon,
.skin-vector-2022 .vector-sticky-header .mw-ui-icon {
    background-color: #ffffff !important;
}




/* ========================================================= */
/* HOVER USER DROPDOWN - ATRONIA GREEN */
/* ========================================================= */

.skin-vector-2022 #vector-user-links-dropdown-label:hover,
.skin-vector-2022 #vector-user-links-dropdown-label:focus,
.skin-vector-2022 #vector-user-links-dropdown-label:focus-visible {
    background-color: rgba(146, 255, 0, 0.30) !important;
}

.skin-vector-2022 #vector-user-links-dropdown-label:hover::before,
.skin-vector-2022 #vector-user-links-dropdown-label:focus::before,
.skin-vector-2022 #vector-user-links-dropdown-label:focus-visible::before {
    background-color: rgba(146, 255, 0, 0.30) !important;
    opacity: 1 !important;
}

.skin-vector-2022 #vector-user-links-dropdown.vector-dropdown:hover .vector-dropdown-label,
.skin-vector-2022 #vector-user-links-dropdown.vector-dropdown:hover .vector-dropdown-label::before {
    background-color: rgba(146, 255, 0, 0.30) !important;
}






/* ========================================================= */
/* ================= ATRONIA LINK SYSTEM =================== */
/* ========================================================= */

/* ===== Variáveis globais ===== */

:root {
    --color-progressive: #1B2826 !important;
    --color-progressive--hover: #12201f !important; /* ligeiramente mais escuro */
    --color-visited: #1B2826 !important;
}

/* ========================================================= */
/* ================= LINKS GERAIS =========================== */
/* ========================================================= */

a,
.mw-body-content a,
.mw-parser-output a {
    color: #1B2826 !important;
    text-decoration-color: #1B2826 !important;
}

/* Hover */
a:hover,
.mw-body-content a:hover,
.mw-parser-output a:hover {
    color: #12201f !important;
    text-decoration-color: #12201f !important;
}

/* Visitados */
a:visited,
.mw-body-content a:visited {
    color: #1B2826 !important;
    text-decoration-color: #1B2826 !important;
}

/* Underline styling */
a {
    text-decoration-thickness: 1.5px;
    text-underline-offset: 3px;
}

/* ========================================================= */
/* ================= TABS (Read / Edit / History) ========= */
/* ========================================================= */

.vector-menu-tabs .vector-menu-item a {
    color: #1B2826 !important;
}

.vector-menu-tabs .vector-menu-item.selected a {
    border-bottom-color: #1B2826 !important;
}

/* ========================================================= */
/* ================= SIDEBAR ================================ */
/* ========================================================= */

.vector-menu-portal .vector-menu-content a {
    color: #1B2826 !important;
}

.vector-menu-portal .vector-menu-content a:hover {
    color: #12201f !important;
}

/* ========================================================= */
/* ================= DROPDOWNS ============================== */
/* ========================================================= */

.vector-dropdown-content a {
    color: #1B2826 !important;
}

.vector-dropdown-content a:hover {
    color: #12201f !important;
}

/* ========================================================= */
/* ================= PARSER OUTPUT ========================== */
/* ========================================================= */

.mw-parser-output a {
    color: #1B2826 !important;
}

.mw-parser-output a:hover {
    color: #12201f !important;
}





/* ========================================================= */
/* ================= OOUI ATRONIA GREEN ==================== */
/* ========================================================= */

/* Botões principais (Save changes) */
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
    background-color: #1B2826 !important;
    border-color: #1B2826 !important;
    color: #ffffff !important;
}

/* Hover botão */
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover {
    background-color: #12201f !important;
    border-color: #12201f !important;
}

/* Checkbox e radio selecionados */
.oo-ui-checkboxInputWidget input:checked + span,
.oo-ui-radioInputWidget input:checked + span {
    background-color: #1B2826 !important;
    border-color: #1B2826 !important;
}

/* Hover checkbox/radio */
.oo-ui-checkboxInputWidget input:hover + span,
.oo-ui-radioInputWidget input:hover + span {
    border-color: #1B2826 !important;
}

/* Labels ao lado */
.oo-ui-labelElement-label {
    color: #1B2826 !important;
}

/* Links dentro de forms */
.oo-ui-widget a {
    color: #1B2826 !important;
}


/* ========================================================= */
/* OOUI BOTÕES — HOVER ESTILO HEADER ICONS */
/* ========================================================= */

/* Estado normal */
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
    background-color: #1B2826 !important;
    border-color: #1B2826 !important;
    color: #ffffff !important;
    transition: background-color 150ms ease, box-shadow 150ms ease;
}

/* Hover subtil (overlay verde translúcido) */
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover {
    background-color: #1B2826 !important;
    box-shadow: 0 0 0 3px rgba(146,255,0,0.35) inset;
}