From b0594fd510b2b8ea37c24f08db1aa1e3803c7f29 Mon Sep 17 00:00:00 2001 From: Flatlogic Bot Date: Sun, 15 Feb 2026 02:55:50 +0000 Subject: [PATCH] Auto commit: 2026-02-15T02:55:50.730Z --- index.php | 164 +++++++++++++----------------------------------------- 1 file changed, 38 insertions(+), 126 deletions(-) diff --git a/index.php b/index.php index 0f60dce..6d38fcb 100644 --- a/index.php +++ b/index.php @@ -407,36 +407,36 @@ $liveIndex = get_live_index($schedule); } .brand h1 { - font-size: 2.2rem; + font-size: 2.8rem; font-weight: 700; margin: 0 0 0.5rem; color: #fff; - letter-spacing: -0.03em; + letter-spacing: -0.04em; text-transform: lowercase; } .brand-logo { - width: 90px; + width: 110px; height: auto; - margin: 0 auto 1.5rem; + margin: 0 auto 2rem; display: block; filter: drop-shadow(0 10px 20px rgba(0,0,0,0.3)); } .brand p { - font-size: 0.8rem; + font-size: 0.95rem; font-weight: 300; - opacity: 0.4; - margin-bottom: 2.5rem; + opacity: 0.6; + margin-bottom: 3rem; letter-spacing: 0.1em; text-transform: uppercase; } .now-playing-container { - background: rgba(255, 255, 255, 0.01); - border-radius: 40px; - padding: 2.5rem 2rem; - border: 1px solid rgba(255, 255, 255, 0.04); + background: rgba(255, 255, 255, 0.02); + border-radius: 32px; + padding: 3rem 2rem; + border: 1px solid rgba(255, 255, 255, 0.05); margin-bottom: 2.5rem; position: relative; overflow: hidden; @@ -445,24 +445,24 @@ $liveIndex = get_live_index($schedule); .track-title { font-weight: 300; - font-size: 1.1rem; + font-size: 1.2rem; color: rgba(255, 255, 255, 0.9); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; letter-spacing: 0.02em; + position: relative; + z-index: 2; } .play-btn { width: 90px; height: 90px; border-radius: 50%; - background: rgba(255, 255, 255, 0.05); - backdrop-filter: blur(10px); - -webkit-backdrop-filter: blur(10px); - border: 1px solid rgba(255, 255, 255, 0.1); - color: #fff; - font-size: 2.5rem; + background: #fff; + border: none; + color: var(--bg-dark); + font-size: 3rem; cursor: pointer; display: flex; align-items: center; @@ -474,43 +474,40 @@ $liveIndex = get_live_index($schedule); .play-btn:hover { transform: scale(1.05); - background: rgba(255, 255, 255, 0.1); - border-color: var(--primary-color); - box-shadow: 0 0 40px rgba(56, 189, 248, 0.2); + box-shadow: 0 0 40px rgba(255, 255, 255, 0.2); } .play-btn.is-playing { - background: var(--primary-color); - color: #0f172a; - border-color: transparent; - box-shadow: 0 0 50px rgba(56, 189, 248, 0.4); - animation: pulse-primary 2s infinite; + background: #ff3d00; + color: #fff; + box-shadow: 0 0 50px rgba(255, 61, 0, 0.4); + animation: pulse-red 2s infinite; } - @keyframes pulse-primary { - 0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(56, 189, 248, 0.5); } - 70% { transform: scale(1.05); box-shadow: 0 0 0 20px rgba(56, 189, 248, 0); } - 100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(56, 189, 248, 0); } + @keyframes pulse-red { + 0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255, 61, 0, 0.7); } + 70% { transform: scale(1.05); box-shadow: 0 0 0 20px rgba(255, 61, 0, 0); } + 100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255, 61, 0, 0); } } .volume-container { width: 100%; - max-width: 160px; + max-width: 180px; display: flex; align-items: center; gap: 1.2rem; margin: 2.5rem auto 0; - opacity: 0.3; + opacity: 0.5; transition: opacity 0.3s ease; } .volume-container:hover { - opacity: 0.8; + opacity: 1; } .volume-slider { flex: 1; - height: 2px; + height: 3px; -webkit-appearance: none; background: rgba(255, 255, 255, 0.1); border-radius: 10px; @@ -519,52 +516,21 @@ $liveIndex = get_live_index($schedule); .volume-slider::-webkit-slider-thumb { -webkit-appearance: none; - width: 10px; - height: 10px; + width: 12px; + height: 12px; background: #fff; border-radius: 50%; } - .brand h1 { - font-size: 2.8rem; - font-weight: 700; - margin: 0 0 0.5rem; - color: #fff; - letter-spacing: -0.04em; - } - - .brand-logo { - width: 110px; - height: auto; - margin: 0 auto 2rem; - display: block; - } - - .brand p { - font-size: 0.95rem; - font-weight: 300; - opacity: 0.6; - margin-bottom: 3rem; - } - - .now-playing-container { - background: rgba(255, 255, 255, 0.02); - border-radius: 32px; - padding: 2rem; - border: 1px solid rgba(255, 255, 255, 0.05); - margin-bottom: 2.5rem; - position: relative; - overflow: hidden; - } - #visualizer { position: absolute; bottom: 0; left: 0; width: 100%; - height: 60px; - opacity: 0.6; + height: 80px; + opacity: 0.8; pointer-events: none; + z-index: 1; } .track-status { @@ -583,6 +549,8 @@ $liveIndex = get_live_index($schedule); width: fit-content; margin: 0 auto 1.2rem; border: 1px solid rgba(56, 189, 248, 0.15); + position: relative; + z-index: 2; } .live-dot { @@ -600,62 +568,6 @@ $liveIndex = get_live_index($schedule); 100% { transform: scale(1); opacity: 1; } } - .track-title { - font-weight: 400; - font-size: 1.2rem; - color: #f1f5f9; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - } - - .play-btn { - width: 84px; - height: 84px; - border-radius: 50%; - background: #fff; - border: none; - color: var(--bg-dark); - font-size: 2.8rem; - cursor: pointer; - display: flex; - align-items: center; - justify-content: center; - box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.4); - transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); - } - - .play-btn.is-playing { - background: #ff3d00; - color: #fff; - box-shadow: 0 0 30px rgba(255, 61, 0, 0.6); - animation: pulse-red 2s infinite; - } - - @keyframes pulse-red { - 0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255, 61, 0, 0.7); } - 70% { transform: scale(1.05); box-shadow: 0 0 0 20px rgba(255, 61, 0, 0); } - 100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255, 61, 0, 0); } - } - - .volume-container { - width: 100%; - max-width: 180px; - display: flex; - align-items: center; - gap: 1.2rem; - margin: 2rem auto; - opacity: 0.6; - } - - .volume-slider { - flex: 1; - height: 3px; - -webkit-appearance: none; - background: rgba(255, 255, 255, 0.2); - border-radius: 10px; - } - .payment-section { margin-top: 2rem; opacity: 0.5;