MediaWiki:Common.css

De Grimopedia
Revisão de 14h45min de 16 de outubro de 2025 por Andrei478 (discussão | contribs)
Ir para navegação Ir para pesquisar

Nota: Após publicar, você pode ter que limpar o "cache" do seu navegador para ver as alterações.

  • Firefox / Safari: Pressione Shift enquanto clica Recarregar, ou pressione Ctrl-F5 ou Ctrl-R (⌘-R no Mac)
  • Google Chrome: Pressione Ctrl-Shift-R (⌘-Shift-R no Mac)
  • Edge: Pressione Ctrl enquanto clica Recarregar, ou pressione Ctrl-F5.
  • Opera: Pressione Ctrl-F5.
/* =============== broAurora — Common.css (mínimo) =============== */
/* Herói: só centraliza textos (não vira flex) */
.bro-hero {
  text-align: center;
  padding: 28px 16px 8px;
}

/* Barra de CTAs: lado a lado + responsivo */
.bro-cta-bar {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;     /* quebra no mobile */
  margin: 14px auto 0;
  width: 100%;
}

/* Cada CTA é um link “limpo” */
.bro-cta {
  display: block;
  line-height: 0;
  text-decoration: none;
  outline: none;
}

/* Imagem do CTA (controlamos tamanho aqui, independente do wiki) */
.bro-cta img {
  display: block;
  width: 320px;          /* desktop padrão */
  max-width: 100%;
  height: auto;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transition: transform .22s ease;
  transform-origin: center center;
}

/* Zoom suave */
.bro-cta:hover img,
.bro-cta:focus-visible img {
  transform: scale(1.06);
  outline: none;
}

/* Responsivo */
@media (max-width: 900px) {
  .bro-cta-bar { gap: 18px; }
  .bro-cta img { width: 280px; }
}
@media (max-width: 600px) {
  .bro-cta img { width: 220px; }
}

/* (Opcional) Esconde título/metas só na Home — pode remover se não quiser */
body.page-Página_principal #firstHeading,
body.page-Página_principal #siteSub,
body.page-Página_principal #contentSub,
body.page-Página_principal .mw-indicators { display: none !important; }

/* ===== Linha de CTAs usando <gallery> ===== */
.mw-parser-output .bro-cta-gallery .gallery {
  display: flex;               /* garante lado a lado */
  justify-content: center;
  gap: 24px;
  flex-wrap: wrap;              /* quebra no mobile */
}
.mw-parser-output .bro-cta-gallery .gallerybox {
  margin: 0; padding: 0;
  border: 0; box-shadow: none;
  background: transparent;
}
.mw-parser-output .bro-cta-gallery .gallerybox .thumb {
  border: 0; background: transparent; box-shadow: none;
}
.mw-parser-output .bro-cta-gallery .gallerytext { display: none; } /* sem legendas */
.mw-parser-output .bro-cta-gallery img {
  display: block;
  width: 320px; height: auto;  /* desktop padrão */
  transition: transform .22s ease;
  transform-origin: center center;
}
.mw-parser-output .bro-cta-gallery .gallerybox:hover img { transform: scale(1.06); }

@media (max-width: 900px){ .mw-parser-output .bro-cta-gallery img { width: 280px; } }
@media (max-width: 600px){ .mw-parser-output .bro-cta-gallery img { width: 220px; } }