Update app.py

app.py

@@ -24,9 +24,44 @@ voices = [
 def play_audio(file):
     return f"voices/{file}"
 
+# Custom CSS for styling and animations
+custom_css = """
+h2 {
+    text-align: center;
+    color: #ffffff;
+    font-size: 24px;
+    margin-bottom: 20px;
+}
+body {
+    background-color: #121212;
+    font-family: Arial, sans-serif;
+}
+.gr-box {
+    background: #1e1e1e;
+    border-radius: 10px;
+    padding: 15px;
+    text-align: center;
+}
+.play-btn {
+    background-color: #FF5722 !important;
+    color: white;
+    border-radius: 50px;
+    width: 100px;
+    height: 40px;
+    font-size: 14px;
+}
+.playing {
+    animation: pulse 1s infinite alternate;
+}
+@keyframes pulse {
+    0% { transform: scale(1); }
+    100% { transform: scale(1.1); }
+}
+"""
+
 # Create layout
-with gr.Blocks() as demo:
-    gr.Markdown("<h2 style='text-align: center;'>Human Like Voice on Pro Plan</h2>")
+with gr.Blocks(css=custom_css) as demo:
+    gr.Markdown("<h2>🎤 Human-Like Voices (Pro Plan)</h2>")
 
     # Grid layout (3 columns, 5 rows)
     for i in range(0, len(voices), 3):
@@ -36,9 +71,18 @@ with gr.Blocks() as demo:
                     voice = voices[i + j]
                     with gr.Column():
                         audio = gr.Audio(play_audio(voice["file"]), autoplay=False, elem_id=voice["name"])
-                        btn = gr.Button(f"▶ Play {voice['name']}")
+                        btn = gr.Button(f"▶ {voice['name']}", elem_classes="play-btn")
                         info = gr.Markdown(f"**{voice['name']}**<br>{voice['gender']} | {voice['country']}")
+                        
+                        def start_animation():
+                            return gr.update(elem_classes="playing")
+                        
+                        def stop_animation():
+                            return gr.update(elem_classes="")
+                        
                         btn.click(fn=play_audio, inputs=[], outputs=[audio])
+                        btn.click(fn=start_animation, inputs=[], outputs=[btn])
+                        audio.change(fn=stop_animation, inputs=[], outputs=[btn])
 
 # Launch the app
 demo.launch()