Update app.py

app.py

@@ -1,4 +1,4 @@
-import gradio as gr
+import gradio as gr 
 from transformers import MarianMTModel, MarianTokenizer
 
 # Charger le modèle et le tokenizer depuis Hugging Face
@@ -29,14 +29,17 @@ with gr.Blocks() as interface:
     </div>
     """)
 
-    # Créer une colonne sans l'argument `align` qui n'existe pas
+    # Créer une colonne
     with gr.Column():
         text_input = gr.Textbox(label="Entrez le texte à traduire", placeholder="Entrez le texte à traduire ici...", lines=3)
-        source_lang = gr.Dropdown(choices=["fr", "li"], label="Langue Source")
-        target_lang = gr.Dropdown(choices=["li", "fr"], label="Langue Cible")
+        
+        # Utilisation d'un Row pour mettre les deux Dropdown sur la même ligne
+        with gr.Row():
+            source_lang = gr.Dropdown(choices=["fr", "li"], label="Langue Source")
+            target_lang = gr.Dropdown(choices=["li", "fr"], label="Langue Cible")
+        
         translation_output = gr.Textbox(label="Traduction", placeholder="Le texte traduit s'affichera ici...")
         translate_button = gr.Button("Traduire")
-       
 
     # Lier le bouton au processus de traduction
     translate_button.click(
@@ -62,15 +65,18 @@ interface.css = """
        width:100%;
        flex-wrap: wrap;
     }
+    
+    /* Bouton avec couleur orangée */
     .gradio-button {
-        background-color: #4CAF50;
+        background-color: #FFA500;
         color: white;
         border-radius: 5px;
         border: none;
     }
     .gradio-button:hover {
-        background-color: #45a049;
+        background-color: #FF7F00;
     }
+
     .gr-markdown {
         font-family: 'Lobster', sans-serif;
         font-size: 24px;
@@ -79,6 +85,7 @@ interface.css = """
     .gradio-row {
         margin-top: 10px;
     }
+    
     /* Centrer la colonne et ajouter un style à la zone de texte */
     .gr-column {
         width: 50%;
@@ -89,11 +96,13 @@ interface.css = """
         background-color: #f9f9f9;
         box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
     }
+
     /* Appliquer un style pour le texte d'entrée */
     .gr-textbox {
         font-size: 16px;
         padding: 10px;
     }
+
     /* Appliquer un style pour la sortie de traduction */
     .gr-textbox[placeholder='Le texte traduit s\'affichera ici...'] {
         font-size: 16px;