check_1

app.py

@@ -58,6 +58,12 @@ demo = gr.ChatInterface(
     ],
 )
 
+# read css file
+def readCSS(file):
+    with open(file) as f:
+        return f.read()
+    
+demo.css = readCSS("style.css")
 
 if __name__ == "__main__":
     demo.launch()

style.css

@@ -0,0 +1,68 @@
+/* styles.css */
+#chatbox {
+    background-color: #ece5dd;
+    border-radius: 8px;
+    max-height: 400px;
+    overflow-y: auto;
+    padding: 10px;
+    display: flex;
+    flex-direction: column;
+}
+
+.message {
+    margin-bottom: 10px;
+    display: flex;
+    align-items: center;
+}
+
+.message.user {
+    justify-content: flex-end;
+}
+
+.message.bot {
+    justify-content: flex-start;
+}
+
+.message .text {
+    background-color: #ffffff;
+    border-radius: 10px;
+    padding: 10px;
+    max-width: 80%;
+    line-height: 1.4;
+}
+
+.message.user .text {
+    background-color: #dcf8c6;
+}
+
+.message.bot .text {
+    background-color: #ffffff;
+}
+
+.message .timestamp {
+    font-size: 0.8em;
+    color: #999;
+}
+
+#input-box {
+    margin-top: 10px;
+    display: flex;
+}
+
+#input-box textarea {
+    width: 80%;
+    border: 1px solid #ccc;
+    border-radius: 5px;
+    padding: 10px;
+    resize: none;
+}
+
+#input-box button {
+    width: 20%;
+    border: none;
+    border-radius: 5px;
+    background-color: #007bff;
+    color: white;
+    cursor: pointer;
+    padding: 10px;
+}

utils.py

@@ -1 +1,2 @@
-import numpy as np
+import numpy as np
+