|
1 | 1 | // ==UserScript==
|
2 | 2 | // @name GitHub Table of Contents
|
3 |
| -// @version 2.1.0 |
| 3 | +// @version 2.1.1 |
4 | 4 | // @description A userscript that adds a table of contents to readme & wiki pages
|
5 | 5 | // @license MIT
|
6 | 6 | // @author Rob Garrison
|
|
75 | 75 | .ghus-toc .ghus-toc-h6 { padding-left:90px; }
|
76 | 76 | /* anchor collapsible icon */
|
77 | 77 | .ghus-toc li.collapsible .ghus-toc-icon:before {
|
78 |
| - content:' '; position:absolute; width:10px; height:10px; display:inline-block; left:-12px; top:-10px; |
| 78 | + content:' '; position:absolute; width:20px; height:20px; display:inline-block; left:-16px; top:-14px; |
79 | 79 | background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGNsYXNzPSdvY3RpY29uJyBoZWlnaHQ9JzE0JyB2aWV3Qm94PScwIDAgMTIgMTYnPjxwYXRoIGQ9J00wIDVsNiA2IDYtNkgweic+PC9wYXRoPjwvc3ZnPg==) left center no-repeat;
|
80 | 80 | }
|
81 | 81 | .ghus-toc li.collapsible.collapsed .ghus-toc-icon:before { -webkit-transform:rotate(-90deg);
|
82 |
| - transform:rotate(-90deg); } |
| 82 | + transform:rotate(-90deg); top:-20px; left:-20px; } |
83 | 83 | .ghus-toc-icon svg, .ghus-toc-docs svg { pointer-events:none; }
|
84 | 84 | .ghus-toc-no-selection { -webkit-user-select:none !important; -moz-user-select:none !important;
|
85 | 85 | user-select:none !important; }
|
|
325 | 325 | }
|
326 | 326 | }
|
327 | 327 | group = [];
|
328 |
| - on(container, "click", event => { |
329 |
| - // Allow doc link to work |
330 |
| - if (event.target.nodeName === "A") { |
331 |
| - return; |
332 |
| - } |
333 |
| - stopPropag(event); |
334 |
| - // click on icon, then target LI parent |
335 |
| - let els, name, indx; |
336 |
| - const el = event.target.parentElement; |
337 |
| - const collapse = el.classList.contains("collapsed"); |
338 |
| - if (event.target.classList.contains("ghus-toc-icon")) { |
339 |
| - if (event.shiftKey) { |
340 |
| - name = el.className.match(regex.header); |
341 |
| - els = name ? $$("." + name, container) : []; |
342 |
| - indx = els.length; |
343 |
| - while (indx--) { |
344 |
| - collapseChildren(els[indx], collapse); |
345 |
| - } |
346 |
| - } else { |
347 |
| - collapseChildren(el, collapse); |
| 328 | + } |
| 329 | + |
| 330 | + function toggleChildrenHandler(event) { |
| 331 | + // Allow doc link to work |
| 332 | + if (event.target.nodeName === "A") { |
| 333 | + return; |
| 334 | + } |
| 335 | + stopPropag(event); |
| 336 | + // click on icon, then target LI parent |
| 337 | + let els, name, indx; |
| 338 | + const el = event.target.closest("li"); |
| 339 | + const collapse = el?.classList.contains("collapsed"); |
| 340 | + if (event.target.classList.contains("ghus-toc-icon")) { |
| 341 | + if (event.shiftKey) { |
| 342 | + name = el.className.match(regex.header); |
| 343 | + els = name ? $$("." + name, container) : []; |
| 344 | + indx = els.length; |
| 345 | + while (indx--) { |
| 346 | + collapseChildren(els[indx], collapse); |
348 | 347 | }
|
349 |
| - removeSelection(); |
| 348 | + } else { |
| 349 | + collapseChildren(el, collapse); |
350 | 350 | }
|
351 |
| - }); |
| 351 | + removeSelection(); |
| 352 | + } |
352 | 353 | }
|
353 | 354 |
|
354 | 355 | function collapseChildren(el, collapse) {
|
|
453 | 454 | on($("h3", container), "dblclick", tocHide);
|
454 | 455 | // prevent container content selection
|
455 | 456 | on(container, "onselectstart", stopPropag);
|
| 457 | + on(container, "click", toggleChildrenHandler); |
456 | 458 | // keyboard shortcuts
|
457 | 459 | on(document, "keydown", keyboardCheck);
|
458 | 460 | // keep window relative to middle on resize
|
|
0 commit comments