MediaWiki:Vector-2022.css: Difference between revisions

Latest revision as of 19:34, 5 November 2025

/* === Estilos Gerais e Cores Básicas === */
body {
  /* Fonte padrão do Vector já é sans-serif similar ao usado no site antigo */
  /* Você pode definir uma fonte específica se desejar */
}
.mw-body {
  /* Fundo branco padrão para o conteúdo principal (a wiki antiga usava fundo claro) */
  background-color: #fff;
  color: #000;
}

/* === Estilos para Caixas de Informações (Infobox) === */
table.infobox {
  background-color: #000;               /* fundo preto */
  color: #fff;                          /* texto branco */
  border: 2px solid gold;               /* borda dourada */
  border-collapse: collapse;
  float: right;                         /* alinhar infobox à direita do texto */
  margin: 0 0 1em 1em;                  /* espaçamento em torno */
}
table.infobox th {
  background-color: #111;               /* cabeçalho um pouco mais claro que preto */
  color: gold;                          /* título em dourado */
  padding: 5px;
  text-align: left;
}
table.infobox td {
  background-color: #222;
  color: #fff;
  padding: 5px;
}
table.infobox th, table.infobox td {
  border: 1px solid gold;               /* linhas da tabela em dourado */
}
table.infobox caption {
  background-color: gold;
  color: #000;
  font-weight: bold;
  padding: 5px;
}

/* === Estilos para o Layout de Grades na Página Principal === */
/* Container de guia de eventos (Eventos) */
.mw-guide-container {
  margin: 10px 0;
}
.mw-guide-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;             /* centraliza os itens */
  gap: 10px;                           /* espaçamento entre itens */
}
.mw-guide-item {
  display: inline-block;
  text-align: center;
  margin: 5px;
  text-decoration: none;
  color: inherit;                     /* herda a cor do texto (preto) */
}
/* Ícone do evento */
.mw-guide-icon {
  width: 40px;
  height: 40px;
  margin: 0 auto 3px auto;
}
.mw-guide-icon img {
  max-width: 100%;
  max-height: 100%;
}
.mw-guide-text {
  display: block;
  font-size: 90%;
}

/* Container de cartas de classes (Classes) */
.mw-image-container {
  margin: 10px 0;
}
.mw-image-grid-5col {
  display: grid;
  grid-template-columns: repeat(5, 1fr);  /* 5 colunas uniformes */
  gap: 10px;
}
.mw-image-card {
  display: block;
  text-align: center;
  text-decoration: none;
  color: inherit;
  background: #f9f9f9;
  border: 1px solid #ccc;
  padding: 5px;
  border-radius: 4px;
}
.mw-card-image {
  width: 80px;
  height: 80px;
  margin: 0 auto 5px auto;
  overflow: hidden;
}
.mw-card-image img {
  max-width: 100%;
  max-height: 100%;
}
/* Fundo para imagens de classes (um fundo escuro para destacar ícones se forem transparentes) */
.bg-classes {
  background-color: #000;
}
.mw-card-text {
  display: block;
  font-size: 90%;
  color: #000;
}

/* === Estilos para o Destaque (bloco preto de borda dourada) === */
.highlight-box {
  background-color: #000;
  border: 2px solid gold;
  color: #fff;
  padding: 10px;
  margin: 0.5em 0;
}
.highlight-box h4, .highlight-box b {
  color: gold;
}

/* === Estilos da Barra Lateral (Navegação) === */
#mw-panel {
  background-color: #111;
  border-right: 2px solid gold;           /* borda dourada na lateral da barra */
}
.mw-portlet h3 {
  background-color: #222;
  color: gold;
  padding: 8px 5px;
  margin: 0;
  text-transform: uppercase;
  font-size: 0.9em;
}
.mw-portlet-body {
  background-color: #111;
  padding: 5px 0;
}
.mw-portlet-body ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.mw-portlet-body li a {
  display: block;
  color: #fff;
  text-decoration: none;
  padding: 3px 8px;
}
.mw-portlet-body li a:hover {
  background-color: #333;
  color: gold;
}

/* === Outros Ajustes Menores === */
/* Linha horizontal (----) dourada */
hr {
  border: none;
  border-top: 1px solid gold;
  margin: 1em 0;
}
/* Links padrão permanecem azul/púrpura; ajuste se necessário para contraste em fundos escuros */
a {
  /* color: #0366d6; (azul padrão MediaWiki) */
}
/* Texto dos rodapés e créditos (opcional: aqui mantendo padrão) */
#footer {
  background: #f8f9fa;
}
/* === Ícones em Links Específicos (exemplo Discord) === */
/* Opcional: adicionar um ícone antes de links que contenham "discord" */
.mw-parser-output a[href*="discord"]::before {
  content: url("URL_DO_ICONE_DISCORD");  /* substitua pelo caminho do ícone do Discord */
  vertical-align: text-bottom;
  margin-right: 4px;
}