Jump to content

MediaWiki:Vector-2022.css

From Vampiro
Revision as of 18:36, 1 September 2026 by Fernando (talk | contribs) (Tema Gótico-Punk completo para skin Vector 2022)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)

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.

/* ==========================================================================
   VAMPIRO: A MÁSCARA — TEMA GÓTICO-PUNK PARA TELA DE LOGIN & PÁGINAS ESPECIAIS
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@500;700;900&family=Inter:wght@300;400;500;600;700&family=Playfair+Display:ital,wght@0,600;0,700;1,400&family=Special+Elite&display=swap');

:root, html, body,
.skin-vector-2022,
.skin-vector,
.mw-special-Userlogin {
  background: #08080b !important;
  background-color: #08080b !important;
  color: #ddd9d0 !important;
  font-family: 'Inter', -apple-system, sans-serif !important;
}

html, body,
.mw-page-container,
.mw-page-container-inner,
.vector-column-start,
.vector-column-end,
.vector-header,
.vector-header-container,
.mw-header,
#mw-head {
  background: #08080b !important;
  background-color: #08080b !important;
  border-color: #252530 !important;
}

.mw-body,
.vector-body,
.mw-body-content,
.mw-content-container,
#content,
#bodyContent,
#mw-content-text,
.mw-ui-container,
#userloginForm,
main {
  background: #101015 !important;
  background-color: #101015 !important;
  color: #ddd9d0 !important;
}

/* Título Log In */
#firstHeading,
.mw-first-heading,
h1 {
  font-family: 'Cinzel', Georgia, serif !important;
  font-size: 2.2em !important;
  color: #c9182b !important;
  text-shadow: 0 0 14px rgba(201, 24, 43, 0.45) !important;
  border-bottom: 2px solid #8b0000 !important;
  padding-bottom: 8px !important;
  margin-bottom: 24px !important;
}

/* Formulário de Login */
.mw-htmlform,
.mw-htmlform-codex,
#userloginForm form {
  max-width: 440px !important;
  background: rgba(22, 22, 29, 0.95) !important;
  border: 1px solid #3d0a12 !important;
  border-left: 4px solid #8b0000 !important;
  border-radius: 4px !important;
  padding: 24px !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.8), inset 0 0 20px rgba(0, 0, 0, 0.5) !important;
  margin-top: 16px !important;
}

/* Labels do Formulário */
.cdx-label__label__text,
.cdx-label,
label {
  color: #c5a059 !important;
  font-family: 'Cinzel', Georgia, serif !important;
  font-weight: 700 !important;
  font-size: 0.9em !important;
  letter-spacing: 0.8px !important;
  text-transform: uppercase !important;
}

/* Campos de Texto (Username & Password) */
.cdx-text-input,
.cdx-text-input__input,
input.loginText,
input[type="text"],
input[type="password"] {
  background: #0b0b10 !important;
  background-color: #0b0b10 !important;
  color: #ffffff !important;
  border: 1px solid #3d0a12 !important;
  border-radius: 4px !important;
  padding: 10px 14px !important;
  font-size: 1em !important;
  box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.9) !important;
  transition: all 0.25s ease !important;
}

.cdx-text-input__input:focus,
input.loginText:focus,
input[type="text"]:focus,
input[type="password"]:focus {
  border-color: #ff2a3f !important;
  box-shadow: 0 0 10px rgba(201, 24, 43, 0.6), inset 0 2px 8px rgba(0, 0, 0, 0.9) !important;
  outline: none !important;
}

/* Checkbox "Keep me logged in" */
.cdx-checkbox__label,
.mw-userlogin-rememberme {
  color: #b0aca4 !important;
  font-size: 0.95em !important;
}

.cdx-checkbox__input {
  accent-color: #8b0000 !important;
}

/* Botão "Log in" */
.cdx-button--action-progressive.cdx-button--weight-primary,
button#wpLoginAttempt,
#wpLoginAttempt,
.mw-htmlform-submit .cdx-button {
  background: linear-gradient(180deg, #8b1020 0%, #450810 100%) !important;
  background-color: #660e1a !important;
  color: #ffffff !important;
  font-family: 'Cinzel', Georgia, serif !important;
  font-size: 1.05em !important;
  font-weight: 800 !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  border: 1px solid #ff2a3f !important;
  border-radius: 4px !important;
  padding: 12px 20px !important;
  cursor: pointer !important;
  box-shadow: 0 4px 16px rgba(201, 24, 43, 0.5) !important;
  transition: all 0.25s ease !important;
  margin-top: 16px !important;
  width: 100% !important;
}

.cdx-button--action-progressive.cdx-button--weight-primary:hover,
button#wpLoginAttempt:hover,
#wpLoginAttempt:hover {
  background: linear-gradient(180deg, #b31529 0%, #5a0a15 100%) !important;
  box-shadow: 0 0 22px rgba(255, 42, 63, 0.8) !important;
  transform: translateY(-1px) !important;
}

/* Links do Rodapé do Formulário */
.mw-userlogin-help a,
#userloginForm a,
.mw-body a {
  color: #e55353 !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
}

.mw-userlogin-help a:hover,
#userloginForm a:hover,
.mw-body a:hover {
  color: #ff2a3f !important;
  text-shadow: 0 0 8px rgba(201, 24, 43, 0.6) !important;
}

/* Logo do Cabeçalho */
.mw-logo {
  height: auto !important;
  max-height: none !important;
  padding: 4px 0 !important;
}

.mw-logo-icon {
  content: url('/images/b/be/Wiki_Logo.svg') !important;
  object-fit: contain !important;
  height: 96px !important;
  width: auto !important;
  max-height: 96px !important;
  max-width: 320px !important;
  border: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  filter: drop-shadow(0 0 2px #ff2a3f) drop-shadow(0 0 8px rgba(201, 24, 43, 0.85)) drop-shadow(0 0 18px rgba(139, 0, 0, 0.6)) !important;
}

.mw-logo-container,
.mw-logo-wordmark,
.mw-logo-tagline {
  display: none !important;
}

/* Menu Hambúrguer */
#vector-main-menu-dropdown .vector-icon,
.vector-main-menu-dropdown .vector-icon,
.mw-ui-icon-wikimedia-menu {
  color: #f5f5f5 !important;
  background-color: #f5f5f5 !important;
  filter: drop-shadow(0 0 2px #ff2a3f) drop-shadow(0 0 8px rgba(201, 24, 43, 0.85)) drop-shadow(0 0 18px rgba(139, 0, 0, 0.6)) !important;
}

/* Barra de Busca */
#simpleSearch,
.cdx-text-input__input {
  background: #16161d !important;
  color: #ffffff !important;
  border: 1px solid #3d0a12 !important;
}

button.cdx-search-input__end-button {
  background: #000000 !important;
  color: #ffffff !important;
  font-family: 'Cinzel', Georgia, serif !important;
  font-weight: 800 !important;
  border: 1px solid #3d0a12 !important;
}
Retrieved from "https://vampiro-a-mascara.loboazul.com.br/index.php?title=MediaWiki:Vector-2022.css&oldid=320"