Update app.py

app.py

@@ -4,10 +4,10 @@ from gtts import gTTS
 import os
 
 # Streamlit app
-st.title("Text Translator with Voice")
+st.title("Text Translator")
 
 # Input text
-user_text = st.text_input("Enter the text you want to translate:")
+user_text = st.text_area("Enter the text you want to translate:")
 
 # Define a dictionary of language codes and their full names
 language_names = {
@@ -46,21 +46,39 @@ def translate_text(text, target_language_code):
 st.subheader("Select the target language for translation:")
 selected_target_language = st.selectbox("Select a target language:", list(language_names.keys()))
 
-# Display the translated text and speak it
+# Display the translated text and audio as the user types
 if user_text:
     translated_text = translate_text(user_text, language_names[selected_target_language])
-    
-    # Apply advanced CSS for better display in a bordered box
-    styled_text = f'<div style="border: 2px solid #0072B5; padding: 10px; background-color: #E5E5E5; border-radius: 5px; color: black;">{translated_text}</div>'
-    st.markdown(styled_text, unsafe_allow_html=True)
-    
-    # Text-to-Speech (TTS) conversion and playback
+
+    # Display translated text with CSS
+    st.markdown(f'<div style="background-color: #f0f0f0; padding: 10px; border-radius: 5px;">'
+                f'<p style="font-size: 18px; color: #333;">Translated Text:</p>'
+                f'<p style="font-size: 24px; color: #0066cc;">{translated_text}</p>'
+                f'</div>', unsafe_allow_html=True)
+
+    # Convert the translated text to audio
     tts = gTTS(translated_text, lang=language_names[selected_target_language])
-    tts_file_path = "translated_audio.mp3"
-    tts.save(tts_file_path)
-    
-    # Play the TTS audio
-    st.audio(tts_file_path, format="audio/mp3")
-    
-    # Clean up the TTS audio file
-    os.remove(tts_file_path)
+    audio_file = "translated_audio.mp3"
+    tts.save(audio_file)
+
+    # Display the audio
+    st.audio(audio_file, format="audio/mp3")
+
+    # Remove the temporary audio file
+    os.remove(audio_file)
+
+# CSS for the "Speak" button
+speak_button_css = """
+    <style>
+        .st-ep::before {
+            content: "\1F50A";
+            font-size: 24px;
+            margin-right: 8px;
+        }
+    </style>
+"""
+
+# Speak button
+if st.button("Speak"):
+    st.markdown(speak_button_css, unsafe_allow_html=True)
+    st.audio(audio_file, format="audio/mp3")