mirror of
https://github.com/svemagie/blog-eleventy-indiekit.git
synced 2026-05-14 22:48:50 +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:
+7
-2
@@ -11,10 +11,10 @@ document.addEventListener("alpine:init", () => {
|
|||||||
|
|
||||||
init() {
|
init() {
|
||||||
const content = document.querySelector(".e-content");
|
const content = document.querySelector(".e-content");
|
||||||
if (!content) return;
|
if (!content) { this._hideWrapper(); return; }
|
||||||
|
|
||||||
const headings = content.querySelectorAll("h2[id], h3[id], h4[id]");
|
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) => ({
|
this.items = Array.from(headings).map((h) => ({
|
||||||
id: h.id,
|
id: h.id,
|
||||||
@@ -39,6 +39,11 @@ document.addEventListener("alpine:init", () => {
|
|||||||
headings.forEach((h) => this._observer.observe(h));
|
headings.forEach((h) => this._observer.observe(h));
|
||||||
},
|
},
|
||||||
|
|
||||||
|
_hideWrapper() {
|
||||||
|
const wrapper = this.$root.closest(".widget-collapsible");
|
||||||
|
if (wrapper) wrapper.style.display = "none";
|
||||||
|
},
|
||||||
|
|
||||||
destroy() {
|
destroy() {
|
||||||
if (this._observer) this._observer.disconnect();
|
if (this._observer) this._observer.disconnect();
|
||||||
},
|
},
|
||||||
|
|||||||
Reference in New Issue
Block a user