zv/wtr
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: calm down frontend visual system

Browse Source
This commit is contained in:
zv
2026-06-04 19:54:26 +02:00
parent 2aaa93e03f
commit 9395659f07
31 changed files with 255 additions and 188 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
components/weather/weather-effects.tsx
View File

@@ -33,12 +33,12 @@ export function WeatherEffects({ station, mood, precipitation10m, thunderstorm =
<motion.div
animate={reduceMotion ? undefined : { x: ["-4%", "5%", "-4%"], y: [0, 8, 0], scale: [1, 1.05, 1] }}
transition={{ duration: 18, repeat: Infinity, ease: "easeInOut" }}
className="absolute -left-24 -top-20 h-52 w-[78%] rounded-[50%] bg-slate-100/30 blur-3xl"
className="absolute -left-24 -top-20 h-52 w-[78%] rounded-full bg-slate-100/25 blur-2xl"
/>
<motion.div
animate={reduceMotion ? undefined : { x: ["8%", "-5%", "8%"], y: [0, -6, 0], scale: [1.04, 1, 1.04] }}
transition={{ duration: 22, repeat: Infinity, ease: "easeInOut" }}
className="absolute -right-24 top-0 h-60 w-[82%] rounded-[50%] bg-slate-300/24 blur-3xl"
className="absolute -right-24 top-0 h-60 w-[82%] rounded-full bg-slate-300/20 blur-2xl"
/>
<div className="absolute inset-x-0 bottom-0 h-44 bg-gradient-to-t from-slate-100/25 via-slate-200/10 to-transparent" />
<div className="absolute inset-x-0 top-0 h-32 bg-gradient-to-b from-slate-950/15 to-transparent" />
@@ -48,7 +48,7 @@ export function WeatherEffects({ station, mood, precipitation10m, thunderstorm =
<motion.div
animate={reduceMotion ? undefined : { scale: [1, 1.08, 1], opacity: [0.4, 0.58, 0.4] }}
transition={{ duration: 7, repeat: Infinity, ease: "easeInOut" }}
className="absolute -right-16 -top-20 size-64 rounded-full bg-amber-200/45 blur-3xl"
className="absolute -right-12 -top-16 size-52 rounded-full bg-amber-200/25 blur-2xl"
/>
)}
{mood === "night" && stars.map((star, index) => (
@@ -88,7 +88,7 @@ export function WeatherEffects({ station, mood, precipitation10m, thunderstorm =
/>
)}
{mood === "cold" && (
<div className="absolute inset-x-0 bottom-0 h-28 bg-gradient-to-t from-cyan-100/20 to-transparent" />
<div className="absolute inset-x-0 bottom-0 h-28 bg-gradient-to-t from-blue-100/20 to-transparent" />
)}
</div>
);