content: generateWikiWallpaperStyleTag

2 files changed, 28 insertions, 7 deletions

diff --git a/src/content/dependencies/generatePageLayout.js b/src/content/dependencies/generatePageLayout.js
index f4dc6460..e0332c8e 100644
--- a/src/content/dependencies/generatePageLayout.js
+++ b/src/content/dependencies/generatePageLayout.js
@@ -10,6 +10,7 @@ export default {
     'generateSearchSidebarBox',
     'generateStaticURLStyleTag',
     'generateStickyHeadingContainer',
+    'generateWikiWallpaperStyleTag',
     'transformContent',
   ],
 
@@ -29,14 +30,12 @@ export default {
     wikiColor: wikiInfo.color,
     wikiName: wikiInfo.nameShort,
     canonicalBase: wikiInfo.canonicalBase,
-    wikiWallpaperFileExtension: wikiInfo.wikiWallpaperFileExtension,
   }),
 
   data: (sprawl) => ({
     wikiColor: sprawl.wikiColor,
     wikiName: sprawl.wikiName,
     canonicalBase: sprawl.canonicalBase,
-    wikiWallpaperFileExtension: sprawl.wikiWallpaperFileExtension,
   }),
 
   relations(relation, sprawl) {
@@ -67,6 +66,9 @@ export default {
     relations.staticURLStyleTag =
       relation('generateStaticURLStyleTag');
 
+    relations.wikiWallpaperStyleTag =
+      relation('generateWikiWallpaperStyleTag');
+
     relations.imageOverlay =
       relation('generateImageOverlay');
 
@@ -595,12 +597,10 @@ export default {
     const styleRulesCSS =
       html.resolve(slots.styleRules, {normalize: 'string'});
 
-    const fallbackBackgroundStyleRule =
+    const fallbackWallpaperStyleTag =
       (styleRulesCSS.match(/body::before[^}]*background-image:/)
         ? ''
-        : `body::before {\n` +
-          `    background-image: url("${to('media.path', 'bg.' + data.wikiWallpaperFileExtension)}");\n` +
-          `}`);
+        : relations.wikiWallpaperStyleTag);
 
     const numWallpaperParts =
       styleRulesCSS
@@ -753,8 +753,9 @@ export default {
 
             relations.staticURLStyleTag,
 
+            fallbackWallpaperStyleTag,
+
             html.tag('style', [
-              fallbackBackgroundStyleRule,
               slots.styleRules,
             ]),
 
diff --git a/src/content/dependencies/generateWikiWallpaperStyleTag.js b/src/content/dependencies/generateWikiWallpaperStyleTag.js
new file mode 100644
index 00000000..5c2a66c2
--- /dev/null
+++ b/src/content/dependencies/generateWikiWallpaperStyleTag.js
@@ -0,0 +1,20 @@
+export default {
+  extraDependencies: ['html', 'to', 'wikiData'],
+
+  sprawl: ({wikiInfo}) => ({
+    wikiWallpaperFileExtension: wikiInfo.wikiWallpaperFileExtension,
+  }),
+
+  data: (sprawl) => ({
+    path: [
+      'media.path',
+      'bg.' + sprawl.wikiWallpaperFileExtension,
+    ],
+  }),
+
+  generate: (data, {html, to}) =>
+    html.tag('style', {class: 'wiki-wallpaper-style'},
+      `body::before {\n` +
+      `    background-image: url("${to(...data.path)}");\n` +
+      `}`),
+};