Hugging Face's logo

Spaces:
OpenRAG128
/
ImageIQ
Running

App Files Community
OpenRAG128 commited on
Commit
94d96f3
·
verified ·
1 Parent(s): 87b8c5c

Create style.css

Browse files
Files changed (1) hide show
  1. static/style.css +123 -0
static/style.css ADDED
@@ -0,0 +1,123 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ body {
2
+ font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
3
+ background-color: #000000;
4
+ margin: 0;
5
+ padding: 0;
6
+ display: flex;
7
+ justify-content: center;
8
+ align-items: center;
9
+ height: 100vh;
10
+ background-size: cover;
11
+ background-position: center;
12
+ color: #f3eded;
13
+ }
14
+
15
+ .chat-container {
16
+ width: 400px;
17
+ background-color: #000000;
18
+ box-shadow: 0 4px 20px rgba(198, 118, 255, 0.5);
19
+ border-radius: 15px;
20
+ overflow: hidden;
21
+ display: flex;
22
+ flex-direction: column;
23
+ }
24
+
25
+ #chatbox {
26
+ padding: 20px;
27
+ max-height: 400px;
28
+ overflow-y: auto;
29
+ border-bottom: 1px solid #b582eb;
30
+ background-color: #140d1d;
31
+ }
32
+
33
+ .bot-message, .user-message {
34
+ margin: 10px 0;
35
+ padding: 15px;
36
+ border-radius: 10px;
37
+ display: flex;
38
+ align-items: center;
39
+ }
40
+
41
+ .bot-message {
42
+ background-color: #461d5f;
43
+ color: #f0def9;
44
+ text-align: left;
45
+ }
46
+
47
+ .user-message {
48
+ background-color: #b586ec;
49
+ color: rgb(255, 255, 255);
50
+ text-align: right;
51
+ align-self: flex-end;
52
+ }
53
+
54
+ .bot-message img, .user-message img {
55
+ width: 30px;
56
+ height: 30px;
57
+ margin-right: 10px;
58
+ }
59
+
60
+ .input-container {
61
+ display: flex;
62
+ align-items: center;
63
+ background-color: #000000;
64
+ padding: 10px;
65
+ border-top: 1px solid #000000;
66
+ }
67
+
68
+ input[type="text"] {
69
+ width: 70%; /* Increased width for question input */
70
+ padding: 10px;
71
+ background-color: #000000;
72
+ color: #ffffff;
73
+ border: none;
74
+ border-radius: 5px;
75
+ font-size: 16px;
76
+ margin-right: 10px;
77
+ }
78
+
79
+ input[type="file"] {
80
+ width: 20%; /* Adjust the width of the file input */
81
+ padding: 5px;
82
+ background-color: #000000;
83
+ color: #ffffff;
84
+ border: none;
85
+ font-size: 14px;
86
+ cursor: pointer;
87
+ margin-right: 10px;
88
+ }
89
+
90
+ select#model {
91
+ width: 20%; /* Decreased width for model dropdown */
92
+ padding: 10px;
93
+ background-color: #000000;
94
+ color: #ffffff;
95
+ border: none;
96
+ font-size: 14px;
97
+ margin-right: 10px;
98
+ }
99
+
100
+ select#complexity {
101
+ width: 10%; /* Adjusted width for complexity dropdown */
102
+ padding: 10px;
103
+ background-color: #000000;
104
+ color: #ffffff;
105
+ border: none;
106
+ font-size: 14px;
107
+ margin-right: 10px;
108
+ }
109
+
110
+ button {
111
+ width: 20%;
112
+ padding: 10px;
113
+ background-color: #000105;
114
+ color: white;
115
+ border: none;
116
+ cursor: pointer;
117
+ font-size: 16px;
118
+ border-radius: 5px;
119
+ }
120
+
121
+ button:hover {
122
+ background-color: #45265e;
123
+ }