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:
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user