Jump to content

MediaWiki:Common.css: Difference between revisions

No edit summary
Tag: Reverted
No edit summary
 
(46 intermediate revisions by the same user not shown)
Line 3: Line 3:




/* 1. IMAGEM DE FUNDO NO TOPO DA HIERARQUIA */
 
html, body, .mw-page-container {
/* Botão de Seta para o Topo */
     background-image: url('https://wiki.atronia.eu/images/7/7a/Texture_Background.svg') !important;
.footer-top-button {
     background-attachment: fixed !important;
    display: inline-flex !important;
     background-size: cover !important;
    align-items: center !important;
     background-position: center center !important;
    justify-content: center !important;
     background-color: transparent !important;
    background-color: #d1ff00 !important; /* Mesmo verde */
    color: #000 !important;
    width: 40px !important;
    height: 40px !important;
    border-radius: 50% !important; /* Circular */
    font-weight: bold !important;
    font-size: 20px !important;
    text-decoration: none !important;
    box-shadow: 0 4px 8px rgba(0,0,0,0.15) !important;
    transition: transform 0.2s ease !important;
    cursor: pointer;
}
 
.footer-top-button:hover {
    transform: scale(1.1) !important;
    background-color: #e2ff33 !important;
    text-decoration: none !important;
}
 
/* Garante que o container se alinha bem no mobile */
@media screen and (max-width: 720px) {
     #footer-custom-buttons-container {
        justify-content: center !important;
        margin-top: 15px !important;
    }
}
 
 
 
 
/* 1. Contentor do botão Buy Now (MONARCH) - Alinhado à direita */
.buy-now-container {
    display: flex !important;
    justify-content: right !important;
}
 
/* 2. Estilo do Botão - Base e Centralização */
.button-buy-now a.external {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
 
    background-color: #d1ff00 !important; /* Verde néon */
    color: #000 !important; /* Texto preto */
   
    /* PADDING IGUAL DOS DOIS LADOS (Essencial para centrar) */
    padding: 7px 25px !important;
   
    border-radius: 50px !important;
    font-weight: bold !important;
    text-decoration: none !important;
    font-size: 1.0em !important;
    font-family: "Rubik", sans-serif !important;
    box-shadow: 0 4px 8px rgba(0,0,0,0.15) !important;
    transition: transform 0.2s ease !important;
 
    /* Remove a seta e o espaço fantasma do MediaWiki */
     background-image: none !important;
    margin-right: 0 !important;
    text-indent: 0 !important;
    letter-spacing: 0 !important;
}
 
/* 3. Forçar anulação de regras do sistema (mw-parser-output) */
.mw-parser-output .button-buy-now a.external {
    padding-right: 25px !important; /* Força a simetria com a esquerda */
     background-image: none !important;
}
 
/* 4. Efeito ao passar o rato */
.button-buy-now a.external:hover {
    transform: scale(1.05) !important;
     background-color: #e2ff33 !important;
    text-decoration: none !important;
}
 
 
 
 
 
/* ==========================================================================
  RODAPÉ (Footer) - Versão Final Limpa
  ========================================================================== */
 
/* 1. Contentor do Rodapé - Permite que os itens respirem e alinhem */
#footer-places {
    display: flex !important;
    width: 100% !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    padding: 10px 25px !important;
}
 
/* 2. Links da Esquerda (Privacy, About, etc) */
#footer-places li {
    margin-right: 15px !important;
    list-style: none !important;
}
 
/* 3. NOVO CONTENTOR DOS BOTÕES (Seta + Link)
  O "margin-left: auto" é o íman que empurra o grupo para a direita */
#footer-custom-buttons-container {
    display: flex !important;
    gap: 12px !important; /* Espaço entre a seta e o botão */
    align-items: center !important;
    margin-left: auto !important;
    margin-right: 0 !important;
    list-style: none !important;
}
 
/* 4. Estilo Comum para Seta e Botão (Cápsula Verde) */
.footer-top-button,
.footer-button-atronia-real {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
     background-color: #d1ff00 !important;
    color: #000 !important;
    font-weight: bold !important;
    text-decoration: none !important;
    box-shadow: 0 4px 8px rgba(0,0,0,0.15) !important;
    transition: all 0.2s ease-in-out !important;
    border-radius: 50px !important;
}
 
/* 5. Especificações da Seta (Circular) */
.footer-top-button {
    width: 40px !important;
    height: 40px !important;
    font-size: 18px !important;
}
 
/* 6. Especificações do Botão do Site */
.footer-button-atronia-real {
    padding: 7px 25px !important;
    font-size: 1.0em !important;
    font-family: "Rubik", sans-serif !important;
    white-space: nowrap !important;
}
}


/* 2. MATAR O BRANCO DE TODAS AS CAMADAS DA SKIN */
/* 7. Hover para os dois */
/* Este bloco força a transparência em tudo o que costuma ser branco */
.footer-top-button:hover,
.vector-header-container,  
.footer-button-atronia-real:hover {
.vector-main-menu-content,
     background-color: #e2ff33 !important;
.mw-content-container,
     transform: scale(1.05) !important;
#content,
     text-decoration: none !important;
.mw-body,
.vector-body,
.vector-sticky-pinned-container,
#mw-content-text,
.vector-column-start,
.vector-column-end {
    background: transparent !important;
     background-color: transparent !important;
     border: none !important;
     box-shadow: none !important;
}
}


/* 3. PROTEÇÃO DE LEITURA (Opcional) */
/* 8. Remover ícones de link externo do MediaWiki */
/* Se o texto ficar difícil de ler, isto cria uma sombra suave por baixo das letras */
.footer-button-atronia-real.external,
#mw-content-text {
.footer-button-atronia-real.external:after {
     background-color: rgba(255, 255, 255, 1) !important; /* 70% de branco para contraste */
     background-image: none !important;
     padding: 20px !important;
     padding-right: 25px !important; /* Mantém igual à esquerda para centrar */
    border-radius: 10px !important;
}
}


/* 4. ÍNDICE (TOC) E SIDEBARS */
/* --- AJUSTE PARA MOBILE (Ecrãs até 720px) --- */
.vector-toc, .vector-main-menu {
@media screen and (max-width: 720px) {
    background-color: rgba(255, 255, 255, 0.4) !important;
    #footer-places {
    backdrop-filter: blur(5px);
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
        width: auto !important;
    }
 
    #footer-places li {
        margin-right: 0 !important;
        margin-bottom: 10px !important;
    }
 
    /* No mobile, os botões ficam centrados em baixo dos textos */
    #footer-custom-buttons-container {
        margin-left: 0 !important;
        margin-top: 15px !important;
        justify-content: center !important;
    }
}
}