From 786e0e8014023d65f8b01d40ab5bf932877e96ff Mon Sep 17 00:00:00 2001 From: "(quasar) nebula" Date: Tue, 23 Dec 2025 18:36:22 -0400 Subject: content, css: generateWallpaperStyleTag: --box-opacity & friends --- .../dependencies/generateWallpaperStyleTag.js | 29 ++++++++++++++++++++++ 1 file changed, 29 insertions(+) (limited to 'src/content') diff --git a/src/content/dependencies/generateWallpaperStyleTag.js b/src/content/dependencies/generateWallpaperStyleTag.js index b89f01c2..200fd45a 100644 --- a/src/content/dependencies/generateWallpaperStyleTag.js +++ b/src/content/dependencies/generateWallpaperStyleTag.js @@ -1,5 +1,12 @@ import {empty, stitchArrays} from '#sugar'; +function findCSSProperty(property, properties) { + if (!properties) return null; + const regexp = new RegExp(String.raw`(?<=(?:^|;)\s*${property}: ).*?(?=;)`, 'ms' /* mad scrath */); + const match = properties.match(regexp); + return match?.[0] ?? null; +} + export default { relations: (relation) => ({ styleTag: @@ -7,6 +14,10 @@ export default { }), slots: { + wallpaperBrightness: { + validate: v => v.isNumber, + }, + singleWallpaperPath: { validate: v => v.strictArrayOf(v.isString), }, @@ -32,8 +43,16 @@ export default { attributes.add('class', 'wallpaper-style'); + let brightness = slots.wallpaperBrightness; + + const brightnessFrom = properties => { + const opacity = findCSSProperty('opacity', properties); + return Number(opacity) || null; + }; + if (empty(slots.wallpaperPartPaths)) { attributes.set('data-wallpaper-mode', 'one'); + brightness ||= brightnessFrom(slots.singleWallpaperStyle); rules.push({ select: 'body::before', @@ -45,6 +64,7 @@ export default { } else { attributes.set('data-wallpaper-mode', 'parts'); attributes.set('data-num-wallpaper-parts', slots.wallpaperPartPaths.length); + brightness ||= brightnessFrom(slots.wallpaperPartStyles[0]); stitchArrays({ path: slots.wallpaperPartPaths, @@ -67,6 +87,15 @@ export default { }); } + if (brightness) { + rules.push({ + select: ':root', + declare: [ + `--wallpaper-brightness: ${brightness};`, + ], + }); + } + relations.styleTag.setSlots({ attributes, rules, -- cgit 1.3.0-6-gf8a5