Add Christmas theme and snow effects for December

Introduces a Christmas theme that activates in December, including themed colors, subtle background patterns, and snowflake effects on loading screens. Adds a reusable SnowLoader component and utility for December detection. Updates layout and loading components to conditionally apply decorations and styles only during December.
This commit is contained in:
g
2025-12-08 00:47:57 +00:00
parent 224342c410
commit e7fcfd63a2
10 changed files with 139 additions and 28 deletions

View File

@@ -4,6 +4,7 @@ import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { Skeleton } from "@/components/ui/skeleton";
import Layout from "@/components/layout/layout";
import { Loader2 } from "lucide-react";
import { SnowLoader } from "@/components/snow-loader";
export default function OrderDetailsLoading() {
return (
@@ -77,7 +78,8 @@ export default function OrderDetailsLoading() {
{/* Loading overlay */}
<div className="fixed inset-0 flex items-center justify-center bg-background/80 backdrop-blur-[2px] pointer-events-none">
<div className="flex flex-col items-center justify-center p-6 rounded-lg">
<SnowLoader className="z-0" count={30} />
<div className="flex flex-col items-center justify-center p-6 rounded-lg z-10 relative">
<Loader2 className="h-12 w-12 animate-spin text-primary mb-4" />
<p className="text-lg font-medium">Loading order details...</p>
</div>