function MainComponent() { const [timeLeft, setTimeLeft] = React.useState({ days: 0, hours: 0, minutes: 0, seconds: 0 }); const [isValentines, setIsValentines] = React.useState(false); React.useEffect(()=>{ document.title = "JayceePEETV - Valentine's Day Special"; const link = document.createElement("link"); link.type = "image/svg+xml"; link.rel = "icon"; link.href = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1NzYgNTEyIj48cGF0aCBkPSJNMCAxMjhDMCA5Mi43IDI4LjcgNjQgNjQgNjRIMzIwYzM1LjMgMCA2NCAyOC43IDY0IDY0VjM4NGMwIDM1LjMtMjguNyA2NC02NCA2NEg2NGMtMzUuMyAwLTY0LTI4LjctNjQtNjRWMTI4ek01NTkuMSA5OS44YzEwLjQgNS42IDE2LjkgMTYuNCAxNi45IDI4LjJWMzg0YzAgMTEuOC02LjUgMjIuNi0xNi45IDI4LjJzLTIzIDUtMzIuOS0xLjZsLTk2LTY0TDQxNiAzMzcuMVYxNzQuOWwxNC4yLTkuNSA5Ni02NGM5LjgtNi41IDIyLjQtNy4yIDMyLjktMS42eiIvPjwvc3ZnPg=="; document.head.appendChild(link); const timer = setInterval(()=>{ const valentines = new Date("February 14, 2025 00:00:00").getTime(); const now = new Date().getTime(); const distance = valentines - now; if (distance < 0) { setIsValentines(true); clearInterval(timer); } else { setTimeLeft({ days: Math.floor(distance / (1000 * 60 * 60 * 24)), hours: Math.floor(distance % (1000 * 60 * 60 * 24) / (1000 * 60 * 60)), minutes: Math.floor(distance % (1000 * 60 * 60) / (1000 * 60)), seconds: Math.floor(distance % (1000 * 60) / 1000) }); } }, 1000); return ()=>{ if (document.head.contains(link)) { document.head.removeChild(link); } clearInterval(timer); }; }, []); return /*#__PURE__*/ React.createElement("div", { className: "w-full", __source: { fileName: "", lineNumber: 49, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-[#1a1a1a] text-white py-8 text-center border-b-4 border-gradient snowfall-container relative overflow-hidden", __source: { fileName: "", lineNumber: 50, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-center gap-4 mb-2", __source: { fileName: "", lineNumber: 51, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-4xl", __source: { fileName: "", lineNumber: 52, columnNumber: 11 }, __self: this }, "🎀 🎀"), /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-bold text-red-500", __source: { fileName: "", lineNumber: 53, columnNumber: 11 }, __self: this }, "Tik Tok Album"), /*#__PURE__*/ React.createElement("span", { className: "text-4xl", __source: { fileName: "", lineNumber: 54, columnNumber: 11 }, __self: this }, "🎀 🎀")), /*#__PURE__*/ React.createElement("h2", { className: "text-3xl mb-2 text-green-400", __source: { fileName: "", lineNumber: 56, columnNumber: 9 }, __self: this }, "FALL DROP 2025: EXCLUSIVE ON WEBSITE"), /*#__PURE__*/ React.createElement("h3", { className: "text-2xl mb-4 text-blue-400", __source: { fileName: "", lineNumber: 59, columnNumber: 9 }, __self: this }, "(www.jayceepeegospel.com)"), isValentines ? /*#__PURE__*/ React.createElement("h3", { className: "text-3xl mb-6 text-red-500 font-bold", __source: { fileName: "", lineNumber: 63, columnNumber: 11 }, __self: this }, "Written by Jayceepee 2025") : /*#__PURE__*/ React.createElement("div", { className: "flex justify-center gap-4 mb-6", __source: { fileName: "", lineNumber: 67, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-[#2a2a2a] p-3 rounded-lg shadow-lg", __source: { fileName: "", lineNumber: 68, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-2xl font-bold text-red-500", __source: { fileName: "", lineNumber: 69, columnNumber: 15 }, __self: this }, timeLeft.days), /*#__PURE__*/ React.createElement("div", { className: "text-sm text-gray-300", __source: { fileName: "", lineNumber: 72, columnNumber: 15 }, __self: this }, "Days")), /*#__PURE__*/ React.createElement("div", { className: "bg-[#2a2a2a] p-3 rounded-lg shadow-lg", __source: { fileName: "", lineNumber: 74, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-2xl font-bold text-red-500", __source: { fileName: "", lineNumber: 75, columnNumber: 15 }, __self: this }, timeLeft.hours), /*#__PURE__*/ React.createElement("div", { className: "text-sm text-gray-300", __source: { fileName: "", lineNumber: 78, columnNumber: 15 }, __self: this }, "Hours")), /*#__PURE__*/ React.createElement("div", { className: "bg-[#2a2a2a] p-3 rounded-lg shadow-lg", __source: { fileName: "", lineNumber: 80, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-2xl font-bold text-red-500", __source: { fileName: "", lineNumber: 81, columnNumber: 15 }, __self: this }, timeLeft.minutes), /*#__PURE__*/ React.createElement("div", { className: "text-sm text-gray-300", __source: { fileName: "", lineNumber: 84, columnNumber: 15 }, __self: this }, "Minutes")), /*#__PURE__*/ React.createElement("div", { className: "bg-[#2a2a2a] p-3 rounded-lg shadow-lg", __source: { fileName: "", lineNumber: 86, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-2xl font-bold text-red-500", __source: { fileName: "", lineNumber: 87, columnNumber: 15 }, __self: this }, timeLeft.seconds), /*#__PURE__*/ React.createElement("div", { className: "text-sm text-gray-300", __source: { fileName: "", lineNumber: 90, columnNumber: 15 }, __self: this }, "Seconds")))), /*#__PURE__*/ React.createElement("div", { className: "w-full h-auto mx-auto block", __source: { fileName: "", lineNumber: 95, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative min-h-[200px] overflow-hidden h-[calc(100vh-200px)]", __source: { fileName: "", lineNumber: 96, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("iframe", { allow: "autoplay", allowFullScreen: true, className: "m-0 border-none absolute top-0 left-0 w-full h-full overflow-hidden", src: "https://www.youtube.com/embed/frsHbhU6B9E?autoplay=1&loop=1&playlist=frsHbhU6B9E", __source: { fileName: "", lineNumber: 97, columnNumber: 11 }, __self: this }))), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 105, columnNumber: 7 }, __self: this }, ` .snowfall-container::before, .snowfall-container::after { content: ''; position: absolute; top: -10px; left: 0; width: 100%; height: 100%; pointer-events: none; } .snowfall-container::before { background: radial-gradient(circle, rgba(239,68,68,0.15) 2px, transparent 2px) 0 0, radial-gradient(circle, rgba(74,222,128,0.15) 2px, transparent 2px) 15px 15px, radial-gradient(circle, rgba(234,179,8,0.15) 2px, transparent 2px) 30px 30px; background-size: 45px 45px; animation: confetti 12s linear infinite; } .snowfall-container::after { background: radial-gradient(circle, rgba(239,68,68,0.1) 1px, transparent 1px) 10px 10px, radial-gradient(circle, rgba(74,222,128,0.1) 1px, transparent 1px) 25px 25px, radial-gradient(circle, rgba(234,179,8,0.1) 1px, transparent 1px) 40px 40px; background-size: 45px 45px; animation: confetti 8s linear infinite; } @keyframes confetti { 0% { transform: translateY(-10px) rotate(0deg); } 100% { transform: translateY(100%) rotate(45deg); } } .border-gradient { border-image: linear-gradient(to right, #ef4444, #4ade80) 1; } `)); }