MediaWiki:Common.css: mudanças entre as edições

De Wiki PokeLegends
Ir para navegação Ir para pesquisar
← Edição anteriorEdição posterior →
Sem resumo de edição
Etiqueta: Revertido
Sem resumo de edição
Etiqueta: Revertido
Linha 1: Linha 1:
/* =========================================================
/* =========================
  🌙 DARK THEME GLOBAL (WIKI)
  PALETA GLOBAL
========================================================= */
========================= */
body,
:root {
#content,
    --bg-main: #2b2b2b;
.mw-body,
    --bg-soft: #3a3a3a;
#mw-head,
    --border: #555;
#footer {
    --text: #ffffff;
    background-color: #202225 !important;
    --link: #8ab4f8;
    color: #ffffff !important;
}
 
/* =========================
  RESET GERAL
========================= */
* {
     border: none !important;
     border: none !important;
     box-shadow: none !important;
     box-shadow: none !important;
}
}


/* =========================================================
/* =========================
   ✨ TRANSIÇÕES SUAVES
   FUNDO GERAL
========================================================= */
========================= */
a,
html, body {
button,
    background-color: var(--bg-main) !important;
input,
     color: var(--text) !important;
select,
textarea,
#mw-panel a,
.vector-menu-tabs a,
#p-personal a {
     transition: all 0.2s ease-in-out !important;
}
}


/* =========================================================
/* =========================
   🔗 LINKS
   CONTEÚDO PRINCIPAL
========================================================= */
========================= */
a, a:visited, a:link {
#content, .mw-body, .mw-body-content {
     color: #ffffff !important;
     background-color: var(--bg-soft) !important;
     text-decoration: none;
     color: var(--text) !important;
}
}


a:hover {
/* =========================
    color: #dddddd !important;
   SIDEBAR
    opacity: 0.85;
========================= */
}
#mw-panel {
 
     background-color: var(--bg-main) !important;
/* =========================================================
   📂 SIDEBAR
========================================================= */
#mw-panel,
#mw-panel .portal,
#mw-panel .body,
#mw-panel .vector-menu-content {
     background-color: #2c2f33 !important;
    border: none !important;
}
}


/* LINKS SIDEBAR */
#mw-panel a {
#mw-panel a {
    display: block;
     background-color: var(--bg-main) !important;
     background-color: #2c2f33 !important;
     color: var(--text) !important;
     color: #ffffff !important;
     transition: all 0.25s ease;
     padding: 6px 10px;
    border-radius: 4px;
    border: none !important;
}
}


/* HOVER SUAVE */
#mw-panel a:hover {
#mw-panel a:hover {
     background-color: #23272a !important;
     background-color: var(--bg-soft) !important;
    transform: translateX(4px);
}
}


/* =========================================================
/* Remove qualquer diferença visual */
  🔝 TOPO (BOTÕES)
#mw-panel *, #mw-panel div, #mw-panel li {
========================================================= */
     background-color: var(--bg-main) !important;
.vector-menu-tabs,
.vector-menu-tabs ul,
.vector-menu-tabs li,
.vector-menu-tabs a,
.vector-menu-tabs li a,
.vector-menu-tabs li.selected a,
#p-personal,
#p-personal a,
.mw-portlet,
.vector-menu {
     background-color: #202225 !important;
    color: #ffffff !important;
    border: none !important;
}
}


.vector-menu-tabs a:hover,
/* =========================
#p-personal a:hover {
  TOPO
     background-color: #2c2f33 !important;
========================= */
    transform: translateY(-1px);
#mw-head, #mw-page-base {
     background-color: var(--bg-main) !important;
}
}


.vector-menu-tabs li.selected a {
/* BOTÕES SUPERIORES */
     background-color: #2c2f33 !important;
#mw-head a {
     background-color: var(--bg-main) !important;
    color: var(--text) !important;
    transition: all 0.25s ease;
}
}


/* =========================================================
#mw-head a:hover {
  🔘 BOTÕES / INPUTS
     background-color: var(--bg-soft) !important;
========================================================= */
button,
input,
select,
textarea {
     background-color: #2c2f33 !important;
    color: #ffffff !important;
    border: none !important;
}
}


button:hover,
/* =========================
input:hover,
  LINKS
select:hover {
========================= */
     background-color: #23272a !important;
