2 files changed, 49 insertions, 15 deletions

diff --git a/src/write/bind-utilities.js b/src/write/bind-utilities.js
index 6212b824..127afe2c 100644
--- a/src/write/bind-utilities.js
+++ b/src/write/bind-utilities.js
@@ -13,8 +13,8 @@ import {
   getCarouselHTML,
   getFlashGridHTML,
   getGridHTML,
-  getRevealStringFromTags,
-  getRevealStringFromWarnings,
+  getRevealStringFromArtTags,
+  getRevealStringFromContentWarningMessage,
   getThemeString,
   generateAdditionalFilesList,
   generateAdditionalFilesShortcut,
@@ -142,15 +142,15 @@ export function bindUtilities({
     fancifyURL: bound.fancifyURL,
   });
 
-  bound.getRevealStringFromWarnings = bindOpts(getRevealStringFromWarnings, {
+  bound.getRevealStringFromContentWarningMessage = bindOpts(getRevealStringFromContentWarningMessage, {
     html,
     language,
   });
 
-  bound.getRevealStringFromTags = bindOpts(getRevealStringFromTags, {
+  bound.getRevealStringFromArtTags = bindOpts(getRevealStringFromArtTags, {
     language,
 
-    getRevealStringFromWarnings: bound.getRevealStringFromWarnings,
+    getRevealStringFromContentWarningMessage: bound.getRevealStringFromContentWarningMessage,
   });
 
   bound.getArtistString = bindOpts(getArtistString, {
@@ -194,7 +194,7 @@ export function bindUtilities({
 
   bound.generateStickyHeadingContainer = bindOpts(generateStickyHeadingContainer, {
     [bindOpts.bindIndex]: 0,
-    getRevealStringFromTags: bound.getRevealStringFromTags,
+    getRevealStringFromArtTags: bound.getRevealStringFromArtTags,
     html,
     img: bound.img,
   });
@@ -217,7 +217,7 @@ export function bindUtilities({
     to,
     wikiData,
 
-    getRevealStringFromTags: bound.getRevealStringFromTags,
+    getRevealStringFromArtTags: bound.getRevealStringFromArtTags,
   });
 
   bound.generateInfoGalleryLinks = bindOpts(generateInfoGalleryLinks, {
@@ -238,7 +238,7 @@ export function bindUtilities({
     html,
     language,
 
-    getRevealStringFromTags: bound.getRevealStringFromTags,
+    getRevealStringFromArtTags: bound.getRevealStringFromArtTags,
   });
 
   bound.getAlbumGridHTML = bindOpts(getAlbumGridHTML, {
diff --git a/src/write/page-template.js b/src/write/page-template.js
index 6ed9fcf5..e4bd9774 100644
--- a/src/write/page-template.js
+++ b/src/write/page-template.js
@@ -5,7 +5,7 @@ import {getColors} from '../util/colors.js';
 
 import {
   getFooterLocalizationLinks,
-  getRevealStringFromWarnings,
+  getRevealStringFromContentWarningMessage,
   img,
 } from '../misc-templates.js';
 
@@ -49,6 +49,8 @@ export function generateDocumentHTML(pageInfo, {
   cachebust,
   defaultLanguage,
   developersComment,
+  generateCoverLink,
+  generateStickyHeadingContainer,
   getThemeString,
   language,
   languages,
@@ -74,6 +76,7 @@ export function generateDocumentHTML(pageInfo, {
     // missing properties are auto-filled, see below!
     body = {},
     banner = {},
+    cover = {},
     main = {},
     sidebarLeft = {},
     sidebarRight = {},
@@ -95,6 +98,11 @@ export function generateDocumentHTML(pageInfo, {
 
   main.classes ??= [];
   main.content ??= '';
+  main.headingMode ??= 'none';
+
+  cover.src ??= '';
+  cover.alt ??= '';
+  cover.artTags ??= [];
 
   sidebarLeft ??= {};
   sidebarRight ??= {};
@@ -139,13 +147,39 @@ export function generateDocumentHTML(pageInfo, {
     sidebarLeft.collapse !== false && sidebarRight.collapse !== false;
 
   const mainHTML =
-    main.content &&
-      html.tag('main',
+    html.tag('main', {
+      id: 'content',
+      class: main.classes,
+    }, [
+      ...html.fragment(
+          !title ?
+            null
+        : main.headingMode === 'sticky' ?
+            generateStickyHeadingContainer({
+              coverSrc: cover.src,
+              coverAlt: cover.alt,
+              coverArtTags: cover.artTags,
+              title,
+            })
+        : main.headingMode === 'static' ?
+            html.tag('h1', title)
+        : null),
+
+      ...html.fragment(
+        cover.src &&
+          generateCoverLink({
+            src: cover.src,
+            alt: cover.alt,
+            tags: cover.artTags,
+          })),
+
+      html.tag('div',
         {
-          id: 'content',
-          class: main.classes,
+          [html.onlyIfContent]: true,
+          class: 'main-content-container',
         },
-        main.content);
+        main.content),
+    ]);
 
   const footerHTML =
     html.tag('footer',
@@ -378,7 +412,7 @@ export function generateDocumentHTML(pageInfo, {
             src: '',
             link: true,
             square: true,
-            reveal: getRevealStringFromWarnings(
+            reveal: getRevealStringFromContentWarningMessage(
               html.tag('span', {class: 'info-card-art-warnings'}),
               {html, language}),
           })),