update HF title

app.css

@@ -1,5 +1,19 @@
 /* Basic styling for the coder application */
 
+:root {
+    --text-color: #333;
+    --bg-color: #f5f5f5;
+    --html-bg: white;
+}
+
+@media (prefers-color-scheme: dark) {
+    :root {
+        --text-color: #e0e0e0;
+        --bg-color: #2d2d2d;
+        --html-bg: #1e1e1e;
+    }
+}
+
 .left_header {
     text-align: center;
     margin-bottom: 20px;
@@ -7,11 +21,11 @@
 
 .left_header h1 {
     margin-top: 10px;
-    color: #333;
+    color: var(--text-color);
 }
 
 .right_panel {
-    background: #f5f5f5;
+    background: var(--bg-color);
     border-radius: 8px;
     padding: 20px;
     height: 100%;
@@ -50,7 +64,7 @@
     height: 920px;
     border: none;
     border-radius: 8px;
-    background: white;
+    background: var(--html-bg);
 }
 
 .history_chatbot {

app.py

@@ -175,7 +175,7 @@ with gr.Blocks(css_paths="app.css") as demo:
                         header = gr.HTML("""
                                   <div class="left_header">
                                    <img src="//img.alicdn.com/imgextra/i2/O1CN01KDhOma1DUo8oa7OIU_!!6000000000220-1-tps-240-240.gif" width="200px" />
-                                   <h1>HF Coder</h1>
+                                   <h1>Hugging Face Coder</h1>
                                   </div>
                                    """)
                         input = antd.InputTextarea(