MediaWiki:Common.js: Difference between revisions
Appearance
No edit summary Tag: Reverted |
No edit summary Tag: Reverted |
||
| Line 79: | Line 79: | ||
/* --- LÓGICA DE CHEVRONS | /* --- LÓGICA DE CHEVRONS UNIVERSAL (Vector 2022 + Legacy) --- */ | ||
$(function() { | $(function() { | ||
var $toc = $('#toc'); | // Tenta encontrar o índice em qualquer um dos formatos possíveis | ||
var $toc = $('.vector-toc, #toc, .toc'); | |||
if (!$toc.length) return; | if (!$toc.length) return; | ||
// Procura listas | // Procura as listas de sub-itens | ||
$toc.find('li | $toc.find('li ul').each(function() { | ||
var $subList = $(this); | var $subList = $(this); | ||
var $parentLi = $subList.parent(); | var $parentLi = $subList.parent(); | ||
// | // Evita duplicar setas se o script correr duas vezes | ||
if ($parentLi.find('.toc-custom-toggle').length) return; | |||
var $chevron = $('<span class="toc-custom-toggle"></span>') | var $chevron = $('<span class="toc-custom-toggle"></span>') | ||
.html('&# | .html('▸') // Seta para a direita (fechado) | ||
.css({ | .css({ | ||
'cursor': 'pointer', | 'cursor': 'pointer', | ||
'margin-right': ' | 'margin-right': '8px', | ||
'display': 'inline-block', | 'display': 'inline-block', | ||
'transition': 'transform 0.2s', | 'transition': 'transform 0.2s', | ||
'color': '# | 'color': '#4477aa', | ||
'font- | 'font-size': '14px' | ||
}); | }); | ||
// | // No Vector 2022, o link está dentro de uma div .vector-toc-link | ||
$ | var $anchor = $parentLi.find('> a, > .vector-toc-link'); | ||
$anchor.before($chevron); | |||
// | // Começar colapsado | ||
$subList.hide(); | |||
$chevron.on('click', function(e) { | $chevron.on('click', function(e) { | ||
e.preventDefault(); | |||
e.stopPropagation(); | e.stopPropagation(); | ||
$subList.slideToggle('fast'); | $subList.slideToggle('fast'); | ||
if ($(this).data('collapsed')) { | if ($(this).data('collapsed')) { | ||
$(this).css('transform', 'rotate(0deg)').data('collapsed', false); | $(this).css('transform', 'rotate(0deg)').data('collapsed', false); | ||
} else { | } else { | ||
$(this).css('transform', 'rotate( | $(this).css('transform', 'rotate(90deg)').data('collapsed', true); | ||
} | } | ||
}); | }); | ||
}); | }); | ||
}); | }); | ||