diff --git a/app/globals.css b/app/globals.css index 8714e84..21ae24e 100644 --- a/app/globals.css +++ b/app/globals.css @@ -59,3 +59,8 @@ body { .window-shadow { box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2), 0 1px 3px rgba(0, 0, 0, 0.1); } + +.hide-native-cursor, +.hide-native-cursor * { + cursor: none; +} diff --git a/components/cursor-effect.tsx b/components/cursor-effect.tsx index 75b59f7..7826422 100644 --- a/components/cursor-effect.tsx +++ b/components/cursor-effect.tsx @@ -2,19 +2,39 @@ import { useEffect } from "react"; +const HIDE_CURSOR_CLASS = "hide-native-cursor"; +const JANUARY = 0; +const FEBRUARY = 1; +const DECEMBER = 11; + export default function CursorEffect() { useEffect(() => { let cursor: any; let isMounted = true; - import("cursor-effects").then((mod) => { - if (isMounted && mod?.trailingCursor) { - const TrailingCursor = mod.trailingCursor as any; + const currentMonth = new Date().getMonth(); + const isWinter = + currentMonth === DECEMBER || + currentMonth === JANUARY || + currentMonth === FEBRUARY; + + import("cursor-effects").then((effects) => { + if (!isMounted) return; + + if (!isWinter && effects?.trailingCursor) { + document.body.classList.add(HIDE_CURSOR_CLASS); + const TrailingCursor = effects.trailingCursor as any; cursor = new TrailingCursor(); + } else if (isWinter && effects?.snowflakeCursor) { + document.body.classList.remove(HIDE_CURSOR_CLASS); + const SnowflakeCursor = effects.snowflakeCursor as any; + cursor = new SnowflakeCursor(); } }); + return () => { isMounted = false; + document.body.classList.remove(HIDE_CURSOR_CLASS); if (cursor && typeof cursor.destroy === "function") { cursor.destroy(); }