content: generateStaticURLStyleTag

2 files changed, 15 insertions, 6 deletions

diff --git a/src/content/dependencies/generatePageLayout.js b/src/content/dependencies/generatePageLayout.js
index db5b0d71..4dc56dce 100644
--- a/src/content/dependencies/generatePageLayout.js
+++ b/src/content/dependencies/generatePageLayout.js
@@ -8,6 +8,7 @@ export default {
     'generateImageOverlay',
     'generatePageSidebar',
     'generateSearchSidebarBox',
+    'generateStaticURLStyleTag',
     'generateStickyHeadingContainer',
     'transformContent',
   ],
@@ -63,6 +64,9 @@ export default {
     relations.colorStyleTag =
       relation('generateColorStyleTag');
 
+    relations.staticURLStyleTag =
+      relation('generateStaticURLStyleTag');
+
     relations.imageOverlay =
       relation('generateImageOverlay');
 
@@ -598,11 +602,6 @@ export default {
           `    background-image: url("${to('media.path', 'bg.' + data.wikiWallpaperFileExtension)}");\n` +
           `}`);
 
-    const goshFrigginDarnitStyleRule =
-      `.image-media-link::after {\n` +
-      `    mask-image: url("${to('staticMisc.path', 'image.svg')}");\n` +
-      `}`;
-
     const numWallpaperParts =
       html.resolve(slots.styleRules, {normalize: 'string'})
         .match(/\.wallpaper-part:nth-child/g)
@@ -751,9 +750,10 @@ export default {
             relations.colorStyleTag
               .slot('color', slots.color ?? data.wikiColor),
 
+            relations.staticURLStyleTag,
+
             html.tag('style', [
               fallbackBackgroundStyleRule,
-              goshFrigginDarnitStyleRule,
               slots.styleRules,
             ]),
 
diff --git a/src/content/dependencies/generateStaticURLStyleTag.js b/src/content/dependencies/generateStaticURLStyleTag.js
new file mode 100644
index 00000000..276b0e34
--- /dev/null
+++ b/src/content/dependencies/generateStaticURLStyleTag.js
@@ -0,0 +1,9 @@
+export default {
+  extraDependencies: ['html', 'to'],
+
+  generate: ({html, to}) =>
+    html.tag('style', {class: 'static-url-style'},
+      `.image-media-link::after {\n` +
+      `    mask-image: url("${to('staticMisc.path', 'image.svg')}");\n` +
+      `}`),
+};