Jump to content

MediaWiki:Mobile.css: Difference between revisions

From ATRONIA Wiki
No edit summary
Tag: Replaced
 
(13 intermediate revisions by the same user not shown)
Line 1: Line 1:
/* All CSS here will be loaded for users of the mobile site */
/* All CSS here will be loaded for users of the mobile site */
/* ESTES ESTILOS SÓ AFETAM O TELEMÓVEL */
/* 1. Limpar fundos que pesam no mobile */
body, .mw-page-container {
    background-image: none !important;
    background-color: #ffffff !important;
}
/* 2. Corrigir o tamanho do conteúdo e tabelas */
#content, .mw-body {
    margin: 0 !important;
    padding: 10px !important;
    width: 100% !important;
}
/* Forçar scroll nas tabelas de hardware do ATLAS */
.mw-parser-output {
    overflow-x: auto !important;
}
table {
    display: block !important;
    width: 100% !important;
    overflow-x: auto !important;
}
/* 3. Ajustar o Logo da ATRONIA no topo */
.mw-wiki-logo {
    max-width: 140px !important;
    background-size: contain !important;
    margin-left: 10px;
}
/* 4. Cores de texto para melhor contraste */
#mw-content-text {
    color: #000000 !important;
    font-size: 0.95em !important;
}
/* Ajuste do Header e Logo para Mobile */
@media screen and (max-width: 720px) {
    /* Garante que o container do logo tenha espaço */
    .mw-header {
        display: flex !important;
        align-items: center !important;
        padding: 5px 10px !important;
    }
    /* Redimensiona o logo ATRONIA para caber no topo */
    .mw-wiki-logo {
        max-width: 120px !important;
        height: 40px !important;
        background-size: contain !important;
        margin: 0 !important;
    }
   
    /* Se estiveres a usar a wordmark (texto ATRONIA) */
    .mw-logo-wordmark {
        max-width: 100px !important;
        height: auto !important;
    }
}
/* Remover o fundo branco do quadrado da pesquisa no Mobile */
@media screen and (max-width: 720px) {
    /* O container principal da busca */
    .cdx-search-input,
    .cdx-search-input__input-wrapper,
    .vector-search-box-input {
        background-color: rgba(255, 255, 255, 0.1) !important; /* Ligeira transparência */
        border: 1px solid rgba(255, 255, 255, 0.3) !important;
        color: white !important; /* Cor do texto que escreves */
    }
    /* O input específico onde se digita */
    .cdx-text-input__input {
        background-color: transparent !important;
        color: white !important;
    }
    /* Cor do ícone da lupa e do texto de placeholder */
    .cdx-text-input__icon, ::placeholder {
        color: rgba(255, 255, 255, 0.7) !important;
    }
}

Latest revision as of 15:26, 26 March 2026

/* All CSS here will be loaded for users of the mobile site */