a {
    transform: scale(1.03);
     color: var(--link) !important;
}
}


/* =========================================================
a:hover {
  📊 TABELAS
========================================================= */
table,
.wikitable {
    background-color: #2c2f33 !important;
     color: #ffffff !important;
     color: #ffffff !important;
    border: 1px solid #444 !important;
}
}


th {
/* =========================
     background-color: #23272a !important;
  TABELAS
========================= */
table, th, td {
     background-color: var(--bg-soft) !important;
    color: var(--text) !important;
    border: 1px solid var(--border) !important;
}
 
/* =========================
  ÍNDICE (TOC)
========================= */
#toc, .toc {
    background-color: var(--bg-soft) !important;
    border: 1px solid var(--border) !important;
}
}


td {
#toc * {
     background-color: #2c2f33 !important;
     color: var(--text) !important;
}
}


/* =========================================================
/* =========================
   📦 INFOBOX / NAVBOX
   SUBTÍTULOS
========================================================= */
========================= */
.infobox,
h1, h2, h3, h4, h5, h6 {
.navbox {
     color: var(--text) !important;
     background-color: #2c2f33 !important;
    color: #ffffff !important;
}
}


/* =========================================================
/* =========================
   📑 ÍNDICE (TOC COMPLETO)
   INPUTS (modo escuro normal)
========================================================= */
========================= */
#toc,
input, textarea {
.toc,
     background-color: var(--bg-main) !important;
.toc ul,
     color: var(--text) !important;
.toc li,
    border: 1px solid var(--border) !important;
.tocnumber,
.toctext {
     background-color: #2c2f33 !important;
     color: #ffffff !important;
}
}


#toc {
/* =========================
     border: 1px solid #444 !important;
  REMOVER FUNDOS BRANCOS
========================= */
div, span {
     background-color: transparent !important;
}
}


#toc a {
/* =========================
     color: #ffffff !important;
  SCROLLBAR
========================= */
::-webkit-scrollbar {
     width: 10px;
}
}


#toc a:hover {
::-webkit-scrollbar-track {
     background-color: #23272a !important;
     background: var(--bg-main);
}
}


/* =========================================================
::-webkit-scrollbar-thumb {
  📝 TEXTO E TÍTULOS
    background: var(--border);
========================================================= */
     border-radius: 5px;
h1, h2, h3, h4, h5, h6,
.mw-headline,
p, span, li {
     color: #ffffff !important;
}
}


/* =========================================================
::-webkit-scrollbar-thumb:hover {
  🚫 REMOVE BRANCOS INLINE
     background: #777;
========================================================= */
[style*="background:#fff"],
[style*="background: white"],
[style*="background-color:#fff"],
[style*="background-color: white"] {
     background-color: #2c2f33 !important;
    color: #ffffff !important;
}
}


/* =========================================================
/* =========================
   🧠 IMPORTANTE: NÃO QUEBRAR EDIÇÃO
   EXCEÇÃO: EDITOR (CLARO)
========================================================= */
========================= */


/* NÃO aplica dark na edição */
/* Visual Editor */
body.action-edit,
.ve-ui-surface,
body.action-submit {
.ve-ui-surface * {
     background-color: #ffffff !important;
     background-color: #ffffff !important;
     color: #000000 !important;
     color: #000000 !important;
}
}


/* textarea edição */
/* Editor clássico */
body.action-edit textarea,
#wpTextbox1 {
body.action-submit textarea {
     background-color: #ffffff !important;
     background-color: #ffffff !important;
     color: #000000 !important;
     color: #000000 !important;
    border: 1px solid #ccc !important;
}
}


/* editor visual */
/* =========================
body.action-edit .ve-ui-surface,
  EXCEÇÃO: JANELAS (UPLOAD / MEDIA)
body.action-edit .ve-ce-attachedRootNode {
========================= */
.oo-ui-window-content,
.oo-ui-dialog,
.oo-ui-processDialog {
     background-color: #ffffff !important;
     background-color: #ffffff !important;
     color: #000000 !important;
     color: #000000 !important;
}
}


