https://pay-way.com/assets/ChristmasEffects-Cf-8atbA.js

1import{j as e}from"./motion-BqKRuDoq.js";import{r as n}from"./react-B8BH9zjJ.js";const x=()=>{const[o,l]=n.useState([]),[p,r]=n.useState(!1),[m,f]=n.useState([]);return n.useEffect(()=>{const a=[];for(let t=0;t<50;t++)a.push({id:t,left:Math.random()*100,size:Math.random()*4+2,duration:Math.random()*5+8,delay:Math.random()*10,opacity:Math.random()*.6+.4});l(a);const s=[];for(let t=0;t<20;t++)s.push({id:t,delay:t*.15,top:Math.random()*40-20,size:Math.random()*4+2});f(s);const i=setInterval(()=>{r(!0),setTimeout(()=>r(!1),1e4)},45e3);return setTimeout(()=>{r(!0),setTimeout(()=>r(!1),1e4)},5e3),()=>clearInterval(i)},[]),e.jsxs(e.Fragment,{children:[e.jsx("style",{children:`
2        @keyframes snowfall {
3          0% {
4            transform: translateY(-10px) rotate(0deg);
5          }
6          100% {
7            transform: translateY(100vh) rotate(360deg);
8          }
9        }
10
11        @keyframes sway {
12          0%, 100% {
13            transform: translateX(0);
14          }
15          50% {
16            transform: translateX(20px);
17          }
18        }
19
20        @keyframes santaFly {
21          0% {
22            transform: translateX(-300px) translateY(0);
23          }
24          20% {
25            transform: translateX(15vw) translateY(-25px);
26          }
27          40% {
28            transform: translateX(35vw) translateY(5px);
29          }
30          60% {
31            transform: translateX(55vw) translateY(-20px);
32          }
33          80% {
34            transform: translateX(75vw) translateY(0);
35          }
36          100% {
37            transform: translateX(calc(100vw + 300px)) translateY(-15px);
38          }
39        }
40
41        @keyframes bobbing {
42          0%, 100% {
43            transform: translateY(0) rotate(-2deg);
44          }
45          50% {
46            transform: translateY(-8px) rotate(2deg);
47          }
48        }
49
50        @keyframes sparkle {
51          0% {
52            opacity: 0;
53            transform: scale(0);
54          }
55          50% {
56            opacity: 1;
57            transform: scale(1);
58          }
59          100% {
60            opacity: 0;
61            transform: scale(0);
62          }
63        }
64
65        @keyframes twinkle {
66          0%, 100% {
67            opacity: 0.3;
68          }
69          50% {
70            opacity: 1;
71          }
72        }
73
74        .snowflake {
75          position: fixed;
76          top: -10px;
77          color: #a8d4ff;
78          text-shadow: 0 0 8px rgba(255, 255, 255, 0.9), 0 0 3px rgba(100, 180, 255, 0.8), 1px 1px 2px rgba(0, 0, 0, 0.3);
79          pointer-events: none;
80          z-index: 9999;
81          animation: snowfall linear infinite;
82        }
83
84        .santa-container {
85          position: fixed;
86          top: 15%;
87          left: 0;
88          z-index: 9998;
89          pointer-events: none;
90          animation: santaFly 10s ease-in-out forwards;
91        }
92
93        .santa-sleigh {
94          display: flex;
95          align-items: center;
96          animation: bobbing 1.5s ease-in-out infinite;
97          filter: drop-shadow(3px 5px 8px rgba(0, 0, 0, 0.4));
98        }
99
100        .sleigh-group {
101          display: flex;
102          align-items: center;
103          font-size: 48px;
104          line-height: 1;
105        }
106
107        .reindeer-lead {
108          margin-right: -15px;
109          transform: scaleX(-1);
110        }
111
112        .reindeer {
113          margin-right: -10px;
114          transform: scaleX(-1);
115        }
116
117        .santa-emoji {
118          font-size: 56px;
119          margin-right: -5px;
120        }
121
122        .sleigh-emoji {
123          font-size: 44px;
124          transform: scaleX(-1);
125        }
126
127        .sparkle-trail {
128          position: absolute;
129          right: 100%;
130          top: 50%;
131          transform: translateY(-50%);
132          display: flex;
133          gap: 8px;
134        }
135
136        .sparkle {
137          color: #ffd700;
138          text-shadow: 0 0 10px #ffd700, 0 0 20px #ffaa00, 0 0 30px #ff8800;
139          animation: sparkle 0.8s ease-in-out infinite, twinkle 0.5s ease-in-out infinite alternate;
140        }
141
142        .magic-dust {
143          position: absolute;
144          right: 100%;
145          top: 50%;
146          width: 150px;
147          height: 4px;
148          background: linear-gradient(to left, rgba(255, 215, 0, 0.8), rgba(255, 170, 0, 0.4), transparent);
149          border-radius: 2px;
150          filter: blur(2px);
151        }
152      `}),o.map(a=>{const s=["❄","❅","❆","·"],i=s[a.id%s.length];return e.jsx("div",{className:"snowflake",style:{left:`${a.left}%`,fontSize:`${a.size*3}px`,opacity:a.opacity,animationDuration:`${a.duration}s`,animationDelay:`${a.delay}s`},children:i},a.id)}),p&&e.jsx("div",{className:"santa-container",children:e.jsxs("div",{className:"santa-sleigh",children:[e.jsx("div",{className:"magic-dust"}),e.jsx("div",{className:"sparkle-trail",children:m.map(a=>e.jsx("span",{className:"sparkle",style:{animationDelay:`${a.delay}s`,fontSize:`${a.size+6}px`,marginTop:`${a.top}px`},children:"*"},a.id))}),e.jsxs("div",{className:"sleigh-group",children:[e.jsx("span",{className:"reindeer-lead",children:"🦌"}),e.jsx("span",{className:"reindeer",children:"🦌"}),e.jsx("span",{className:"santa-emoji",children:"🎅"}),e.jsx("span",{className:"sleigh-emoji",children:"🛷"})]})]})})]})};export{x as default};