Update app.py

app.py

@@ -34,13 +34,13 @@ processor = AutoProcessor.from_pretrained("Qwen/Qwen2-VL-2B-Instruct", trust_rem
 @spaces.GPU()
 def process_pdf_and_query(pdf_file, user_query):
     # Convert the PDF to images
-    images = convert_from_path(pdf_file.name)  # pdf_file.name gives the file path
+    images = convert_from_path(pdf_file.name) 
     num_images = len(images)
 
     # Indexing the PDF in RAG
     RAG.index(
         input_path=pdf_file.name,
-        index_name="image_index",  # index will be saved at index_root/index_name/
+        index_name="image_index",  
         store_collection_with_index=False,
         overwrite=True
     )
@@ -88,13 +88,12 @@ def process_pdf_and_query(pdf_file, user_query):
 
     return output_text[0], num_images
 
-# Define the Gradio Interface
-pdf_input = gr.File(label="Upload PDF")  # Single PDF file input
-query_input = gr.Textbox(label="Enter your query", placeholder="Ask a question about the PDF")  # User query input
-output_text = gr.Textbox(label="Model Answer")  # Output for the model's answer
-output_images = gr.Textbox(label="Number of Images in PDF")  # Output for number of images
+pdf_input = gr.File(label="Upload PDF")  
+query_input = gr.Textbox(label="Enter your query", placeholder="Ask a question about the PDF") 
+output_text = gr.Textbox(label="Model Answer") 
+output_images = gr.Textbox(label="Number of Images in PDF")  
+
 
-# Footer HTML
 footer = """
 <div style="text-align: center; margin-top: 20px;">
     <a href="https://www.linkedin.com/in/pejman-ebrahimi-4a60151a7/" target="_blank">LinkedIn</a> |
@@ -108,7 +107,6 @@ footer = """
 </div>
 """
 
-# Explanation about Multimodal RAG
 explanation = """
 <div style="text-align: center; margin-bottom: 20px;">
     <h2 style="font-weight: bold; font-size: 24px;">Multimodal RAG (Retrieval-Augmented Generation)</h2>
@@ -121,23 +119,22 @@ explanation = """
 </div>
 """
 
-# Launch the Gradio app with additional features
+
 demo = gr.Interface(
     fn=process_pdf_and_query, 
-    inputs=[pdf_input, query_input],  # List of inputs
-    outputs=[output_text, output_images],  # List of outputs
-    title="Multimodal RAG with Image Query - By <a href='https://github.com/arad1367'>Pejman Ebrahimi</a>",
+    inputs=[pdf_input, query_input],  
+    outputs=[output_text, output_images],  
+    title="<div style='text-align: center; font-weight: bold; font-size: 28px;'>Multimodal RAG with Image Query - By <a href='https://github.com/arad1367' style='color: blue;'>Pejman Ebrahimi</a></div>",
     theme='freddyaboulton/dracula_revamped',
 )
 
-# Add additional elements to the interface
+
 with demo:
-    gr.HTML(explanation)  # Explanation section
-    gr.HTML(footer)  # Footer section
-    gr.DuplicateButton(value="Duplicate Space for private use", elem_classes="duplicate-button")  # Duplicate button
-    submit_button = gr.Button("Submit", elem_classes="submit-button")  # Custom Submit Button
+    gr.HTML(explanation) 
+    gr.HTML(footer)  
+    gr.DuplicateButton(value="Duplicate Space for private use", elem_classes="duplicate-button")  
+    gr.Button("Submit", elem_classes="submit-button")  
 
-# Custom CSS for styling the button
 css = """
 <style>
     .submit-button {
@@ -150,17 +147,17 @@ css = """
         cursor: pointer;
     }
     .duplicate-button {
-        background-color: lightgreen;
+        background-color: green;
         color: white;
         border: none;
         border-radius: 5px;
         padding: 10px 20px;
         font-size: 16px;
         cursor: pointer;
+        margin: 10px;  /* Add some space between buttons */
     }
 </style>
 """
 gr.HTML(css)
 
-# Launch the Gradio app
-demo.launch(debug=True)  # Start the interface
+demo.launch(debug=True)