/* toolbar */
/* Inputs dentro dessas janelas */
body.action-edit .oo-ui-toolbar,
.oo-ui-window-content input,
body.action-edit .ve-ui-toolbar {
.oo-ui-window-content textarea {
    background-color: #f0f0f0 !important;
}
 
/* inputs na edição */
body.action-edit input,
body.action-edit select,
body.action-edit button {
     background-color: #ffffff !important;
     background-color: #ffffff !important;
     color: #000000 !important;
     color: #000000 !important;
    border: 1px solid #ccc !important;
}
/* links na edição */
body.action-edit a {
    color: #0645ad !important;
}
}

Edição das 14h17min de 7 de maio de 2026

/* =========================
   PALETA GLOBAL
========================= */
:root {
    --bg-main: #2b2b2b;
    --bg-soft: #3a3a3a;
    --border: #555;
    --text: #ffffff;
    --link: #8ab4f8;
}

/* =========================
   RESET GERAL
========================= */
* {
    border: none !important;
    box-shadow: none !important;
}

/* =========================
   FUNDO GERAL
========================= */
html, body {
    background-color: var(--bg-main) !important;
    color: var(--text) !important;
}

/* =========================
   CONTEÚDO PRINCIPAL
========================= */
#content, .mw-body, .mw-body-content {
    background-color: var(--bg-soft) !important;
    color: var(--text) !important;
}

/* =========================
   SIDEBAR
========================= */
#mw-panel {
    background-color: var(--bg-main) !important;
}

/* LINKS SIDEBAR */
#mw-panel a {
    background-color: var(--bg-main) !important;
    color: var(--text) !important;
    transition: all 0.25s ease;
}

/* HOVER SUAVE */
#mw-panel a:hover {
    background-color: var(--bg-soft) !important;
}

/* Remove qualquer diferença visual */
#mw-panel *, #mw-panel div, #mw-panel li {
    background-color: var(--bg-main) !important;
}

/* =========================
   TOPO
========================= */
#mw-head, #mw-page-base {
    background-color: var(--bg-main) !important;
}

/* BOTÕES SUPERIORES */
#mw-head a {
    background-color: var(--bg-main) !important;
    color: var(--text) !important;
    transition: all 0.25s ease;
}

#mw-head a:hover {
    background-color: var(--bg-soft) !important;
}

/* =========================
   LINKS
========================= */
a {
    color: var(--link) !important;
}

a:hover {
    color: #ffffff !important;
}

/* =========================
   TABELAS
========================= */
table, th, td {
    background-color: var(--bg-soft) !important;
    color: var(--text) !important;
    border: 1px solid var(--border) !important;
}

/* =========================
   ÍNDICE (TOC)
========================= */
#toc, .toc {
    background-color: var(--bg-soft) !important;
    border: 1px solid var(--border) !important;
}

#toc * {
    color: var(--text) !important;
}

/* =========================
   SUBTÍTULOS
========================= */
h1, h2, h3, h4, h5, h6 {
    color: var(--text) !important;
}

/* =========================
   INPUTS (modo escuro normal)
========================= */
input, textarea {
    background-color: var(--bg-main) !important;
    color: var(--text) !important;
    border: 1px solid var(--border) !important;
}

/* =========================
   REMOVER FUNDOS BRANCOS
========================= */
div, span {
    background-color: transparent !important;
}

/* =========================
   SCROLLBAR
========================= */
::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background: var(--bg-main);
}

::-webkit-scrollbar-thumb {
    background: var(--border);
    border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
    background: #777;
}

/* =========================
   EXCEÇÃO: EDITOR (CLARO)
========================= */

/* Visual Editor */
.ve-ui-surface,
.ve-ui-surface * {
    background-color: #ffffff !important;
    color: #000000 !important;
}

/* Editor clássico */
#wpTextbox1 {
    background-color: #ffffff !important;
    color: #000000 !important;
}

/* =========================
   EXCEÇÃO: JANELAS (UPLOAD / MEDIA)
========================= */
.oo-ui-window-content,
.oo-ui-dialog,
.oo-ui-processDialog {
    background-color: #ffffff !important;
    color: #000000 !important;
}

/* Inputs dentro dessas janelas */
.oo-ui-window-content input,
.oo-ui-window-content textarea {
    background-color: #ffffff !important;
    color: #000000 !important;
}
Disponível em “https://wiki.pokelegends.com.br/index.php?title=MediaWiki:Common.css&oldid=6543”