dominik/homepage-plus
1
0
Fork 0
mirror of https://github.com/DI0IK/homepage-plus.git synced 2025-07-07 06:08:48 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

fix hidden scrollbars

Browse source 
this was an adventure
This commit is contained in:
Ben Phelps 2022-09-30 23:34:48 +03:00
parent f52c6f3b41
commit de4ce73a9a
2 changed files with 40 additions and 35 deletions
Download patch file Download diff file Expand all files Collapse all files

27
src/pages/index.jsx
View file

@ -163,13 +163,6 @@ function Home({ initialSettings }) {
const { data: bookmarks } = useSWR("/api/bookmarks");
const { data: widgets } = useSWR("/api/widgets");
const wrappedStyle = {};
if (initialSettings && initialSettings.background) {
wrappedStyle.backgroundImage = `url(${initialSettings.background})`;
wrappedStyle.backgroundSize = "cover";
wrappedStyle.opacity = initialSettings.backgroundOpacity ?? 1;
}
useEffect(() => {
if (settings.language) {
i18n.changeLanguage(settings.language);
@ -191,7 +184,6 @@ function Home({ initialSettings }) {
{initialSettings.base && <base href={initialSettings.base} />}
{initialSettings.favicon && <link rel="icon" href={initialSettings.favicon} />}
</Head>
<div className="fixed w-screen h-screen m-0 p-0 z-0 pointer-events-none" style={wrappedStyle} />
<div className="relative container m-auto flex flex-col justify-between z-10">
<div className="flex flex-row flex-wrap m-8 pb-4 mt-10 border-b-2 border-theme-800 dark:border-theme-200 justify-between">
{widgets && (
@ -244,11 +236,27 @@ function Home({ initialSettings }) {
}
export default function Wrapper({ initialSettings, fallback }) {
const wrappedStyle = {};
if (initialSettings && initialSettings.background) {
// wrappedStyle.backgroundImage = `url(${initialSettings.background})`;
// wrappedStyle.backgroundSize = "cover";
const opacity = initialSettings.backgroundOpacity ?? 1;
const opacityValue = 1 - opacity;
wrappedStyle.backgroundImage = `
linear-gradient(
rgb(var(--bg-color) / ${opacityValue}),
rgb(var(--bg-color) / ${opacityValue})
),
url(${initialSettings.background})`;
wrappedStyle.backgroundPosition = "center";
wrappedStyle.backgroundSize = "cover";
}
return (
<div
id="page_wrapper"
className={classNames(
"relative w-full h-full",
"relative",
initialSettings.theme && initialSettings.theme,
initialSettings.color && `theme-${initialSettings.color}`
)}
@ -256,6 +264,7 @@ export default function Wrapper({ initialSettings, fallback }) {
<div
id="page_container"
className="fixed overflow-auto w-full h-full bg-theme-50 dark:bg-theme-800 transition-all"
style={wrappedStyle}
>
<Index initialSettings={initialSettings} fallback={fallback} />
</div>