Hugging Face's logo

Spaces:
Cartof
/
Chatbot
Build error

App Files Community
1
Cartof commited on
Commit
e0726cd
·
1 Parent(s): b04f907

Update style.css

Browse files
Files changed (1) hide show
  1. style.css +83 -164
style.css CHANGED
@@ -1,187 +1,106 @@
1
- /* Stilul pentru titlu */
 
 
 
 
 
 
 
 
 
 
 
 
 
2
  h1 {
3
- font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
4
  color: #A238FF;
5
- font-size: 3em;
6
- margin-bottom: 0;
 
 
7
  }
8
 
9
- /* Stilul pentru descriere */
10
- div {
11
- font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
12
- color: #808080;
13
- font-size: 1.2em;
14
- margin-top: 0;
15
  }
16
 
17
- /* Stilul pentru caseta de text pentru intrare */
18
- input[type="text"] {
19
- width: 100%;
20
- padding: 12px 20px;
21
- margin: 8px 0;
22
- box-sizing: border-box;
23
- border: 2px solid #ccc;
24
- border-radius: 4px;
25
- font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
26
- font-size: 1.2em;
27
- }
28
-
29
- /* Stilul pentru butonul de trimitere */
30
- button[type="submit"] {
31
- background-color: #A238FF;
32
- color: white;
33
- padding: 12px 20px;
34
- border: none;
35
- border-radius: 4px;
36
- cursor: pointer;
37
- font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
38
- font-size: 1.2em;
39
  }
40
 
41
- /* Stilul pentru butonul de resetare */
42
- button[type="reset"] {
43
- background-color: #DC143C;
44
- color: white;
45
- padding: 12px 20px;
46
- border: none;
47
- border-radius: 4px;
48
- cursor: pointer;
49
- font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
50
- font-size: 1.2em;
51
  }
52
 
53
- /* Stilul pentru butonul de reîncercare */
54
- button[type="retry"] {
55
- background-color: #A9A9A9;
56
- color: white;
57
- padding: 12px 20px;
58
- border: none;
59
- border-radius: 4px;
60
- cursor: pointer;
61
- font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
62
- font-size: 1.2em;
63
  }
64
 
65
- /* Stilul pentru butonul de ștergere a ultimei conversații */
66
- button[type="deleteLast"] {
67
- background-color: #A9A9A9;
68
- color: white;
69
- padding: 12px 20px;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
70
  border: none;
71
- border-radius: 4px;
 
 
 
72
  cursor: pointer;
73
- font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
74
- font-size: 1.2em;
 
 
 
75
  }
76
 
77
- /* Stilul pentru chat */
78
- .gradio-chatbot {
79
  border: none;
80
- margin-top: 20px;
 
 
81
  }
82
 
83
- /* Stilul pentru mesajele asistentului */
84
- .gradio-chatbot .gradio-message-assistant {
85
- background-color: #A238FF;
86
- color: white;
87
- border-radius: 10px;
88
- padding: 10px 20px;
89
  margin-bottom: 10px;
90
- font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
91
- font-size: 1.2em;
92
  }
93
 
