Gameshow Countdown

\n {Object.entries(countdown).map(([label, value]) => (\n

\n {value}\n {label}\n

\n ))}\n

\n );\n}\n\nfunction LiveResultsSection() {\n const [results, setResults] = useState([\n { name: \"Rahul Kumar\", points: 850, rank: 1 },\n { name: \"Priya Sharma\", points: 725, rank: 2 },\n { name: \"Amit Patel\", points: 680, rank: 3 },\n { name: \"Sneha Gupta\", points: 620, rank: 4 },\n { name: \"Vikram Singh\", points: 590, rank: 5 },\n ]);\n\n return (\n

🏆 Live Results

\n {results.map((result) => (\n

\n #{result.rank}\n {result.name}\n {result.points} pts\n

\n ))}\n

\n );\n}\n\nfunction LastWinnersSection() {\n const [winners, setWinners] = useState([\n {\n season: \"Season 2023\",\n winner: \"Rahul Kumar\",\n prize: \"₹50 Lakh\",\n age: 28,\n city: \"Mumbai\",\n profession: \"Software Engineer\",\n profileImage:\n \"https://maxm-imggenurl.web.val.run/indian-male-professional-headshot-28-years-old-tech-professional\",\n },\n {\n season: \"Season 2022\",\n winner: \"Priya Sharma\",\n prize: \"₹40 Lakh\",\n age: 32,\n city: \"Delhi\",\n profession: \"Marketing Manager\",\n profileImage:\n \"https://maxm-imggenurl.web.val.run/indian-female-professional-headshot-32-years-old-corporate-leader\",\n },\n {\n season: \"Season 2021\",\n winner: \"Amit Patel\",\n prize: \"₹35 Lakh\",\n age: 25,\n city: \"Ahmedabad\",\n profession: \"Entrepreneur\",\n profileImage: \"https://maxm-imggenurl.web.val.run/indian-male-entrepreneur-headshot-25-years-old-startup-founder\",\n },\n {\n season: \"Season 2020\",\n winner: \"Sneha Gupta\",\n prize: \"₹30 Lakh\",\n age: 29,\n city: \"Bangalore\",\n profession: \"Data Scientist\",\n profileImage:\n \"https://maxm-imggenurl.web.val.run/indian-female-tech-professional-headshot-29-years-old-data-scientist\",\n },\n ]);\n\n return (\n

🏅 Past Winners

\n {winners.map((winner) => (\n

{winner.season}

\n \n

{winner.winner}

\n 🎂 {winner.age} years\n 🏙️ {winner.city}\n 💼 {winner.profession}\n

\n {winner.prize} Prize\n

\n ))}\n

\n );\n}\n\nfunction App() {\n const [backgroundVariant, setBackgroundVariant] = useState(0);\n const [currentSection, setCurrentSection] = useState(\"home\");\n const [countdown, setCountdown] = useState({\n days: 0,\n hours: 0,\n minutes: 0,\n seconds: 0,\n });\n\n const gameShowDate = new Date(\"2024-12-31T00:00:00Z\");\n\n useEffect(() => {\n const backgroundInterval = setInterval(() => {\n setBackgroundVariant(prev => (prev + 1) % 3);\n }, 5000);\n\n const countdownInterval = setInterval(() => {\n const now = new Date();\n const difference = gameShowDate.getTime() - now.getTime();\n\n const days = Math.floor(difference / (1000 * 60 * 60 * 24));\n const hours = Math.floor((difference % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));\n const minutes = Math.floor((difference % (1000 * 60 * 60)) / (1000 * 60));\n const seconds = Math.floor((difference % (1000 * 60)) / 1000);\n\n setCountdown({ days, hours, minutes, seconds });\n }, 1000);\n\n return () => {\n clearInterval(backgroundInterval);\n clearInterval(countdownInterval);\n };\n }, []);\n\n const renderSection = () => {\n switch (currentSection) {\n case \"home\":\n return ;\n case \"live-results\":\n return ;\n case \"winners\":\n return ;\n default:\n return ;\n }\n };\n\n return (\n

Yeh To Hoga

\n \n

\n\n {renderSection()}\n

\n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\nif (typeof document !== \"undefined\") { client(); }\n\nexport default async function server(request: Request): Promise {\n return new Response(\n `\n \n \n Yeh To Hoga Gameshow\n \n \n \n \n \n

\n \n \n \n \n `,\n {\n headers: { \"content-type\": \"text/html\" },\n },\n );\n}\n\nconst css = `\n:root {\n --deep-black: #0d0d1a;\n --electric-blue: #00e5ff;\n --neon-red: #ff1744;\n --neon-purple: #7c4dff;\n --cyber-gradient-1: linear-gradient(45deg, #ff1744, #7c4dff);\n --cyber-gradient-2: linear-gradient(135deg, #00e5ff, #ff1744);\n --cyber-gradient-3: linear-gradient(225deg, #7c4dff, #00e5ff);\n}\n\n* {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n scrollbar-width: thin;\n scrollbar-color: var(--neon-red) var(--deep-black);\n}\n\nbody {\n background-color: var(--deep-black);\n color: #e0e0e0;\n font-family: 'Space Grotesk', 'Arial', sans-serif;\n line-height: 1.6;\n overflow-x: hidden;\n}\n\n.game-show-platform {\n max-width: 1400px;\n margin: 0 auto;\n background: rgba(13,13,26,0.9);\n border-radius: 20px;\n box-shadow: \n 0 15px 35px rgba(255,23,68,0.2),\n 0 5px 15px rgba(124,77,255,0.1);\n overflow: hidden;\n position: relative;\n transition: background 2s ease;\n min-height: 100vh;\n}\n\n.game-show-platform.background-variant-0 {\n background-image: \n radial-gradient(ellipse at top, rgba(255,23,68,0.1) 0%, transparent 50%),\n radial-gradient(ellipse at bottom, rgba(124,77,255,0.1) 0%, transparent 50%);\n}\n\n.game-show-platform.background-variant-1 {\n background-image: \n radial-gradient(ellipse at top right, rgba(0,229,255,0.1) 0%, transparent 50%),\n radial-gradient(ellipse at bottom left, rgba(124,77,255,0.1) 0%, transparent 50%);\n}\n\n.game-show-platform.background-variant-2 {\n background-image: \n radial-gradient(ellipse at top left, rgba(124,77,255,0.1) 0%, transparent 50%),\n radial-gradient(ellipse at bottom right, rgba(255,23,68,0.1) 0%, transparent 50%);\n}\n\nheader {\n background: rgba(0,0,0,0.7);\n backdrop-filter: blur(15px);\n padding: 20px 40px;\n display: flex;\n justify-content: space-between;\n align-items: center;\n border-bottom: 2px solid transparent;\n border-image: var(--cyber-gradient-2) 1;\n}\n\n.logo {\n font-size: 2.5em;\n font-weight: bold;\n background: var(--cyber-gradient-1);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n text-shadow: 0 0 20px rgba(255,23,68,0.5);\n transition: transform 0.3s ease;\n}\n\nnav {\n display: flex;\n gap: 20px;\n}\n\nnav button {\n background: transparent;\n border: 2px solid var(--neon-red);\n color: var(--electric-blue);\n padding: 12px 25px;\n border-radius: 12px;\n text-transform: uppercase;\n letter-spacing: 1.5px;\n font-weight: bold;\n position: relative;\n overflow: hidden;\n transition: all 0.3s ease;\n cursor: pointer;\n}\n\nnav button:hover {\n background: var(--neon-red);\n color: white;\n box-shadow: 0 0 25px var(--neon-red);\n transform: scale(1.05);\n}\n\n.last-winners-section {\n padding: 40px;\n text-align: center;\n}\n\n.last-winners-section h2 {\n background: var(--cyber-gradient-1);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n margin-bottom: 30px;\n font-size: 2.5em;\n}\n\n.winners-list {\n display: flex;\n justify-content: center;\n gap: 30px;\n flex-wrap: wrap;\n}\n\n.winner-profile-card {\n background: rgba(124,77,255,0.1);\n border: 2px solid var(--neon-purple);\n border-radius: 15px;\n width: 280px;\n overflow: hidden;\n transition: all 0.3s ease;\n box-shadow: 0 10px 30px rgba(124,77,255,0.2);\n}\n\n.winner-profile-card:hover {\n transform: scale(1.05);\n box-shadow: 0 15px 40px rgba(124,77,255,0.3);\n}\n\n.winner-profile-header {\n position: relative;\n height: 250px;\n}\n\n.winner-season {\n position: absolute;\n top: 10px;\n left: 10px;\n background: var(--cyber-gradient-2);\n color: white;\n padding: 5px 10px;\n border-radius: 5px;\n z-index: 10;\n}\n\n.winner-profile-image {\n width: 100%;\n height: 100%;\n object-fit: cover;\n filter: grayscale(20%) contrast(120%);\n transition: transform 0.3s ease;\n}\n\n.winner-profile-card:hover .winner-profile-image {\n transform: scale(1.1);\n}\n\n.winner-profile-details {\n padding: 20px;\n background: rgba(0,0,0,0.2);\n}\n\n.winner-name {\n font-size: 1.8em;\n margin-bottom: 15px;\n background: var(--cyber-gradient-1);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n}\n\n.winner-info {\n display: flex;\n justify-content: space-between;\n margin-bottom: 15px;\n color: var(--electric-blue);\n}\n\n.winner-info span {\n display: flex;\n align-items: center;\n gap: 5px;\n}\n\n.winner-prize-banner {\n background: var(--cyber-gradient-2);\n padding: 10px;\n border-radius: 5px;\n text-align: center;\n}\n\n.winner-prize {\n color: white;\n font-weight: bold;\n text-transform: uppercase;\n}\n\n@media (max-width: 768px) {\n .winners-list {\n flex-direction: column;\n align-items: center;\n }\n}\n`;","deleted","label",[99],"permalink","https://www.val.town/x/starcoins/ssb/code/main.tsx","extension","actionData","errors"]