mirror of
https://github.com/svemagie/blog-eleventy-indiekit.git
synced 2026-04-02 08:44:56 +02:00
fix: hide TOC widget wrapper when no headings found
When tocScanner finds no .e-content or fewer than 3 headings, hide the parent .widget-collapsible container so the empty collapsible chrome (header button, border) doesn't show. Confab-Link: http://localhost:8080/sessions/cc343b15-8d10-43cd-a48f-ca912eb79b83
This commit is contained in:
@@ -11,10 +11,10 @@ document.addEventListener("alpine:init", () => {
|
||||
|
||||
init() {
|
||||
const content = document.querySelector(".e-content");
|
||||
if (!content) return;
|
||||
if (!content) { this._hideWrapper(); return; }
|
||||
|
||||
const headings = content.querySelectorAll("h2[id], h3[id], h4[id]");
|
||||
if (headings.length < 3) return;
|
||||
if (headings.length < 3) { this._hideWrapper(); return; }
|
||||
|
||||
this.items = Array.from(headings).map((h) => ({
|
||||
id: h.id,
|
||||
@@ -39,6 +39,11 @@ document.addEventListener("alpine:init", () => {
|
||||
headings.forEach((h) => this._observer.observe(h));
|
||||
},
|
||||
|
||||
_hideWrapper() {
|
||||
const wrapper = this.$root.closest(".widget-collapsible");
|
||||
if (wrapper) wrapper.style.display = "none";
|
||||
},
|
||||
|
||||
destroy() {
|
||||
if (this._observer) this._observer.disconnect();
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user