94
- /* Stilul pentru mesajele utilizatorului */
95
- .gradio-chatbot .gradio-message-user {
96
- background-color: #DC143C;
97
- color: white;
98
- border-radius: 10px;
99
- padding: 10px 20px;
100
- margin-bottom: 10px;
101
- font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
102
- font-size: 1.2em;
103
- }
104
-
105
- /* Stilul pentru butonul de încărcare a mai multor răspunsuri */
106
- .gradio-chatbot .gradio-load-more {
107
- background-color: #A9A9A9;
108
- color: white;
109
- border: none;
110
- border-radius: 4px;
111
- cursor: pointer;
112
- font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
113
- font-size: 1.2em;
114
- padding: 12px 20px;
115
- margin-top: 10px;
116
- }
117
-
118
- /* Stilul pentru containerul de lista de sugestii */
119
- .gradio-chatbot .gradio-suggestions {
120
- display: flex;
121
- flex-wrap: wrap;
122
- margin-top: 10px;
123
- justify-content: center;
124
- }
125
-
126
- /* Stilul pentru fiecare sugestie din lista de sugestii */
127
- .gradio-chatbot .gradio-suggestion {
128
- background-color: #A9A9A9;
129
- color: white;
130
- border: none;
131
- border-radius: 4px;
132
- cursor: pointer;
133
- font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
134
- font-size: 1.2em;
135
- padding: 12px 20px;
136
- margin: 5px;
137
- transition: background-color 0.3s ease;
138
- }
139
-
140
- /* Stilul pentru sugestiile selectate din lista de sugestii */
141
- .gradio-chatbot .gradio-suggestion:hover {
142
- background-color: #808080;
143
- }
144
-
145
- /* Stilul pentru titlul sugestiilor */
146
- .gradio-chatbot .gradio-suggestions-title {
147
- font-weight: bold;
148
- margin-top: 10px;
149
- margin-bottom: 5px;
150
- font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
151
- font-size: 1.2em;
152
- }
153
-
154
- /* Stilul pentru containerul de lista de conversatii anterioare */
155
- .gradio-chatbot .gradio-conversations {
156
- margin-top: 10px;
157
- }
158
-
159
- /* Stilul pentru fiecare conversatie anterioara */
160
- .gradio-chatbot .gradio-conversation {
161
- display: flex;
162
- flex-wrap: wrap;
163
- justify-content: flex-start;
164
- margin-bottom: 5px;
165
- }
166
-
167
- /* Stilul pentru data conversatiei anterioare */
168
- .gradio-chatbot .gradio-conversation-date {
169
- color: #808080;
170
- font-size: 0.8em;
171
- margin-right: 5px;
172
- font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
173
- }
174
-
175
- /* Stilul pentru mesajele din conversatiile anterioare */
176
- .gradio-chatbot .gradio-conversation-message {
177
- background-color: #A9A9A9;
178
- color: white;
179
- border-radius: 10px;
180
- padding: 5px 10px;
181
- margin-right: 5px;
182
- font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
183
- font-size: 0.8em;
184
- max-width: 70%;
185
- word-wrap: break-word;
186
- white-space: pre-wrap;
187
  }
 
1
+ body {
2
+ background-color: #F5F5F5;
3
+ font-family: sans-serif;
4
+ }
5
+
6
+ .gradio {
7
+ max-width: 900px;
8
+ margin: 0 auto;
9
+ padding: 30px;
10
+ background-color: white;
11
+ border-radius: 10px;
12
+ box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
13
+ }
14
+
15
  h1 {
 
16
  color: #A238FF;
17
+ font-size: 40px;
18
+ font-weight: bold;
19
+ text-align: center;
20
+ margin-bottom: 40px;
21
  }
22
 
23
+ .chatbot-container {
24
+ margin: 40px 0;
 
 
 
 
25
  }
26
 
27
+ .chatbot-message {
28
+ margin: 10px 0;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
29
  }
30
 
31
+ .chatbot-message .user {
32
+ font-weight: bold;
33
+ margin-right: 5px;
34
+ color: #A238FF;
 
 
 
 
 
 
35
  }
36
 
37
+ .chatbot-message .assistant {
38
+ font-weight: bold;
39
+ margin-left: 5px;
40
+ color: #BBB;
 
 
 
 
 
 
41
  }
42
 
43
+ .chatbot-message pre code {
44
+ display: block;
45
+ padding: 10px;
46
+ background-color: #EEE;
47
+ border-radius: 5px;
48
+ white-space: pre-wrap;
49
+ overflow-wrap: break-word;
50
+ }
51
+
52
+ .chatbot-message pre code.python {
53
+ color: #007F00;
54
+ }
55
+
56
+ .chatbot-message pre code.shell {
57
+ color: #007F7F;
58
+ }
59
+
60
+ .gradio button {
61
+ background-color: #A238FF !important;
62
  border: none;
63
+ color: white;
64
+ padding: 12px 24px;
65
+ font-size: 16px;
66
+ border-radius: 5px;
67
  cursor: pointer;
68
+ transition: background-color 0.2s ease;
69
+ }
70
+
71
+ .gradio button:hover {
72
+ background-color: #8A1ACF !important;
73
  }
74
 
75
+ .gradio input[type=text] {
76
+ border-radius: 5px;
77
  border: none;
78
+ padding: 10px;
79
+ width: 100%;
80
+ font-size: 16px;
81
  }
82
 
83
+ .gradio label {
84
+ font-size: 16px;
 
 
 
 
85
  margin-bottom: 10px;
86
+ display: block;
 
87
  }
88
 
89
+ .gradio .row {
90
+ display: flex;
91
+ margin: 10px 0;
92
+ align-items: center;
93
+ }
94
+
95
+ .gradio .column {
96
+ flex: 1;
97
+ }
98
+
99
+ .gradio .button-container {
100
+ display: flex;
101
+ justify-content: flex-end;
102
+ }
103
+
104
+ .gradio .chatbot-container:last-of-type {
105
+ margin-bottom: 0;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
106
  }