Update app.py

app.py

@@ -62,17 +62,24 @@ def process_youtube_or_audio(url, uploaded_audio, start_time, end_time):
         print(f"Error: {e}")
         return None, None
 
-# Gradio
+# Gradio Interface
 with gr.Blocks() as interface:
     gr.HTML("""
         <h1 style="font-size: 2rem; text-align: center;"><i class="fas fa-music"></i>&nbsp;PYTR - Python YouTube Ringtones</h1>
         <p style="text-align: center;">Enter a YouTube URL or upload an audio file to create ringtones.</p>
         <p style="text-align: center;"><a href="https://ringtones.jessejesse.xyz">Ringtones</a> | <a href="https://github.com/sudo-self/pytr">GitHub</a></p>
+
+        <style>
+            #youtube-url, #uploaded-audio { width: 45%; }
+            #process-button { width: 100%; margin-top: 10px; background-color: #6a4cfc; color: white; border: none; border-radius: 5px; }
+            #mp3-download, #iphone-ringtone { width: 45%; }
+            #instructions { width: 100%; margin-top: 20px; }
+        </style>
     """)
 
     with gr.Row():
-        youtube_url = gr.Textbox(placeholder="Enter the URL here...", label="YouTube URL", style={"width": "45%"})
-        uploaded_audio = gr.File(label="Upload Audio File", type="filepath", style={"width": "45%"})
+        youtube_url = gr.Textbox(placeholder="Enter the URL here...", label="YouTube URL", elem_id="youtube-url")
+        uploaded_audio = gr.File(label="Upload Audio File", type="filepath", elem_id="uploaded-audio")
 
     gr.HTML("<h3 style='text-align: center;'>Trim Audio</h3>")
 
@@ -80,19 +87,19 @@ with gr.Blocks() as interface:
         start_time = gr.Slider(0, 20, value=0, label="Start Time (seconds)", style={"width": "45%"})
         end_time = gr.Slider(1, 20, value=20, label="End Time (seconds)", style={"width": "45%"})
     
-   
-    process_button = gr.Button("Create Ringtones", style={"width": "100%", "margin-top": "10px", "background-color": "#6a4cfc", "color": "white", "border": "none", "border-radius": "5px"})
+  
+    process_button = gr.Button("Create Ringtones", elem_id="process-button")
     
     with gr.Row():
-        mp3_download = gr.File(label="Android Ringtone", style={"width": "45%"})
-        iphone_ringtone = gr.File(label="iPhone Ringtone", style={"width": "45%"})
+        mp3_download = gr.File(label="Android Ringtone", elem_id="mp3-download")
+        iphone_ringtone = gr.File(label="iPhone Ringtone", elem_id="iphone-ringtone")
     
     with gr.Row():
         instructions = gr.Textbox(
             value="Android: move the download to the 'Ringtones' folder.\nApple: import download with 'Garage Band' and export to ringtones.",
             label="Install Ringtones",
             interactive=False,
-            style={"width": "100%", "margin-top": "20px"}
+            elem_id="instructions"
         )
 
     process_button.click(process_youtube_or_audio, inputs=[youtube_url, uploaded_audio, start_time, end_time], outputs=[mp3_download, iphone_ringtone])