diff --git a/index.php b/index.php index 50aaa79..c60b568 100644 --- a/index.php +++ b/index.php @@ -31,9 +31,9 @@ $whatsapp_link = "https://wa.me/" . preg_replace('/[^0-9]/', '', $whatsapp_numbe :root { --accent-color: #00e676; /* WhatsApp Green */ --primary-color: #38bdf8; /* Sky Blue */ - --bg-overlay: rgba(15, 23, 42, 0.85); - --glass-bg: rgba(30, 41, 59, 0.7); - --glass-border: rgba(255, 255, 255, 0.1); + --bg-overlay: rgba(15, 23, 42, 0.5); /* More transparent overlay */ + --glass-bg: rgba(15, 23, 42, 0.3); /* Transparent card background */ + --glass-border: rgba(255, 255, 255, 0.2); } body, html { @@ -43,7 +43,7 @@ $whatsapp_link = "https://wa.me/" . preg_replace('/[^0-9]/', '', $whatsapp_numbe height: 100%; font-family: 'Inter', sans-serif; color: #ffffff; - background-color: #0f172a; + background-color: #000; overflow: hidden; } @@ -88,12 +88,12 @@ $whatsapp_link = "https://wa.me/" . preg_replace('/[^0-9]/', '', $whatsapp_numbe .glass-card { background: var(--glass-bg); - backdrop-filter: blur(16px); - -webkit-backdrop-filter: blur(16px); + backdrop-filter: blur(8px); + -webkit-backdrop-filter: blur(8px); border: 1px solid var(--glass-border); border-radius: 24px; padding: 2.5rem; - box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.5); + box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.3); } .brand h1 { @@ -195,6 +195,67 @@ $whatsapp_link = "https://wa.me/" . preg_replace('/[^0-9]/', '', $whatsapp_numbe cursor: pointer; } + /* Interaction Form */ + .interaction-form { + margin-top: 2rem; + display: flex; + flex-direction: column; + gap: 1rem; + text-align: left; + } + + .interaction-form label { + font-size: 0.85rem; + font-weight: 600; + margin-bottom: -0.5rem; + opacity: 0.9; + } + + .interaction-form input, + .interaction-form textarea { + width: 100%; + padding: 0.8rem; + border-radius: 12px; + border: 1px solid rgba(255, 255, 255, 0.2); + background-color: rgba(255, 255, 255, 0.9); /* Semi-transparent white */ + color: #0f172a; + font-family: inherit; + font-size: 0.95rem; + box-sizing: border-box; + outline: none; + transition: all 0.2s; + } + + .interaction-form textarea { + resize: none; + height: 80px; + } + + .interaction-form input::placeholder, + .interaction-form textarea::placeholder { + color: #64748b; + } + + .send-whatsapp-btn { + background-color: var(--accent-color); + color: #fff; + border: none; + padding: 0.8rem; + border-radius: 12px; + font-weight: 700; + cursor: pointer; + display: flex; + align-items: center; + justify-content: center; + gap: 0.5rem; + transition: transform 0.2s, background 0.2s; + } + + .send-whatsapp-btn:hover { + transform: translateY(-2px); + background-color: #00c853; + } + /* Right Side: Featured Image */ .image-section { flex: 1.2; @@ -235,7 +296,7 @@ $whatsapp_link = "https://wa.me/" . preg_replace('/[^0-9]/', '', $whatsapp_numbe width: 180px; height: 180px; margin: 1rem auto; - background: #fff; + background: rgba(255, 255, 255, 0.85); border-radius: 12px; display: flex; flex-direction: column; @@ -243,6 +304,7 @@ $whatsapp_link = "https://wa.me/" . preg_replace('/[^0-9]/', '', $whatsapp_numbe justify-content: center; color: #333; padding: 10px; + backdrop-filter: blur(4px); } .qr-placeholder i { @@ -341,6 +403,19 @@ $whatsapp_link = "https://wa.me/" . preg_replace('/[^0-9]/', '', $whatsapp_numbe + +
Apoya nuestro proyecto
@@ -390,6 +465,26 @@ $whatsapp_link = "https://wa.me/" . preg_replace('/[^0-9]/', '', $whatsapp_numbe audio.volume = val; } + function sendToWhatsApp() { + const name = document.getElementById('user-name').value; + const message = document.getElementById('user-message').value; + const phoneNumber = '5359177041'; + + if (!message.trim()) { + alert('Por favor, escribe un mensaje.'); + return; + } + + let finalMessage = `Hola Lili Records! `; + if (name.trim()) { + finalMessage += `Soy ${name}. `; + } + finalMessage += message; + + const url = `https://wa.me/${phoneNumber}?text=${encodeURIComponent(finalMessage)}`; + window.open(url, '_blank'); + } + // Fetch Now Playing Metadata from RadioKing async function updateMetadata() { try {