Update ui/app_class.py

ui/app_class.py

@@ -23,30 +23,63 @@ from ui.utils import (
 )
 
 DESCRIPTION = """
-
-<div style="display: flex; justify-content: center; align-items: center;">
-    <div style="width: 100%; text-align: center; font-size: 30px;">
-        <strong>MINIMA: Modality Invariant Image Matching</strong>
-    </div>
+<div style="display: flex; justify-content: center; align-items: center; margin-bottom: 20px;">
+    <h1 style="width: 100%; text-align: center; font-size: 40px; font-weight: bold; color: #333;">
+        MINIMA: Modality Invariant Image Matching
+    </h1>
 </div> 
 
-
-<div style="display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap;">
-    <div><a href="https://github.com/LSXI7/MINIMA"><img src="https://img.shields.io/badge/Source_Code-black?logo=Github" alt='Github Source Code'></a></div>&nbsp;
+<div style="display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap; margin-bottom: 20px;">
+    <div>
+        <a href="https://github.com/LSXI7/MINIMA"><img src="https://img.shields.io/badge/Source_Code-black?logo=Github" alt="Github Source Code"></a>
+    </div>&nbsp;
+    <div>
+        <a href="https://arxiv.org/abs/0.0"><img src="https://img.shields.io/badge/arXiv-PDF-b31b1b" alt="arXiv"></a>
+    </div>
 </div>
 
+<p style="text-align: center; font-size: 16px; color: #666;">
+    This Space is derived from <a href="https://github.com/Vincentqyw/image-matching-webui" style="color: #007BFF;">Image Matching WebUI</a>.      
+</p>
 
-This Space is derived from [Image Matching WebUI](https://github.com/Vincentqyw/image-matching-webui)        
-      
-We are grateful to the authors for their contribution of the source code.        
-Here we provide our MINIMA-model in our paper for test and comparison and this project is undergoing continuous enhancement.    
+<p style="text-align: center; font-size: 16px; color: #666;">
+    We are grateful to the authors for their contribution of the source code. Here we provide our MINIMA-model in our paper for test and comparison, and this project is undergoing continuous enhancement.
+</p>
 """
 
+
 CSS = """
-#warning {background-color: #FFCCCB}
-.logs_class textarea {font-size: 12px !important}
+body { 
+    font-family: Arial, sans-serif; 
+    background-color: #f9f9f9; 
+    margin: 0; 
+    padding: 0; 
+}
+#logo-img {
+    width: 100px; 
+    height: auto; 
+    margin: 20px auto;
+    display: block;
+}
+h1 {
+    font-size: 40px;
+    color: #333;
+}
+a {
+    text-decoration: none;
+    color: #007BFF;
+}
+a:hover {
+    text-decoration: underline;
+}
+.logs_class textarea {
+    font-size: 12px !important;
+    border: 1px solid #ddd;
+    border-radius: 4px;
+}
 """
 
+
 class ImageMatchingApp:
     def __init__(self, server_name="0.0.0.0", server_port=7860, **kwargs):
         self.server_name = server_name