Revert "Fix: restore bg image to body again (#5828)"

This reverts commit 06cf76d724.
This commit is contained in:
shamoon
2025-12-04 13:32:33 -08:00
parent 96ac9046b3
commit 874c0c6699
2 changed files with 41 additions and 39 deletions

View File

@@ -554,48 +554,38 @@ export default function Wrapper({ initialSettings, fallback }) {
html.classList.add(desiredThemeClass); html.classList.add(desiredThemeClass);
} }
if (backgroundImage) { // Remove any previously applied inline styles
const safeBackgroundImage = backgroundImage.replace(/'/g, "\\'"); body.style.backgroundImage = "";
body.style.backgroundImage = `linear-gradient(rgb(var(--bg-color) / ${opacity}), rgb(var(--bg-color) / ${opacity})), url('${safeBackgroundImage}')`; body.style.backgroundColor = "";
body.style.backgroundSize = "cover"; body.style.backgroundAttachment = "";
body.style.backgroundPosition = "center";
body.style.backgroundAttachment = "fixed";
body.style.backgroundRepeat = "no-repeat";
body.style.backgroundColor = "";
} else {
body.style.backgroundImage = "none";
body.style.backgroundColor = "rgb(var(--bg-color))";
body.style.backgroundSize = "";
body.style.backgroundPosition = "";
body.style.backgroundAttachment = "";
body.style.backgroundRepeat = "";
}
return () => {
body.style.backgroundImage = "";
body.style.backgroundColor = "";
body.style.backgroundSize = "";
body.style.backgroundPosition = "";
body.style.backgroundAttachment = "";
body.style.backgroundRepeat = "";
};
}, [backgroundImage, opacity, theme, color, initialSettings.color]); }, [backgroundImage, opacity, theme, color, initialSettings.color]);
return ( return (
<div id="page_wrapper" className="relative min-h-screen"> <>
<div {backgroundImage && (
id="inner_wrapper" <div
tabIndex="-1" id="background"
className={classNames( aria-hidden="true"
"w-full min-h-screen overflow-auto", style={{
backgroundBlur && backgroundImage: `linear-gradient(rgb(var(--bg-color) / ${opacity}), rgb(var(--bg-color) / ${opacity})), url('${backgroundImage}')`,
`backdrop-blur${initialSettings.background.blur?.length ? `-${initialSettings.background.blur}` : ""}`, }}
backgroundSaturate && `backdrop-saturate-${initialSettings.background.saturate}`, />
backgroundBrightness && `backdrop-brightness-${initialSettings.background.brightness}`, )}
)} <div id="page_wrapper" className="relative h-full">
> <div
<Index initialSettings={initialSettings} fallback={fallback} /> id="inner_wrapper"
tabIndex="-1"
className={classNames(
"w-full h-full overflow-auto",
backgroundBlur &&
`backdrop-blur${initialSettings.background.blur?.length ? `-${initialSettings.background.blur}` : ""}`,
backgroundSaturate && `backdrop-saturate-${initialSettings.background.saturate}`,
backgroundBrightness && `backdrop-brightness-${initialSettings.background.brightness}`,
)}
>
<Index initialSettings={initialSettings} fallback={fallback} />
</div>
</div> </div>
</div> </>
); );
} }

View File

@@ -30,6 +30,18 @@ body,
height: 100%; height: 100%;
margin: 0; margin: 0;
padding: 0; padding: 0;
background-color: rgb(var(--bg-color));
}
#background {
position: fixed;
inset: 0;
z-index: 0;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
background-attachment: scroll;
pointer-events: none;
} }
html, html,