AI_models

1
body {
2
	font-family: Tahoma, sans-serif;
3
	background-color: #333;
4
	color: #fff;
5
}
6

7
a {
8
	font-family: Tahoma, sans-serif;
9
	font-size: 16px;
10
	color: #007FFF;
11
}
12

13
img {
14
	position: relative;
15
	width: 100%;
16
	height: auto;
17
}
18

19
.chat-container {
20
	max-width: 800px;
21
	margin: 40px auto;
22
	padding: 20px;
23
	background-color: #444;
24
	border: 1px solid #555;
25
	border-radius: 10px;
26
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
27
}
28

29
.chat-message {
30
	border-bottom: 1px solid #555;
31
	padding-bottom: 24px;
32
	margin-bottom: 20px;
33
}
34

35
.username {
36
	font-weight: bold;
37
	color: #4caf50;
38
}
39

40
.botname {
41
	font-weight: bold;
42
	color: #dc3545;
43
}
44

45
.message {
46
	color: #fff;
47
	margin-top: 14px;
48
}
49

50
pre {
51
	overflow: auto;
52
	font-size: 13px;
53
	line-height: 1.5;
54
	padding-bottom: 14px;
55
	padding-top: 14px;
56
}
57

58
code {
59
	font-family: 'Monaco', monospace;
60
	font-size: 13px;
61
}
62

63
.code-header {
64
	padding: 10px;
65
	display: flex;
66
	justify-content: space-between;
67
	align-items: center;
68
}
69

70
.code-body {
71
	margin-top: -10px;
72
	background-color: #2f2f2f;
73
}
74

75
.code-box {
76
	margin-top: 20px;
77
	border: 1px solid #555;
78
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
79
	border-radius: 10px;
80
	margin-bottom: 14px;
81
}
82

83
.code-header span {
84
	font-weight: bold;
85
	font-size: 14px;
86
}
87

88
.code-copy {
89
	font-size: 12px;
90
	padding: 5px 10px;
91
	border: none;
92
	border-radius: 3px;
93
	background-color: #4CAF50;
94
	color: #fff;
95
	cursor: pointer;
96
}
97

98
.code-copy:hover {
99
	background-color: #3e8e41;
100
}
101

102
.line-numbers {
103
	padding-left: 10px;
104
	padding-right: 10px;
105
	margin-right: 10px;
106
	text-align: right;
107
	color: #999;
108
	border-right: 1px solid #444;
109
	user-select: none;
110
	-webkit-user-select: none;
111
	-moz-user-select: none;
112
	-ms-user-select: none;
113
	;
114
}
115

116
form {
117
	padding: 20px;
118
	background-color: #444;
119
	border: 1px solid #555;
120
	border-radius: 10px;
121
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
122
}
123

124
#chat-input {
125
	display: flex;
126
	padding: 10px;
127
	background-color: #444;
128
	border: 1px solid #555;
129
	border-radius: 10px;
130
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
131
	flex-direction: column;
132
}
133

134
#message-input {
135
	position: relative;
136
	left: -11px;
137
	width: 99%;
138
	height: 128px;
139
	padding: 15px;
140
	font-size: 16px;
141
	border: none;
142
	background-color: #2f2f2f;
143
	color: #fff;
144
	resize: none;
145
	overflow-y: auto;
146
}
147

148
#message-input::-webkit-scrollbar {
149
	width: 10px;
150
	height: 10px;
151
	background-color: #333;
152
}
153

154
#message-input::-webkit-scrollbar-thumb {
155
	background-color: #4CAF50;
156
	border-radius: 10px;
157
	cursor: default;
158
}
159

160
#message-input::-webkit-scrollbar-thumb:hover {
161
	background-color: #3e8e41;
162
}
163

164
.btn-area {
165
	display: flex;
166
	justify-content: space-between;
167
}
168

169
.button {
170
	top: 4px;
171
	position: relative;
172
	font-size: 16px;
173
	padding: 10px 20px;
174
	border: none;
175
	border-radius: 10px;
176
	color: #fff;
177
	cursor: pointer;
178
}
179

180
.button:hover {
181
	box-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
182
}
183

184
.new {
185
	background-color: #007FFF;
186
	;
187
}
188

189
.send {
190
	background-color: #4CAF50;
191
}
192

193
#chat-log {
194
	overflow-y: auto;
195
	max-height: 400px;
196
	margin: 16px;
197
	padding: 16px;
198
}
199

200
#chat-log::-webkit-scrollbar {
201
	width: 10px;
202
	height: 10px;
203
	background-color: #333;
204
}
205

206
#chat-log::-webkit-scrollbar-thumb {
207
	background-color: #4CAF50;
208
	border-radius: 10px;
209
}
210

211
#chat-log::-webkit-scrollbar-thumb:hover {
212
	background-color: #3e8e41;
213
}
214

215
.chat-header {
216
	display: flex;
217
	flex-direction: column;
218
	align-items: center;
219
}
220

221
.dropdown-button {
222
	background-color: #4CAF50;
223
	color: #fff;
224
	padding: 10px 20px;
225
	border: none;
226
	border-radius: 5px;
227
	cursor: pointer;
228
}
229

230
.dropdown-button:hover {
231
	background-color: #3e8e41;
232
}
233

234
.dropdown-menu {
235
	padding: 10px;
236
	position: relative;
237
	background-color: rgb(68, 68, 68);
238
	border: 1px solid rgb(85, 85, 85);
239
	border-radius: 10px;
240
	box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 10px;
241
	display: none;
242
}
243

244
.dropdown-menu li {
245
	list-style-type: none;
246
	margin-bottom: 10px;
247
	cursor: pointer;
248
}
249

250
.dropdown-menu li a {
251
	list-style-type: none;
252
	color: #fff;
253
	text-decoration: none;
254
}
255

256
.dropdown-menu li a:hover {
257
	list-style-type: none;
258
	color: #4CAF50;
259
}