Ativa o menu
Alternar menu de preferências
Alternar menu pessoal
Não autenticado(a)
Your IP address will be publicly visible if you make any edits.

MediaWiki:Citizen.css: mudanças entre as edições

Página de Interface do MediaWiki
Sem resumo de edição
Sem resumo de edição
Linha 1: Linha 1:
/* ======================================================================
/* ======================================================================
   REMOVER LOGO AND FIXAR ÍCONE HOME DESDE O INÍCIO (FORÇADO)
   FIX TOTAL: CASINHA FIXA QUE ACENDE NO HOVER (SEM LOGO RESIDUAL)
   ====================================================================== */
   ====================================================================== */


/* 1. Esconde a imagem e o texto do logo original (Forfans) */
/* 1. Bloqueio absoluto do logo antigo (Forfans) em qualquer estado */
html body .citizen-header__logo img,
html body .citizen-header__logo-image,
html body .citizen-header__logo-image,
html body .citizen-header__logo img,
html body .citizen-header__logo-text,
html body .mw-logo-wordmark,
html body .mw-logo-wordmark,
html body .mw-logo-icon {
html body .mw-logo-icon,
html body .citizen-header__logo-text {
     display: none !important;
     display: none !important;
     opacity: 0 !important;
     opacity: 0 !important;
Linha 14: Linha 14:
}
}


/* Remove qualquer imagem de fundo residual para o logo não voltar */
/* Limpa o fundo do botão para o logo redondo não vazar */
html body .citizen-header__logo {
html body .citizen-header__logo {
     background-image: none !important;
     background-image: none !important;
     background-color: transparent !important;
     position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    min-height: 32px !important;
}
}


/* 2. Força o ícone de Home NATIVO a abrir visível (ignora o vazio inicial) */
/* 2. Injeta a Casinha Artificial (Aparece logo ao abrir a página) */
html body .citizen-header__logo .citizen-header__logo-icon,
html body .citizen-header__logo::before {
html body .citizen-header__logo .citizen-header__logo--icon,
    content: "" !important;
html body .citizen-header__logo svg:not(.citizen-header__logo-image),
    position: absolute !important;
html body .citizen-header__logo .citizen-ui-icon {
    top: 50% !important;
     display: inline-flex !important;
    left: 50% !important;
     opacity: 0.65 !important; /* Abre com a mesma opacidade discreta da lupa */
    transform: translate(-50%, -50%) !important;
    width: 22px !important;  /* Tamanho calibrado com os outros ícones */
    height: 22px !important;
    background-color: currentColor !important;
   
    /* Desenho da Casinha Sólida */
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z'/></svg>") no-repeat center !important;
    mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z'/></svg>") no-repeat center !important;
   
    -webkit-mask-size: contain !important;
     mask-size: contain !important;
     opacity: 0.65 !important; /* Abre discretamente com a mesma opacidade da lupa */
     visibility: visible !important;
     visibility: visible !important;
     transform: none !important;
     display: block !important;
    scale: 1 !important;
     transition: opacity 0.2s ease !important;
     transition: opacity 0.2s ease !important;
}
}


/* Garante que o Citizen não oculte a casinha enquanto o mouse estiver fora */
/* 3. COMPORTAMENTO NO HOVER: A casinha NÃO SOME, ela apenas acende! */
html body .citizen-header:not(:hover) .citizen-header__logo-icon,
html body .citizen-header:hover .citizen-header__logo::before,
html body .citizen-header:not(:hover) .citizen-header__logo--icon,
html body .citizen-header__start:hover .citizen-header__logo::before,
html body .citizen-header:not(:hover) .citizen-header__logo svg,
html body .citizen-header__logo:hover::before {
html body .citizen-header__start:not(:hover) .citizen-header__logo-icon {
     opacity: 1 !important; /* Ganha brilho total (100%) quando o mouse chega perto */
     opacity: 0.65 !important;
     visibility: visible !important;
     visibility: visible !important;
     transform: none !important;
     transform: translate(-50%, -50%) scale(1) !important; /* Mantém o tamanho e posição perfeitos */
    scale: 1 !important;
}
 
/* 3. Quando o mouse passa por cima do botão, ele ganha o destaque de 100% */
html body .citizen-header__logo:hover .citizen-header__logo-icon,
html body .citizen-header__logo:hover .citizen-header__logo--icon,
html body .citizen-header__logo:hover svg {
    opacity: 1 !important;
}
}



Edição das 23h40min de 16 de junho de 2026

/* ======================================================================
   FIX TOTAL: CASINHA FIXA QUE ACENDE NO HOVER (SEM LOGO RESIDUAL)
   ====================================================================== */

/* 1. Bloqueio absoluto do logo antigo (Forfans) em qualquer estado */
html body .citizen-header__logo img,
html body .citizen-header__logo-image,
html body .mw-logo-wordmark,
html body .mw-logo-icon,
html body .citizen-header__logo-text {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

/* Limpa o fundo do botão para o logo redondo não vazar */
html body .citizen-header__logo {
    background-image: none !important;
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    min-height: 32px !important;
}

/* 2. Injeta a Casinha Artificial (Aparece logo ao abrir a página) */
html body .citizen-header__logo::before {
    content: "" !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 22px !important;  /* Tamanho calibrado com os outros ícones */
    height: 22px !important; 
    background-color: currentColor !important;
    
    /* Desenho da Casinha Sólida */
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z'/></svg>") no-repeat center !important;
    mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z'/></svg>") no-repeat center !important;
    
    -webkit-mask-size: contain !important;
    mask-size: contain !important;
    opacity: 0.65 !important; /* Abre discretamente com a mesma opacidade da lupa */
    visibility: visible !important;
    display: block !important;
    transition: opacity 0.2s ease !important;
}

/* 3. COMPORTAMENTO NO HOVER: A casinha NÃO SOME, ela apenas acende! */
html body .citizen-header:hover .citizen-header__logo::before,
html body .citizen-header__start:hover .citizen-header__logo::before,
html body .citizen-header__logo:hover::before {
    opacity: 1 !important; /* Ganha brilho total (100%) quando o mouse chega perto */
    visibility: visible !important;
    transform: translate(-50%, -50%) scale(1) !important; /* Mantém o tamanho e posição perfeitos */
}

/* 4. Seus ajustes originais da barra lateral */
html body .citizen-drawer {
    width: 30px !important;
}
html body .citizen-nav {
    font-size: 15px !important;
}
html body .citizen-nav__item {
    padding: 10px 16px !important;
}