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 4: Linha 4:
   ====================================================================== */
   ====================================================================== */


/* 1. Esconde estritamente a imagem/texto do logo (Forfans) */
/* 1. Esconde a imagem do logo (Forfans) permanentemente */
.citizen-header__logo img,
.citizen-header__logo img,
.citizen-header__logo-image,
.citizen-header__logo-image,
.citizen-header__logo-text,
.mw-logo-wordmark,
.mw-logo-wordmark,
.mw-logo-icon {
.mw-logo-icon {
     display: none !important;
     display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}
}


/* 2. Garante que os contêineres principais permitam a exibição */
/* 2. Injeta um ícone de Home por padrão usando máscara SVG
.citizen-header__start,
      (Ele herda a cor correta do tema automaticamente) */
.citizen-header__logo {
.citizen-header__logo::before {
    content: "" !important;
    display: inline-block !important;
    width: 22px !important;
    height: 22px !important;
    background-color: currentColor !important; /* Usa a cor do texto do cabeçalho */
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 3L2 12h3v8h6v-6h2v6h6v-8h3L12 3z'/></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='M12 3L2 12h3v8h6v-6h2v6h6v-8h3L12 3z'/></svg>") no-repeat center !important;
    -webkit-mask-size: contain !important;
    mask-size: contain !important;
     opacity: 1 !important;
     opacity: 1 !important;
     visibility: visible !important;
     visibility: visible !important;
     background-image: none !important;
     transition: opacity 0.2s ease, transform 0.2s ease !important;
}
}


/* 3. Força qualquer ícone (SVG, i, ou classe de ícone) na seção inicial
/* 3. Quando o mouse passa por cima, o nosso ícone esmaece e encolhe
  a ignorar os efeitos de sumir, deslizar ou encolher quando o mouse sai */
      enquanto o ícone nativo do Citizen surge no lugar, criando a animação */
.citizen-header__start svg,
.citizen-header__logo:hover::before {
.citizen-header__start i,
     opacity: 0 !important;
.citizen-header__start .citizen-ui-icon,
     transform: scale(0.7) !important;
.citizen-header__start [class*="icon"],
.citizen-header__logo * {
    display: inline-block !important;
     opacity: 1 !important;
    visibility: visible !important;
     transform: none !important;
    transition: none !important;
    scale: 1 !important;
}
}



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

/* Todo o CSS aqui será carregado para usuários do tema Citizen */
/* ======================================================================
   AJUSTES DA BARRA LATERAL E ÍCONE HOME (CITIZEN)
   ====================================================================== */

/* 1. Esconde a imagem do logo (Forfans) permanentemente */
.citizen-header__logo img,
.citizen-header__logo-image,
.mw-logo-wordmark,
.mw-logo-icon {
    display: none !important;
}

/* 2. Injeta um ícone de Home por padrão usando máscara SVG 
      (Ele herda a cor correta do tema automaticamente) */
.citizen-header__logo::before {
    content: "" !important;
    display: inline-block !important;
    width: 22px !important;
    height: 22px !important;
    background-color: currentColor !important; /* Usa a cor do texto do cabeçalho */
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 3L2 12h3v8h6v-6h2v6h6v-8h3L12 3z'/></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='M12 3L2 12h3v8h6v-6h2v6h6v-8h3L12 3z'/></svg>") no-repeat center !important;
    -webkit-mask-size: contain !important;
    mask-size: contain !important;
    opacity: 1 !important;
    visibility: visible !important;
    transition: opacity 0.2s ease, transform 0.2s ease !important;
}

/* 3. Quando o mouse passa por cima, o nosso ícone esmaece e encolhe 
      enquanto o ícone nativo do Citizen surge no lugar, criando a animação */
.citizen-header__logo:hover::before {
    opacity: 0 !important;
    transform: scale(0.7) !important;
}

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