[V0_FILE]typescriptreact:file="app/layout.tsx" isEdit="true" isMerged="true" import type React from "react" import type { Metadata } from "next" import { Poppins } from "next/font/google" import "./globals.css" const poppins = Poppins({ weight: ["400", "600", "700"], subsets: ["latin"], display: "swap", }) export const metadata: Metadata = { title: "Radio UPA - Donde el rock crece", description: "Escucha Radio UPA en vivo - Donde el rock crece", } export default function RootLayout({ children, }: Readonly<{ children: React.ReactNode }>) { return ( {children} ) } [V0_FILE]css:file="app/globals.css" isEdit="true" isMerged="true" @tailwind base; @tailwind components; @tailwind utilities; :root { --foreground-rgb: 0, 0, 0; --background-start-rgb: 255, 255, 255; --background-end-rgb: 255, 255, 255; } body { color: rgb(var(--foreground-rgb)); background: linear-gradient(to bottom, transparent, rgb(var(--background-end-rgb))) rgb(var(--background-start-rgb)); } input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 20px; height: 20px; background: #6d28d9; border-radius: 50%; cursor: pointer; } input[type="range"]::-moz-range-thumb { width: 20px; height: 20px; background: #6d28d9; border-radius: 50%; cursor: pointer; } [V0_FILE]typescriptreact:file="app/manifest.ts" isEdit="true" isQuickEdit="true" isMerged="true" import type { MetadataRoute } from "next" export default function manifest(): MetadataRoute.Manifest { return { name: "Radio UPA", short_name: "Radio UPA", description: "Donde el rock crece", start_url: "/", display: "standalone", background_color: "#1e3a8a", theme_color: "#16a34a", icons: [ { src: "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/Logo%202020%20v2-7Okfo98ZGecAQjXkZ4ZXSVYfLkKnUm.png", sizes: "192x192", type: "image/png", }, { src: "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/Logo%202020%20v2-7Okfo98ZGecAQjXkZ4ZXSVYfLkKnUm.png", sizes: "512x512", type: "image/png", }, ], } } [V0_FILE]typescriptreact:file="app/page.tsx" isEdit="true" "use client" import type React from "react" import { useState, useRef, useEffect } from "react" import Image from "next/image" import Link from "next/link" import { Instagram } from "lucide-react" import { Button } from "@/components/ui/button" import { Card } from "@/components/ui/card" export default function RadioApp() { const [isPlaying, setIsPlaying] = useState(false) const [volume, setVolume] = useState(0.8) const audioRef = useRef(null) useEffect(() => { audioRef.current = new Audio("https://server.laradio.online/proxy/gustavo_waingortin?mp=/stream") audioRef.current.volume = volume return () => { if (audioRef.current) { audioRef.current.pause() audioRef.current.src = "" } } }, [volume]) const togglePlayPause = () => { if (audioRef.current) { if (isPlaying) { audioRef.current.pause() } else { audioRef.current.play().catch((error) => { console.error("Error playing audio:", error) }) } setIsPlaying(!isPlaying) } } const handleVolumeChange = (e: React.ChangeEvent) => { const newVolume = Number.parseFloat(e.target.value) setVolume(newVolume) if (audioRef.current) { audioRef.current.volume = newVolume } } return (

{/* Upa Nene Character */}

{/* Station Name and Slogan */}

R a d i o U P A

donde el rock crece

{/* Player Controls */}

Volumen:

{/* Instagram Link */} Síguenos en Instagram {/* Radio UPA Logo */}

) }

About

About