Update app.py

app.py

@@ -161,6 +161,16 @@ css = """
         div#upload_area > div.w-full > div {
             min-height: 9rem;
         }
+        #check_btn_1, #check_btn_2{
+            --tw-gradient-from: #4caf50;
+            --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
+            --tw-gradient-to: #4caf50;
+        }
+        #magic_btn_1, #magic_btn_2{
+            --tw-gradient-from: #f44336;
+            --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
+            --tw-gradient-to: #ff9800;
+        }
         div#spoken_lang textarea {
             font-size: 4em;
             line-height: 1em;
@@ -177,9 +187,11 @@ css = """
             margin-bottom: 20px;
         }
         #diffuse_btn {
-            font-size: 2em;
-            padding: 20px;
+            font-size: 1em;
             margin-bottom: 20px;
+            --tw-gradient-from: #4caf50;
+            --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
+            --tw-gradient-to: #4caf50;
         }
         #notice {
             padding: 20px 14px 10px;
@@ -236,8 +248,8 @@ with gr.Blocks(css=css) as demo:
                                         elem_id="record_btn"
                                     )
                     with gr.Row():
-                        audio_r_translate = gr.Button("Check Whisper first ? 👍")              
-                        audio_r_direct_sd = gr.Button("Magic Whisper › SD right now! 🤠")
+                        audio_r_translate = gr.Button("Check Whisper first ? 👍", elem_id="check_btn_1")              
+                        audio_r_direct_sd = gr.Button("Magic Whisper › SD right now!", elem_id="magic_btn_1")
             
             with gr.Tab(label="Upload audio input", elem_id="upload_tab"):
                 with gr.Column():
@@ -248,8 +260,8 @@ with gr.Blocks(css=css) as demo:
                                         elem_id="upload_area"
                                     )
                     with gr.Row():
-                        audio_u_translate = gr.Button("Check Whisper first ? 👍")              
-                        audio_u_direct_sd = gr.Button("Magic Whisper › SD right now! 🤠")
+                        audio_u_translate = gr.Button("Check Whisper first ? 👍", elem_id="check_btn_2")              
+                        audio_u_direct_sd = gr.Button("Magic Whisper › SD right now! 🤠", elem_id="magic_btn_2")
             
             with gr.Accordion(label="Stable Diffusion Settings", elem_id="sd_settings"):
                 with gr.Row():
@@ -278,8 +290,11 @@ with gr.Blocks(css=css) as demo:
                                         lines=4,
                                         elem_id="translated"
                                     )
-                diffuse_btn = gr.Button(value="OK, Diffuse this prompt !", elem_id="diffuse_btn")
-            
+                with gr.Row():
+                    clear_btn = gr.Button(value="Clear")
+                    diffuse_btn = gr.Button(value="OK, Diffuse this prompt !", elem_id="diffuse_btn")
+                    
+                    clear_btn.click(fn=lambda value: gr.update(value=""), inputs=clear_btn, outputs=translated_output)