Update app.py

app.py

@@ -9,11 +9,11 @@ language_options = {
     "Italian": "Helsinki-NLP/opus-mt-en-it",
     "Dutch": "Helsinki-NLP/opus-mt-en-nl",
     "Urdu": "Helsinki-NLP/opus-mt-en-ur",
-    "Punjabi": "Helsinki-NLP/opus-mt-en-pa",
-    "Pashto": "Helsinki-NLP/opus-mt-en-ps", 
+    "Punjabi": "Helsinki-NLP/opus-mt-en-pa",  # Punjabi language model
+    "Pashto": "Helsinki-NLP/opus-mt-en-ps",  # Pashto language model
+    # Add more languages as needed
 }
 
-
 # Function to load the model based on the selected language
 @st.cache_resource
 def load_model(model_name):
@@ -28,40 +28,47 @@ def translate_text(model, tokenizer, text):
     translated_text = tokenizer.decode(translated[0], skip_special_tokens=True)
     return translated_text
 
-# Streamlit app layout with dark color scheme
+# Streamlit app layout with dark gradient theme
 st.markdown("""
     <style>
         body {
-            background-color: #121212;
+            background: linear-gradient(to right, #0f0c29, #302b63, #24243e);  /* Dark gradient */
             color: #e0e0e0;
         }
         .stApp {
-            background-color: #121212;
+            background: linear-gradient(to right, #0f0c29, #302b63, #24243e); /* Dark gradient */
         }
         .css-1d391kg {
-            background-color: #1f1f1f;
+            background: linear-gradient(to bottom, #141e30, #243b55); /* Dark gradient for text area */
             color: #e0e0e0;
             border-radius: 10px;
             padding: 20px;
         }
         .stButton > button {
-            background-color: #1f1f1f;
+            background: linear-gradient(to right, #2c3e50, #4ca1af); /* Gradient for buttons */
             color: #e0e0e0;
-            border: 1px solid #333;
+            border: 1px solid #444;
         }
         .stButton > button:hover {
-            background-color: #333;
-            border: 1px solid #444;
+            background: linear-gradient(to right, #0f2027, #2c5364); /* Hover effect for buttons */
+            border: 1px solid #555;
         }
         .stTextArea textarea {
-            background-color: #1f1f1f;
+            background: linear-gradient(to bottom, #141e30, #243b55); /* Dark gradient for text input */
             color: #e0e0e0;
             border: 1px solid #333;
         }
+        .css-1r6slb0 {
+            background-color: #141e30 !important;  /* Sidebar background */
+            color: #e0e0e0;
+        }
+        .css-1cpxqw2 a {
+            color: #e0e0e0 !important;
+        }
     </style>
 """, unsafe_allow_html=True)
 
-# App title and subtitle with dark theme
+# App title and subtitle with dark gradient theme
 st.markdown("<h1 style='text-align: center; color: #e0e0e0;'>🌍 Polyglot Translator 🌍</h1>", unsafe_allow_html=True)
 st.markdown("<p style='text-align: center; color: #b0b0b0; font-size: 20px;'>Empowering You to Speak Any Language!</p>", unsafe_allow_html=True)
 
@@ -79,22 +86,4 @@ st.markdown("<h3 style='color: #e0e0e0;'>Enter text in English to translate:</h3
 text = st.text_area("", height=150)
 
 # Character count
-st.write(f"<p style='color: #e0e0e0;'>Character count: {len(text)}</p>", unsafe_allow_html=True)
-
-# Button to translate
-if st.button("Translate"):
-    if text:
-        # Show a spinner during the translation process
-        with st.spinner('Translating...'):
-            # Load model and tokenizer based on selected language
-            model_name = language_options[language]
-            model, tokenizer = load_model(model_name)
-            
-            # Perform translation
-            translated_text = translate_text(model, tokenizer, text)
-        
-        # Display the translation
-        st.markdown(f"<h3 style='color: #e0e0e0;'>Translated Text ({language}):</h3>", unsafe_allow_html=True)
-        st.success(translated_text)
-    else:
-        st.error("Please enter text to translate.")
+st.write(f"<p style='color: #e0