update layout

app.py

@@ -41,25 +41,19 @@ article = """
 <br/>
 """
 
-extra_info = """
-<div style='text-align: center;'>
-    <h4>More information about the space</h4>
-</div>
-<p>
-    This is a variant of the M2M100 model, fine-tuned on a multilingual dataset to support translation from Northern Sotho (Sepedi) to English. The model was trained with a focus on improving translation accuracy for low-resource languages.
-</p>
-"""
-
 authors = """
 <div style='text-align: center;'>
-    Authors: Vukosi Marivate, Matimba Shingange, Richard Lastrucci, Isheanesu Joseph Dzingirai, Jenalea Rajab
+    Authors: Vukosi Marivate, Matimba Shingange, Richard Lastrucci, 
+    Isheanesu Joseph Dzingirai, Jenalea Rajab
 </div>
 """
 
 citation = """
+<pre style="text-align: left; white-space: pre-wrap;">
 @inproceedings{lastrucci-etal-2023-preparing,
     title = "Preparing the Vuk{'}uzenzele and {ZA}-gov-multilingual {S}outh {A}frican multilingual corpora",
-    author = "Richard Lastrucci and Isheanesu Dzingirai and Jenalea Rajab and Andani Madodonga and Matimba Shingange and Daniel Njini and Vukosi Marivate",
+    author = "Richard Lastrucci and Isheanesu Dzingirai and Jenalea Rajab 
+              and Andani Madodonga and Matimba Shingange and Daniel Njini and Vukosi Marivate",
     booktitle = "Proceedings of the Fourth workshop on Resources for African Indigenous Languages (RAIL 2023)",
     month = may,
     year = "2023",
@@ -68,6 +62,7 @@ citation = """
     url = "https://aclanthology.org/2023.rail-1.3",
     pages = "18--25"
 }
+</pre>
 """
 
 doi = """
@@ -77,24 +72,27 @@ doi = """
 """
 
 with gr.Blocks() as demo:
-    gr.Markdown(logo)    
-    gr.Markdown(description) 
+    gr.Markdown(logo)   
+    gr.Markdown(description)
     gr.Markdown(article)
-    
-    textbox = gr.Textbox(lines=5, placeholder="Enter Northern Sotho text (maximum 5 lines)", label="Input")
-    output_text = gr.Textbox(label="Translation")
-    
+
     gr.Interface(
         fn=translate,
         inputs=textbox,
         outputs=output_text,
         title="Northern Sotho to English Translation"
     )
-    
-    gr.Markdown(extra_info)
-    gr.Markdown(authors)
-    gr.Markdown(citation)
-    gr.Markdown(doi)
+
+    with gr.Accordion("More Information", open=False):
+        gr.Markdown("""
+        <h4 style="text-align: center;">More information about the space</h4>
+        <p>This is a variant of the M2M100 model, fine-tuned on a multilingual dataset 
+        to support translation from Northern Sotho (Sepedi) to English. The model was trained 
+        with a focus on improving translation accuracy for low-resource languages.</p>
+        """)
+        gr.Markdown(authors)
+        gr.Markdown(citation)
+        gr.Markdown(doi)
 
 demo.launch(enable_queue=True)