From 4a1997b0edd7de4b124c17e3cdeb1a47ecea1095 Mon Sep 17 00:00:00 2001
From: "(quasar) nebula" <qznebula@protonmail.com>
Date: Sat, 3 Dec 2022 21:28:15 -0400
Subject: sticky subheadings

---
 src/page/album-commentary.js | 30 ++++++++++++++++++++----------
 1 file changed, 20 insertions(+), 10 deletions(-)

(limited to 'src/page/album-commentary.js')

diff --git a/src/page/album-commentary.js b/src/page/album-commentary.js
index 50a2aa3..9004002 100644
--- a/src/page/album-commentary.js
+++ b/src/page/album-commentary.js
@@ -21,6 +21,7 @@ export function write(album) {
     type: 'page',
     path: ['albumCommentary', album.directory],
     page: ({
+      generateStickyHeadingContainer,
       getAlbumStylesheet,
       getLinkThemeString,
       getThemeString,
@@ -35,23 +36,32 @@ export function write(album) {
 
       main: {
         content: html.tag('div', {class: 'long-content'}, [
-          html.tag('h1', language.$('albumCommentaryPage.title', {
-            album: link.album(album),
-          })),
-          html.tag('p', language.$('albumCommentaryPage.infoLine', {
-            words: html.tag('b', language.formatWordCount(words, {unit: true})),
-            entries: html.tag('b', language.countCommentaryEntries(entries.length, {unit: true})),
-          })),
+          generateStickyHeadingContainer(
+            language.$('albumCommentaryPage.title', {
+              album: link.album(album),
+            })),
+
+          html.tag('p',
+            language.$('albumCommentaryPage.infoLine', {
+              words: html.tag('b', language.formatWordCount(words, {unit: true})),
+              entries: html.tag('b', language.countCommentaryEntries(entries.length, {unit: true})),
+            })),
+
           ...html.fragment(album.commentary && [
-            html.tag('h3', language.$('albumCommentaryPage.entry.title.albumCommentary')),
-            html.tag('blockquote', transformMultiline(album.commentary)),
+            html.tag('h3',
+              {class: ['content-heading']},
+              language.$('albumCommentaryPage.entry.title.albumCommentary')),
+            html.tag('blockquote',
+              transformMultiline(album.commentary)),
           ]),
+
           ...album.tracks.filter(t => t.commentary).flatMap(track => [
             html.tag('h3',
-              {id: 'track.directory'},
+              {id: 'track.directory', class: ['content-heading']},
               language.$('albumCommentaryPage.entry.title.trackCommentary', {
                 track: link.track(track),
               })),
+
             html.tag('blockquote',
               {style: getLinkThemeString(track.color)},
               transformMultiline(track.commentary)),
-- 
cgit 1.3.0-6-gf8a5