Update README.md

README.md

@@ -4,10 +4,11 @@ emoji: 🔥
 colorFrom: yellow
 colorTo: green
 sdk: gradio
-sdk_version: 4.22.0
+sdk_version: 4.28.3
 app_file: app.py
 pinned: false
 license: apache-2.0
+short_description: Meta Llama3 8b with Llava Multimodal capabilities
 ---
 
 Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

app.py

@@ -9,6 +9,16 @@ from transformers import TextIteratorStreamer
 
 import spaces
 
+
+PLACEHOLDER = """
+<div style="padding: 30px; text-align: center; display: flex; flex-direction: column; align-items: center;">
+   <img src="https://cdn-uploads.huggingface.co/production/uploads/64ccdc322e592905f922a06e/DDIW0kbWmdOQWwy4XMhwX.png" style="width: 80%; max-width: 550px; height: auto; opacity: 0.55;  "> 
+   <h1 style="font-size: 28px; margin-bottom: 2px; opacity: 0.55;">LLaVA-Llama-3-8B</h1>
+   <p style="font-size: 18px; margin-bottom: 2px; opacity: 0.65;">Llava-Llama-3-8b is a LLaVA model fine-tuned from Meta-Llama-3-8B-Instruct and CLIP-ViT-Large-patch14-336 with ShareGPT4V-PT and InternVL-SFT by XTuner</p>
+</div>
+"""
+
+
 model_id = "xtuner/llava-llama-3-8b-v1_1-transformers"
 
 processor = AutoProcessor.from_pretrained(model_id)
@@ -76,16 +86,20 @@ def bot_streaming(message, history):
         yield generated_text_without_prompt
 
 
-demo = gr.ChatInterface(
+chatbot=gr.Chatbot(placeholder=PLACEHOLDER,scale=1)
+chat_input = gr.MultimodalTextbox(interactive=True, file_types=["image"], placeholder="Enter message or upload file...", show_label=False)
+with gr.Blocks(fill_height=True, ) as demo:
+    gr.ChatInterface(
     fn=bot_streaming,
-    fill_height=False,
     title="LLaVA Llama-3-8B",
     examples=[{"text": "What is on the flower?", "files": ["./bee.jpg"]},
               {"text": "How to make this pastry?", "files": ["./baklava.png"]}],
     description="Try [LLaVA Llama-3-8B](https://huggingface.co/xtuner/llava-llama-3-8b-v1_1-transformers). Upload an image and start chatting about it, or simply try one of the examples below. If you don't upload an image, you will receive an error.",
     stop_btn="Stop Generation",
-    multimodal=True
-)
+    multimodal=True,
+    textbox=chat_input,
+    chatbot=chatbot,
+    )
 
 demo.queue(api_open=False)
 demo.launch(show_api=False, share=False)