MediaWiki:Vector-2022.css: mudanças entre as edições

Edição atual tal como às 09h46min de 16 de outubro de 2025

/***** LATERAL (Vector 2022) – cartão escuro como no site de referência *****/
body.skin-vector-2022 .vector-sidebar { padding: 12px; }

/* Cada “portal” do painel lateral */
body.skin-vector-2022 .vector-sidebar .vector-menu {
  background: #1c2c36;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 14px;
  box-shadow: 0 8px 22px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.03);
  margin: 14px 8px;
  overflow: hidden;
}

/* Cabeçalho do portal */
body.skin-vector-2022 .vector-sidebar .vector-menu-heading {
  background: linear-gradient(180deg, #223642, #1d2e38);
  color: #d7ecf6;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: 12px 14px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}

/* Lista e itens */
body.skin-vector-2022 .vector-sidebar .vector-menu-content-list { padding: 8px 10px 10px; }
body.skin-vector-2022 .vector-sidebar .vector-menu-content-list li { margin: 6px 0; }

/* Links */
body.skin-vector-2022 .vector-sidebar .vector-menu-content-list a {
  display: block;
  padding: 10px 12px;
  border-radius: 10px;
  color: #e6f4fb;
  text-decoration: none !important;
  border: 1px solid rgba(255,255,255,.06);
  background: rgba(255,255,255,.02);
  transition: all .2s ease;
}
body.skin-vector-2022 .vector-sidebar .vector-menu-content-list a:hover {
  color: #a8d0e6;
  border-color: rgba(168,208,230,.45);
  background: rgba(168,208,230,.08);
  transform: translateX(2px);
  box-shadow: 0 6px 16px rgba(0,0,0,.25);
}
body.skin-vector-2022 .vector-sidebar .vector-menu-content-list a:focus {
  outline: 2px solid #6ba3b8;
  outline-offset: 2px;
}

/* Card do logo no topo (opcional) */
body.skin-vector-2022 .vector-sidebar .mw-logo {
  background: linear-gradient(180deg, #223642, #1d2e38);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  margin: 10px 8px 6px;
  padding: 10px 8px;
  box-shadow: 0 8px 22px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.03);
}

/***** BUSCA – arredondada com leve glow *****/
body.skin-vector-2022 .vector-search-box .cdx-text-input__input {
  border-radius: 999px !important;
  border: 1px solid rgba(168,208,230,.35);
  background: rgba(255,255,255,.9);
  transition: box-shadow .2s, border-color .2s;
}
body.skin-vector-2022 .vector-search-box .cdx-text-input__input:focus {
  border-color: #6ba3b8;
  box-shadow: 0 0 0 3px rgba(107,163,184,.25);
}

/***** CONTEÚDO – moldura clara arredondada *****/
body.skin-vector-2022 .mw-page-container { background: #f6fbfe; }
body.skin-vector-2022 .mw-content-container .mw-content {
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 10px 26px rgba(0,0,0,.12);
  border: 1px solid #e7edf1;
}

/***** Abas do topo em formato “pílula” (opcional bonito) *****/
body.skin-vector-2022 .vector-page-titlebar .vector-tab-links { gap: 8px; }
body.skin-vector-2022 .vector-page-titlebar a[role="tab"] {
  display: inline-block;
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid rgba(168,208,230,.35);
  background: rgba(255,255,255,.9);
  color: #153040;
  text-decoration: none !important;
  transition: all .2s ease;
}
body.skin-vector-2022 .vector-page-titlebar a[role="tab"]:hover {
  border-color: #6ba3b8;
  box-shadow: 0 0 0 3px rgba(107,163,184,.25);
}