koodiklinikka/koodiklinikka.fi
1
0
Fork 0
mirror of https://github.com/koodiklinikka/koodiklinikka.fi.git synced 2026-03-07 14:01:39 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: top fade should be calculated on first render too

Browse Source 
if page had been scrolled and refreshed the wrong initial value was used
This commit is contained in:
Petri Partio
2024-05-31 14:06:35 +03:00
parent ba41f50828
commit 93eba92f0c
2 changed files with 9 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
components/TopFade.tsx
View File

@@ -2,18 +2,18 @@
import { useEffect, useState } from 'react';
const calculatedBrightnessValue = () => {
if (window.scrollY > 200) return 0.5;
const amountToDecrease = (window.scrollY / 200) * 0.5;
return 1 - amountToDecrease;
};
export default function TopFade() {
const [brightness, setBrightness] = useState(1);
const [brightness, setBrightness] = useState(calculatedBrightnessValue());
const handleScroll = (event: Event) => {
if (window.scrollY > 200) {
if (brightness === 0.5) return;
setBrightness(0.5);
return;
}
const amountToDecrease = (window.scrollY / 200) * 0.5;
setBrightness(1 - amountToDecrease);
if (window.scrollY > 200 && brightness === 0.5) return;
setBrightness(calculatedBrightnessValue());
};
useEffect(() => {