MediaWiki:Common.css: Difference between revisions
No edit summary |
No edit summary |
||
| Line 6: | Line 6: | ||
/* ========================================================================== | /* ========================================================================== | ||
ÍNDICE LATERAL (TOC) - | ÍNDICE LATERAL (TOC) - DESIGN DE SETA IGUAL À DEFAULT | ||
========================================================================== */ | ========================================================================== */ | ||
/* 1. Esconde as sublistas | /* 1. Esconde as sublistas por padrão */ | ||
.vector-toc-contents .vector-toc-list .vector-toc-list { | .vector-toc-contents .vector-toc-list .vector-toc-list { | ||
display: none !important; | display: none !important; | ||
} | } | ||
/* 2. Mostra a sublista | /* 2. Mostra a sublista quando expandido */ | ||
.vector-toc-list-item.toc-expanded > .vector-toc-list { | .vector-toc-list-item.toc-expanded > .vector-toc-list { | ||
display: block !important; | display: block !important; | ||
} | } | ||
/* 3. | /* 3. Posicionamento relativo das linhas do menu */ | ||
.vector-toc-contents .vector-toc-list .vector-toc-list-item { | .vector-toc-contents .vector-toc-list .vector-toc-list-item { | ||
position: relative !important; | position: relative !important; | ||
} | } | ||
/* 4. | /* 4. Container do botão da seta (invisível, serve para clique) */ | ||
.toc-toggle-arrow { | .toc-toggle-arrow { | ||
position: absolute !important; | position: absolute !important; | ||
left: - | left: -14px !important; /* Margem perfeita à esquerda do texto */ | ||
top: 5px !important; /* | top: 5px !important; /* Alinha ao centro da primeira linha */ | ||
display: inline- | display: inline-flex !important; | ||
align-items: center; | |||
justify-content: center; | |||
cursor: pointer !important; | cursor: pointer !important; | ||
width: 12px !important; | |||
height: 14px !important; | |||
width: | |||
z-index: 50 !important; | z-index: 50 !important; | ||
} | } | ||
/* 5. | /* 5. O Desenho da Seta (Estilo Chevron Igual ao Default) */ | ||
. | .toc-toggle-arrow .arrow-icon { | ||
transform: rotate( | display: inline-block; | ||
width: 5px; | |||
height: 5px; | |||
border-right: 1.5px solid #54595d; /* Mesma cor cinza nativa */ | |||
border-bottom: 1.5px solid #54595d; | |||
transform: rotate(-45deg); /* Aponta para a direita por padrão */ | |||
transition: transform 0.2s ease-in-out; | |||
margin-left: -2px; | |||
} | } | ||
/* 6. Indentação interna | /* 6. Rotação idêntica à default quando o menu abre (roda para baixo) */ | ||
.vector-toc-list-item.toc-expanded > .toc-toggle-arrow .arrow-icon { | |||
transform: rotate(45deg) !important; | |||
margin-top: -2px; | |||
margin-left: 0px; | |||
} | |||
/* 7. Indentação interna para os subcapítulos */ | |||
.vector-toc-contents .vector-toc-list .vector-toc-list { | .vector-toc-contents .vector-toc-list .vector-toc-list { | ||
padding-left: 12px !important; | padding-left: 12px !important; | ||
| Line 50: | Line 63: | ||
} | } | ||
/* | /* 8. Proteção absoluta para garantir que o cabeçalho nunca herda este estilo */ | ||
.vector-toc-header .toc-toggle-arrow, | .vector-toc-header .toc-toggle-arrow, | ||
.vector-toc-title .toc-toggle-arrow, | .vector-toc-title .toc-toggle-arrow, | ||
| Line 56: | Line 69: | ||
display: none !important; | display: none !important; | ||
opacity: 0 !important; | opacity: 0 !important; | ||
} | } | ||