From f18ddd61d7430f82116b7f6003e68a548f39f766 Mon Sep 17 00:00:00 2001 From: "(quasar) nebula" Date: Wed, 7 Dec 2022 07:30:48 -0400 Subject: more sticky heading adjustments --- src/misc-templates.js | 6 +++++- src/page/static.js | 18 +++++++++++++----- src/static/client.js | 10 ++++++---- src/upd8.js | 5 +++++ 4 files changed, 29 insertions(+), 10 deletions(-) diff --git a/src/misc-templates.js b/src/misc-templates.js index 10422a2..d7b24fb 100644 --- a/src/misc-templates.js +++ b/src/misc-templates.js @@ -727,13 +727,17 @@ function unbound_generateStickyHeadingContainer({ html, img, + class: classes, coverSrc, coverAlt, coverTags, title, }) { return html.tag('div', - {class: 'content-sticky-heading-container'}, + {class: [ + 'content-sticky-heading-container', + coverSrc && 'has-cover', + ].concat(classes)}, [ html.tag('div', {class: 'content-sticky-heading-row'}, [ html.tag('h1', title), diff --git a/src/page/static.js b/src/page/static.js index 2a0f5e5..1689d16 100644 --- a/src/page/static.js +++ b/src/page/static.js @@ -10,15 +10,23 @@ export function write(staticPage) { const page = { type: 'page', path: ['staticPage', staticPage.directory], - page: ({html, transformMultiline}) => ({ + page: ({ + generateStickyHeadingContainer, + html, + transformMultiline, + }) => ({ title: staticPage.name, stylesheet: staticPage.stylesheet, main: { - content: html.tag('div', {class: 'long-content'}, [ - html.tag('h1', staticPage.name), - transformMultiline(staticPage.content), - ]), + content: [ + generateStickyHeadingContainer({ + class: ['long-content'], + title: staticPage.name, + }), + html.tag('div', {class: 'long-content'}, + transformMultiline(staticPage.content)), + ], }, nav: {simple: true}, diff --git a/src/static/client.js b/src/static/client.js index dcb3922..15f21fd 100644 --- a/src/static/client.js +++ b/src/static/client.js @@ -487,10 +487,12 @@ function updateStickyHeading() { } of stickyHeadingInfo) { let closestHeading = null; - if (contentCover.getBoundingClientRect().bottom < 0) { - stickyCoverContainer.classList.add('visible'); - } else { - stickyCoverContainer.classList.remove('visible'); + if (contentCover && stickyCoverContainer) { + if (contentCover.getBoundingClientRect().bottom < 0) { + stickyCoverContainer.classList.add('visible'); + } else { + stickyCoverContainer.classList.remove('visible'); + } } if (topOfViewInside(contentContainer)) { diff --git a/src/upd8.js b/src/upd8.js index bc574c6..f7abdcb 100755 --- a/src/upd8.js +++ b/src/upd8.js @@ -562,6 +562,11 @@ function transformMultiline(text, {parseAttributes, transformInline}) { ) { lineTag = ''; } + + // for sticky headings! + if (elementMatch) { + lineContent = lineContent.replace(/