Update app.py

app.py

@@ -40,19 +40,29 @@ with gr.Blocks() as demo:
     )
     gr.Markdown("""
 # Welcome to My Neuroscience Project
-<div style="border: 2px solid rgba(0, 0, 0, 0.1); border-radius: 10px; background-color: rgba(255, 255, 255, 0.8); padding: 20px;">
+
 The author is a third-year undergraduate student at the School of Intelligent Science and Technology, Nanjing University, Suzhou Campus.
 
-**Note:** Since this project uses Hugging Face's free CPU, the processing speed is very slow. In the worst case, even a video with a dozen frames can take several minutes to process. Therefore, if possible, it is recommended to deploy on a device with a better GPU.
+## Note
+<div style="border: 2px solid rgba(0, 0, 0, 0.1); border-radius: 10px; background-color: rgba(255, 255, 255, 0.8); padding: 20px;">
+Since this project uses Hugging Face's free CPU, the processing speed is very slow. In the worst case, even a video with a dozen frames can take several minutes to process. Therefore, if possible, it is recommended to deploy on a device with a better GPU.
 
 Although the YOLOv5 model supports up to 80 classes, my project is primarily focused on autonomous driving. Therefore, objects other than people and cars will be excluded after object detection.
-
+</div>
+<div style="border: 2px solid rgba(0, 0, 0, 0.1); border-radius: 10px; background-color: rgba(255, 255, 255, 0.8); padding: 20px;">
 **Tips for First-Time Users:**
 - Ensure that the video includes at least people and cars.
 - It's recommended that the video is not too long, ideally within 10 seconds.
 </div>
 """)
     
-    gr.Video(value="DDMDeepsort1.mp4", label="Demo Video", width=720, height=435)
+    gr.HTML("""
+<div style="display: flex; justify-content: center;">
+    <video width="720" height="435" controls>
+        <source src="DDMDeepsort1.mp4" type="video/mp4">
+        Your browser does not support the video tag.
+    </video>
+</div>
+""")
 
 demo.launch()