agentgui 1.0.862 → 1.0.863
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/tool-spawner.js +8 -2
- package/lib/tool-version-check.js +21 -0
- package/lib/tool-version-fetch.js +9 -2
- package/package.json +1 -1
- package/static/css/main.css +0 -618
- package/static/js/client.js +1 -3555
- package/static/js/conversations.js +0 -708
package/static/css/main.css
CHANGED
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
<<<<<<< HEAD
|
|
2
1
|
*, *::before, *::after { box-sizing: border-box; }
|
|
3
2
|
|
|
4
3
|
:root {
|
|
@@ -13,31 +12,10 @@
|
|
|
13
12
|
--color-text-primary: #111827;
|
|
14
13
|
--color-text-secondary: #6b7280;
|
|
15
14
|
--color-border: #e5e7eb;
|
|
16
|
-
=======
|
|
17
|
-
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
|
|
18
|
-
|
|
19
|
-
*, *::before, *::after { box-sizing: border-box; }
|
|
20
|
-
|
|
21
|
-
:root {
|
|
22
|
-
--color-primary: #6366f1;
|
|
23
|
-
--color-primary-dark: #4f46e5;
|
|
24
|
-
--color-primary-rgb: 99,102,241;
|
|
25
|
-
--color-bg-primary: #ffffff;
|
|
26
|
-
--color-bg-secondary: #f4f4f5;
|
|
27
|
-
--color-bg-surface: #f9fafb;
|
|
28
|
-
--color-bg-input: #ffffff;
|
|
29
|
-
--color-bg-code: #0d1117;
|
|
30
|
-
--color-text-primary: #111827;
|
|
31
|
-
--color-text-secondary: #6b7280;
|
|
32
|
-
--color-text-muted: #9ca3af;
|
|
33
|
-
--color-border: #e5e7eb;
|
|
34
|
-
--color-border-strong: #d1d5db;
|
|
35
|
-
>>>>>>> 6bfde951cbeb65ec72b73da9c23b9c8c0ba0bbc1
|
|
36
15
|
--color-success: #10b981;
|
|
37
16
|
--color-error: #ef4444;
|
|
38
17
|
--color-warning: #f59e0b;
|
|
39
18
|
--color-info: #0891b2;
|
|
40
|
-
<<<<<<< HEAD
|
|
41
19
|
--sidebar-width: 300px;
|
|
42
20
|
--header-height: 52px;
|
|
43
21
|
--msg-max-width: 800px;
|
|
@@ -55,56 +33,15 @@
|
|
|
55
33
|
--color-code-text: #e2e8f0;
|
|
56
34
|
--color-code-border: #334155;
|
|
57
35
|
--color-thinking-bg: #1e1a2e;
|
|
58
|
-
=======
|
|
59
|
-
--sidebar-width: 260px;
|
|
60
|
-
--header-height: 48px;
|
|
61
|
-
--msg-max-width: 800px;
|
|
62
|
-
--radius-sm: 0.375rem;
|
|
63
|
-
--radius-md: 0.75rem;
|
|
64
|
-
--radius-lg: 1rem;
|
|
65
|
-
--radius-xl: 1.25rem;
|
|
66
|
-
--shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
|
|
67
|
-
--shadow-md: 0 4px 12px rgba(0,0,0,0.08);
|
|
68
|
-
--shadow-lg: 0 8px 24px rgba(0,0,0,0.12);
|
|
69
|
-
--transition-fast: 150ms ease;
|
|
70
|
-
--transition-base: 200ms ease;
|
|
71
|
-
}
|
|
72
|
-
|
|
73
|
-
html.dark {
|
|
74
|
-
--color-primary: #818cf8;
|
|
75
|
-
--color-primary-dark: #6366f1;
|
|
76
|
-
--color-primary-rgb: 129,140,248;
|
|
77
|
-
--color-bg-primary: #0f0f10;
|
|
78
|
-
--color-bg-secondary: #1a1a1e;
|
|
79
|
-
--color-bg-surface: #18181b;
|
|
80
|
-
--color-bg-input: #1e1e23;
|
|
81
|
-
--color-bg-code: #0d1117;
|
|
82
|
-
--color-text-primary: #e4e4e7;
|
|
83
|
-
--color-text-secondary: #a1a1aa;
|
|
84
|
-
--color-text-muted: #71717a;
|
|
85
|
-
--color-border: #27272a;
|
|
86
|
-
--color-border-strong: #3f3f46;
|
|
87
|
-
--shadow-sm: 0 1px 2px rgba(0,0,0,0.3);
|
|
88
|
-
--shadow-md: 0 4px 12px rgba(0,0,0,0.4);
|
|
89
|
-
--shadow-lg: 0 8px 24px rgba(0,0,0,0.5);
|
|
90
|
-
>>>>>>> 6bfde951cbeb65ec72b73da9c23b9c8c0ba0bbc1
|
|
91
36
|
}
|
|
92
37
|
|
|
93
38
|
html, body {
|
|
94
39
|
margin: 0;
|
|
95
40
|
padding: 0;
|
|
96
41
|
height: 100%;
|
|
97
|
-
<<<<<<< HEAD
|
|
98
42
|
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
|
|
99
43
|
background-color: var(--color-bg-primary);
|
|
100
44
|
color: var(--color-text-primary);
|
|
101
|
-
=======
|
|
102
|
-
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
|
|
103
|
-
background-color: var(--color-bg-primary);
|
|
104
|
-
color: var(--color-text-primary);
|
|
105
|
-
-webkit-font-smoothing: antialiased;
|
|
106
|
-
-moz-osx-font-smoothing: grayscale;
|
|
107
|
-
>>>>>>> 6bfde951cbeb65ec72b73da9c23b9c8c0ba0bbc1
|
|
108
45
|
}
|
|
109
46
|
|
|
110
47
|
/* ===== ROOT LAYOUT: sidebar + main, full viewport ===== */
|
|
@@ -125,10 +62,6 @@
|
|
|
125
62
|
display: flex;
|
|
126
63
|
flex-direction: column;
|
|
127
64
|
background-color: var(--color-bg-secondary);
|
|
128
|
-
<<<<<<< HEAD
|
|
129
|
-
=======
|
|
130
|
-
border-right: 1px solid var(--color-border);
|
|
131
|
-
>>>>>>> 6bfde951cbeb65ec72b73da9c23b9c8c0ba0bbc1
|
|
132
65
|
overflow: hidden;
|
|
133
66
|
transition: none !important;
|
|
134
67
|
animation: none !important;
|
|
@@ -143,42 +76,26 @@
|
|
|
143
76
|
}
|
|
144
77
|
|
|
145
78
|
.sidebar-header {
|
|
146
|
-
<<<<<<< HEAD
|
|
147
79
|
padding: 0.75rem 1rem;
|
|
148
|
-
=======
|
|
149
|
-
padding: 0.875rem 1rem 0.75rem;
|
|
150
|
-
>>>>>>> 6bfde951cbeb65ec72b73da9c23b9c8c0ba0bbc1
|
|
151
80
|
display: flex;
|
|
152
81
|
justify-content: space-between;
|
|
153
82
|
align-items: center;
|
|
154
83
|
flex-shrink: 0;
|
|
155
84
|
min-height: var(--header-height);
|
|
156
|
-
<<<<<<< HEAD
|
|
157
|
-
=======
|
|
158
|
-
border-bottom: 1px solid var(--color-border);
|
|
159
|
-
>>>>>>> 6bfde951cbeb65ec72b73da9c23b9c8c0ba0bbc1
|
|
160
85
|
}
|
|
161
86
|
|
|
162
87
|
.sidebar-header h2 {
|
|
163
88
|
margin: 0;
|
|
164
|
-
<<<<<<< HEAD
|
|
165
89
|
font-size: 0.875rem;
|
|
166
90
|
font-weight: 600;
|
|
167
91
|
text-transform: uppercase;
|
|
168
92
|
letter-spacing: 0.05em;
|
|
169
93
|
color: var(--color-text-secondary);
|
|
170
|
-
=======
|
|
171
|
-
font-size: 1rem;
|
|
172
|
-
font-weight: 700;
|
|
173
|
-
letter-spacing: -0.01em;
|
|
174
|
-
color: var(--color-text-primary);
|
|
175
|
-
>>>>>>> 6bfde951cbeb65ec72b73da9c23b9c8c0ba0bbc1
|
|
176
94
|
white-space: nowrap;
|
|
177
95
|
overflow: hidden;
|
|
178
96
|
}
|
|
179
97
|
|
|
180
98
|
.sidebar-new-btn {
|
|
181
|
-
<<<<<<< HEAD
|
|
182
99
|
padding: 0.375rem 0.625rem;
|
|
183
100
|
font-size: 0.75rem;
|
|
184
101
|
background-color: var(--color-primary);
|
|
@@ -187,17 +104,6 @@
|
|
|
187
104
|
border-radius: 0.375rem;
|
|
188
105
|
cursor: pointer;
|
|
189
106
|
transition: background-color 0.2s;
|
|
190
|
-
=======
|
|
191
|
-
padding: 0.375rem 0.75rem;
|
|
192
|
-
font-size: 0.8rem;
|
|
193
|
-
font-weight: 600;
|
|
194
|
-
background-color: var(--color-primary);
|
|
195
|
-
color: white;
|
|
196
|
-
border: none;
|
|
197
|
-
border-radius: var(--radius-md);
|
|
198
|
-
cursor: pointer;
|
|
199
|
-
transition: background-color var(--transition-fast);
|
|
200
|
-
>>>>>>> 6bfde951cbeb65ec72b73da9c23b9c8c0ba0bbc1
|
|
201
107
|
white-space: nowrap;
|
|
202
108
|
flex-shrink: 0;
|
|
203
109
|
}
|
|
@@ -226,60 +132,6 @@
|
|
|
226
132
|
|
|
227
133
|
.sidebar-clone-btn:hover { border-color: var(--color-primary); color: var(--color-primary); }
|
|
228
134
|
|
|
229
|
-
<<<<<<< HEAD
|
|
230
|
-
=======
|
|
231
|
-
/* Sidebar overflow menu */
|
|
232
|
-
.sidebar-overflow-btn {
|
|
233
|
-
width: 28px;
|
|
234
|
-
height: 28px;
|
|
235
|
-
display: flex;
|
|
236
|
-
align-items: center;
|
|
237
|
-
justify-content: center;
|
|
238
|
-
background: none;
|
|
239
|
-
border: none;
|
|
240
|
-
border-radius: var(--radius-sm);
|
|
241
|
-
cursor: pointer;
|
|
242
|
-
color: var(--color-text-secondary);
|
|
243
|
-
font-size: 1.1rem;
|
|
244
|
-
letter-spacing: 1px;
|
|
245
|
-
transition: background-color var(--transition-fast);
|
|
246
|
-
flex-shrink: 0;
|
|
247
|
-
}
|
|
248
|
-
.sidebar-overflow-btn:hover { background: var(--color-bg-primary); color: var(--color-text-primary); }
|
|
249
|
-
|
|
250
|
-
.sidebar-overflow-menu {
|
|
251
|
-
position: absolute;
|
|
252
|
-
top: calc(100% + 4px);
|
|
253
|
-
right: 0;
|
|
254
|
-
background: var(--color-bg-primary);
|
|
255
|
-
border: 1px solid var(--color-border);
|
|
256
|
-
border-radius: var(--radius-md);
|
|
257
|
-
box-shadow: var(--shadow-lg);
|
|
258
|
-
min-width: 180px;
|
|
259
|
-
z-index: 100;
|
|
260
|
-
padding: 0.25rem 0;
|
|
261
|
-
display: none;
|
|
262
|
-
}
|
|
263
|
-
.sidebar-overflow-menu.open { display: block; }
|
|
264
|
-
.sidebar-overflow-menu-item {
|
|
265
|
-
display: flex;
|
|
266
|
-
align-items: center;
|
|
267
|
-
gap: 0.625rem;
|
|
268
|
-
padding: 0.5rem 0.875rem;
|
|
269
|
-
font-size: 0.825rem;
|
|
270
|
-
color: var(--color-text-primary);
|
|
271
|
-
cursor: pointer;
|
|
272
|
-
transition: background-color var(--transition-fast);
|
|
273
|
-
border: none;
|
|
274
|
-
background: none;
|
|
275
|
-
width: 100%;
|
|
276
|
-
text-align: left;
|
|
277
|
-
}
|
|
278
|
-
.sidebar-overflow-menu-item:hover { background: var(--color-bg-secondary); }
|
|
279
|
-
.sidebar-overflow-menu-item.danger { color: var(--color-error); }
|
|
280
|
-
.sidebar-overflow-menu-wrapper { position: relative; }
|
|
281
|
-
|
|
282
|
-
>>>>>>> 6bfde951cbeb65ec72b73da9c23b9c8c0ba0bbc1
|
|
283
135
|
.clone-input-bar {
|
|
284
136
|
display: flex;
|
|
285
137
|
align-items: center;
|
|
@@ -360,7 +212,6 @@
|
|
|
360
212
|
}
|
|
361
213
|
|
|
362
214
|
.conversation-item {
|
|
363
|
-
<<<<<<< HEAD
|
|
364
215
|
padding: 0.75rem 0.75rem;
|
|
365
216
|
margin: 0.125rem 0.5rem;
|
|
366
217
|
border-radius: 0.375rem;
|
|
@@ -377,24 +228,6 @@
|
|
|
377
228
|
color: white;
|
|
378
229
|
border-left-color: var(--color-primary-dark);
|
|
379
230
|
}
|
|
380
|
-
=======
|
|
381
|
-
padding: 0.625rem 0.75rem;
|
|
382
|
-
margin: 0.125rem 0.5rem;
|
|
383
|
-
border-radius: var(--radius-md);
|
|
384
|
-
cursor: pointer;
|
|
385
|
-
transition: background-color var(--transition-fast);
|
|
386
|
-
border-left: none;
|
|
387
|
-
user-select: none;
|
|
388
|
-
}
|
|
389
|
-
|
|
390
|
-
.conversation-item:hover { background-color: rgba(var(--color-primary-rgb),0.06); }
|
|
391
|
-
|
|
392
|
-
.conversation-item.active {
|
|
393
|
-
background-color: rgba(var(--color-primary-rgb),0.1);
|
|
394
|
-
color: var(--color-primary);
|
|
395
|
-
}
|
|
396
|
-
.conversation-item.active .conversation-item-meta { color: var(--color-primary); opacity: 0.7; }
|
|
397
|
-
>>>>>>> 6bfde951cbeb65ec72b73da9c23b9c8c0ba0bbc1
|
|
398
231
|
|
|
399
232
|
.conversation-item-title {
|
|
400
233
|
font-weight: 500;
|
|
@@ -414,11 +247,7 @@
|
|
|
414
247
|
text-overflow: ellipsis;
|
|
415
248
|
}
|
|
416
249
|
|
|
417
|
-
<<<<<<< HEAD
|
|
418
250
|
.conversation-item.active .conversation-item-meta { color: rgba(255,255,255,0.7); }
|
|
419
|
-
=======
|
|
420
|
-
/* conversation-item.active meta color handled in active block */
|
|
421
|
-
>>>>>>> 6bfde951cbeb65ec72b73da9c23b9c8c0ba0bbc1
|
|
422
251
|
|
|
423
252
|
.conversation-streaming-badge {
|
|
424
253
|
display: inline-flex;
|
|
@@ -429,46 +258,15 @@
|
|
|
429
258
|
|
|
430
259
|
.streaming-dot {
|
|
431
260
|
display: inline-block;
|
|
432
|
-
<<<<<<< HEAD
|
|
433
261
|
width: 0.5rem;
|
|
434
262
|
height: 0.5rem;
|
|
435
|
-
=======
|
|
436
|
-
width: 0.4rem;
|
|
437
|
-
height: 0.4rem;
|
|
438
|
-
>>>>>>> 6bfde951cbeb65ec72b73da9c23b9c8c0ba0bbc1
|
|
439
263
|
border-radius: 50%;
|
|
440
264
|
background-color: var(--color-success);
|
|
441
265
|
animation: pulse 1.5s ease-in-out infinite;
|
|
442
266
|
}
|
|
443
267
|
|
|
444
268
|
.conversation-item.active .streaming-dot {
|
|
445
|
-
<<<<<<< HEAD
|
|
446
269
|
background-color: #fff;
|
|
447
|
-
=======
|
|
448
|
-
background-color: var(--color-success);
|
|
449
|
-
}
|
|
450
|
-
|
|
451
|
-
/* Typing dots for streaming indicator */
|
|
452
|
-
.typing-dots {
|
|
453
|
-
display: inline-flex;
|
|
454
|
-
align-items: center;
|
|
455
|
-
gap: 3px;
|
|
456
|
-
padding: 0 2px;
|
|
457
|
-
}
|
|
458
|
-
.typing-dots span {
|
|
459
|
-
display: inline-block;
|
|
460
|
-
width: 5px;
|
|
461
|
-
height: 5px;
|
|
462
|
-
border-radius: 50%;
|
|
463
|
-
background-color: var(--color-text-muted);
|
|
464
|
-
animation: typing-bounce 1.4s ease-in-out infinite;
|
|
465
|
-
}
|
|
466
|
-
.typing-dots span:nth-child(2) { animation-delay: 0.2s; }
|
|
467
|
-
.typing-dots span:nth-child(3) { animation-delay: 0.4s; }
|
|
468
|
-
@keyframes typing-bounce {
|
|
469
|
-
0%, 80%, 100% { transform: scale(0.7); opacity: 0.5; }
|
|
470
|
-
40% { transform: scale(1); opacity: 1; }
|
|
471
|
-
>>>>>>> 6bfde951cbeb65ec72b73da9c23b9c8c0ba0bbc1
|
|
472
270
|
}
|
|
473
271
|
|
|
474
272
|
.conversation-item {
|
|
@@ -484,34 +282,6 @@
|
|
|
484
282
|
overflow: hidden;
|
|
485
283
|
}
|
|
486
284
|
|
|
487
|
-
<<<<<<< HEAD
|
|
488
|
-
=======
|
|
489
|
-
/* Date group headers in sidebar */
|
|
490
|
-
.conv-date-group-header {
|
|
491
|
-
padding: 0.5rem 1.25rem 0.25rem;
|
|
492
|
-
font-size: 0.7rem;
|
|
493
|
-
font-weight: 600;
|
|
494
|
-
text-transform: uppercase;
|
|
495
|
-
letter-spacing: 0.06em;
|
|
496
|
-
color: var(--color-text-muted);
|
|
497
|
-
position: sticky;
|
|
498
|
-
top: 0;
|
|
499
|
-
background: var(--color-bg-secondary);
|
|
500
|
-
z-index: 1;
|
|
501
|
-
margin-top: 0.5rem;
|
|
502
|
-
}
|
|
503
|
-
.conv-date-group-header:first-child { margin-top: 0; }
|
|
504
|
-
|
|
505
|
-
/* Agent color dot */
|
|
506
|
-
.agent-color-dot {
|
|
507
|
-
width: 8px;
|
|
508
|
-
height: 8px;
|
|
509
|
-
border-radius: 50%;
|
|
510
|
-
flex-shrink: 0;
|
|
511
|
-
margin-right: 0.375rem;
|
|
512
|
-
}
|
|
513
|
-
|
|
514
|
-
>>>>>>> 6bfde951cbeb65ec72b73da9c23b9c8c0ba0bbc1
|
|
515
285
|
.conversation-item.pinned { cursor: grab; }
|
|
516
286
|
.conversation-item.pinned:active { cursor: grabbing; }
|
|
517
287
|
.conversation-item-checkbox {
|
|
@@ -569,25 +339,14 @@
|
|
|
569
339
|
.conversation-item.active .conversation-item-delete,
|
|
570
340
|
.conversation-item.active .conversation-item-archive,
|
|
571
341
|
.conversation-item.active .conversation-item-export {
|
|
572
|
-
<<<<<<< HEAD
|
|
573
342
|
color: rgba(255,255,255,0.8);
|
|
574
|
-
=======
|
|
575
|
-
color: var(--color-primary);
|
|
576
|
-
opacity: 0.7;
|
|
577
|
-
>>>>>>> 6bfde951cbeb65ec72b73da9c23b9c8c0ba0bbc1
|
|
578
343
|
}
|
|
579
344
|
|
|
580
345
|
.conversation-item.active .conversation-item-delete:hover,
|
|
581
346
|
.conversation-item.active .conversation-item-archive:hover,
|
|
582
347
|
.conversation-item.active .conversation-item-export:hover {
|
|
583
|
-
<<<<<<< HEAD
|
|
584
348
|
background-color: rgba(255,255,255,0.2);
|
|
585
349
|
color: white;
|
|
586
|
-
=======
|
|
587
|
-
background-color: rgba(var(--color-primary-rgb),0.15);
|
|
588
|
-
color: var(--color-primary);
|
|
589
|
-
opacity: 1;
|
|
590
|
-
>>>>>>> 6bfde951cbeb65ec72b73da9c23b9c8c0ba0bbc1
|
|
591
350
|
}
|
|
592
351
|
|
|
593
352
|
.sidebar-empty {
|
|
@@ -613,18 +372,10 @@
|
|
|
613
372
|
align-items: center;
|
|
614
373
|
gap: 0.75rem;
|
|
615
374
|
padding: 0 1rem;
|
|
616
|
-
<<<<<<< HEAD
|
|
617
375
|
height: var(--header-height);
|
|
618
376
|
min-height: var(--header-height);
|
|
619
377
|
flex-shrink: 0;
|
|
620
378
|
background-color: var(--color-bg-secondary);
|
|
621
|
-
=======
|
|
622
|
-
height: 48px;
|
|
623
|
-
min-height: 48px;
|
|
624
|
-
flex-shrink: 0;
|
|
625
|
-
background: var(--color-bg-primary);
|
|
626
|
-
border-bottom: 1px solid var(--color-border);
|
|
627
|
-
>>>>>>> 6bfde951cbeb65ec72b73da9c23b9c8c0ba0bbc1
|
|
628
379
|
}
|
|
629
380
|
|
|
630
381
|
.sidebar-toggle-btn {
|
|
@@ -654,14 +405,8 @@
|
|
|
654
405
|
}
|
|
655
406
|
|
|
656
407
|
.header-title {
|
|
657
|
-
<<<<<<< HEAD
|
|
658
408
|
font-size: 1.125rem;
|
|
659
409
|
font-weight: 600;
|
|
660
|
-
=======
|
|
661
|
-
font-size: 0.9375rem;
|
|
662
|
-
font-weight: 600;
|
|
663
|
-
letter-spacing: -0.01em;
|
|
664
|
-
>>>>>>> 6bfde951cbeb65ec72b73da9c23b9c8c0ba0bbc1
|
|
665
410
|
margin: 0;
|
|
666
411
|
flex: 1;
|
|
667
412
|
min-width: 0;
|
|
@@ -824,87 +569,6 @@
|
|
|
824
569
|
flex-direction: column;
|
|
825
570
|
}
|
|
826
571
|
|
|
827
|
-
<<<<<<< HEAD
|
|
828
|
-
=======
|
|
829
|
-
/* ===== MESSAGE BUBBLES ===== */
|
|
830
|
-
.message-user-bubble {
|
|
831
|
-
display: flex;
|
|
832
|
-
justify-content: flex-end;
|
|
833
|
-
margin: 0.75rem 0;
|
|
834
|
-
padding: 0 1rem;
|
|
835
|
-
}
|
|
836
|
-
|
|
837
|
-
.message-user-bubble .bubble-content {
|
|
838
|
-
max-width: 75%;
|
|
839
|
-
background: var(--color-primary);
|
|
840
|
-
color: white;
|
|
841
|
-
padding: 0.625rem 0.875rem;
|
|
842
|
-
border-radius: 18px 18px 4px 18px;
|
|
843
|
-
font-size: 0.9375rem;
|
|
844
|
-
line-height: 1.5;
|
|
845
|
-
word-break: break-word;
|
|
846
|
-
}
|
|
847
|
-
|
|
848
|
-
html.dark .message-user-bubble .bubble-content {
|
|
849
|
-
background: var(--color-primary);
|
|
850
|
-
}
|
|
851
|
-
|
|
852
|
-
.message-agent-row {
|
|
853
|
-
display: flex;
|
|
854
|
-
align-items: flex-start;
|
|
855
|
-
gap: 0.625rem;
|
|
856
|
-
margin: 0.5rem 0;
|
|
857
|
-
padding: 0 0.5rem;
|
|
858
|
-
}
|
|
859
|
-
|
|
860
|
-
.message-agent-icon {
|
|
861
|
-
width: 28px;
|
|
862
|
-
height: 28px;
|
|
863
|
-
border-radius: 50%;
|
|
864
|
-
display: flex;
|
|
865
|
-
align-items: center;
|
|
866
|
-
justify-content: center;
|
|
867
|
-
font-size: 0.75rem;
|
|
868
|
-
font-weight: 700;
|
|
869
|
-
color: white;
|
|
870
|
-
flex-shrink: 0;
|
|
871
|
-
margin-top: 2px;
|
|
872
|
-
}
|
|
873
|
-
|
|
874
|
-
/* Per-message hover actions */
|
|
875
|
-
.message-actions {
|
|
876
|
-
position: absolute;
|
|
877
|
-
top: -12px;
|
|
878
|
-
right: 8px;
|
|
879
|
-
display: flex;
|
|
880
|
-
gap: 0.25rem;
|
|
881
|
-
opacity: 0;
|
|
882
|
-
transition: opacity var(--transition-fast);
|
|
883
|
-
background: var(--color-bg-primary);
|
|
884
|
-
border: 1px solid var(--color-border);
|
|
885
|
-
border-radius: var(--radius-sm);
|
|
886
|
-
padding: 0.125rem 0.25rem;
|
|
887
|
-
box-shadow: var(--shadow-sm);
|
|
888
|
-
}
|
|
889
|
-
.message-wrapper:hover .message-actions { opacity: 1; }
|
|
890
|
-
.message-action-btn {
|
|
891
|
-
width: 24px;
|
|
892
|
-
height: 24px;
|
|
893
|
-
display: flex;
|
|
894
|
-
align-items: center;
|
|
895
|
-
justify-content: center;
|
|
896
|
-
background: none;
|
|
897
|
-
border: none;
|
|
898
|
-
cursor: pointer;
|
|
899
|
-
color: var(--color-text-secondary);
|
|
900
|
-
border-radius: 3px;
|
|
901
|
-
transition: background-color var(--transition-fast);
|
|
902
|
-
}
|
|
903
|
-
.message-action-btn:hover { background: var(--color-bg-secondary); color: var(--color-text-primary); }
|
|
904
|
-
.message-action-btn svg { width: 13px; height: 13px; }
|
|
905
|
-
.message-wrapper { position: relative; }
|
|
906
|
-
|
|
907
|
-
>>>>>>> 6bfde951cbeb65ec72b73da9c23b9c8c0ba0bbc1
|
|
908
572
|
#output {
|
|
909
573
|
display: flex;
|
|
910
574
|
flex-direction: column;
|
|
@@ -1151,7 +815,6 @@
|
|
|
1151
815
|
white-space: nowrap;
|
|
1152
816
|
}
|
|
1153
817
|
|
|
1154
|
-
<<<<<<< HEAD
|
|
1155
818
|
/* --- Input area: fixed at bottom --- */
|
|
1156
819
|
.input-section {
|
|
1157
820
|
flex-shrink: 0;
|
|
@@ -1159,130 +822,6 @@
|
|
|
1159
822
|
padding: 0.75rem 1rem;
|
|
1160
823
|
}
|
|
1161
824
|
|
|
1162
|
-
=======
|
|
1163
|
-
/* ===== INPUT AREA REDESIGN ===== */
|
|
1164
|
-
.input-section {
|
|
1165
|
-
flex-shrink: 0;
|
|
1166
|
-
padding: 0.75rem 1rem 1rem;
|
|
1167
|
-
background: var(--color-bg-primary);
|
|
1168
|
-
border-top: 1px solid var(--color-border);
|
|
1169
|
-
}
|
|
1170
|
-
|
|
1171
|
-
.input-card {
|
|
1172
|
-
max-width: var(--msg-max-width);
|
|
1173
|
-
margin: 0 auto;
|
|
1174
|
-
background: var(--color-bg-input);
|
|
1175
|
-
border: 1px solid var(--color-border-strong);
|
|
1176
|
-
border-radius: var(--radius-xl);
|
|
1177
|
-
box-shadow: var(--shadow-md);
|
|
1178
|
-
overflow: hidden;
|
|
1179
|
-
transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
|
|
1180
|
-
}
|
|
1181
|
-
|
|
1182
|
-
.input-card:focus-within {
|
|
1183
|
-
border-color: var(--color-primary);
|
|
1184
|
-
box-shadow: 0 0 0 3px rgba(var(--color-primary-rgb),0.12), var(--shadow-md);
|
|
1185
|
-
}
|
|
1186
|
-
|
|
1187
|
-
.input-card-textarea {
|
|
1188
|
-
width: 100%;
|
|
1189
|
-
padding: 0.875rem 1rem 0.5rem;
|
|
1190
|
-
background: transparent;
|
|
1191
|
-
border: none;
|
|
1192
|
-
outline: none;
|
|
1193
|
-
resize: none;
|
|
1194
|
-
font-size: 0.9375rem;
|
|
1195
|
-
font-family: inherit;
|
|
1196
|
-
color: var(--color-text-primary);
|
|
1197
|
-
line-height: 1.6;
|
|
1198
|
-
max-height: 180px;
|
|
1199
|
-
overflow-y: auto;
|
|
1200
|
-
}
|
|
1201
|
-
|
|
1202
|
-
.input-card-textarea::placeholder { color: var(--color-text-muted); }
|
|
1203
|
-
|
|
1204
|
-
.input-card-toolbar {
|
|
1205
|
-
display: flex;
|
|
1206
|
-
align-items: center;
|
|
1207
|
-
padding: 0.5rem 0.75rem 0.625rem;
|
|
1208
|
-
gap: 0.5rem;
|
|
1209
|
-
border-top: 1px solid var(--color-border);
|
|
1210
|
-
}
|
|
1211
|
-
|
|
1212
|
-
.input-card-selectors {
|
|
1213
|
-
display: flex;
|
|
1214
|
-
align-items: center;
|
|
1215
|
-
gap: 0.375rem;
|
|
1216
|
-
flex: 1;
|
|
1217
|
-
min-width: 0;
|
|
1218
|
-
overflow: hidden;
|
|
1219
|
-
}
|
|
1220
|
-
|
|
1221
|
-
.input-chip-select {
|
|
1222
|
-
padding: 0.3rem 0.5rem;
|
|
1223
|
-
font-size: 0.775rem;
|
|
1224
|
-
font-weight: 500;
|
|
1225
|
-
border: 1px solid var(--color-border);
|
|
1226
|
-
border-radius: 999px;
|
|
1227
|
-
background: var(--color-bg-secondary);
|
|
1228
|
-
color: var(--color-text-secondary);
|
|
1229
|
-
cursor: pointer;
|
|
1230
|
-
outline: none;
|
|
1231
|
-
transition: border-color var(--transition-fast), background-color var(--transition-fast);
|
|
1232
|
-
max-width: 130px;
|
|
1233
|
-
white-space: nowrap;
|
|
1234
|
-
overflow: hidden;
|
|
1235
|
-
text-overflow: ellipsis;
|
|
1236
|
-
}
|
|
1237
|
-
|
|
1238
|
-
.input-chip-select:hover, .input-chip-select:focus {
|
|
1239
|
-
border-color: var(--color-primary);
|
|
1240
|
-
color: var(--color-text-primary);
|
|
1241
|
-
}
|
|
1242
|
-
|
|
1243
|
-
.input-card-actions {
|
|
1244
|
-
display: flex;
|
|
1245
|
-
align-items: center;
|
|
1246
|
-
gap: 0.375rem;
|
|
1247
|
-
flex-shrink: 0;
|
|
1248
|
-
}
|
|
1249
|
-
|
|
1250
|
-
.input-icon-btn {
|
|
1251
|
-
width: 32px;
|
|
1252
|
-
height: 32px;
|
|
1253
|
-
display: flex;
|
|
1254
|
-
align-items: center;
|
|
1255
|
-
justify-content: center;
|
|
1256
|
-
background: none;
|
|
1257
|
-
border: none;
|
|
1258
|
-
border-radius: var(--radius-sm);
|
|
1259
|
-
cursor: pointer;
|
|
1260
|
-
color: var(--color-text-secondary);
|
|
1261
|
-
transition: background-color var(--transition-fast), color var(--transition-fast);
|
|
1262
|
-
}
|
|
1263
|
-
.input-icon-btn:hover { background: var(--color-bg-secondary); color: var(--color-text-primary); }
|
|
1264
|
-
.input-icon-btn svg { width: 16px; height: 16px; }
|
|
1265
|
-
|
|
1266
|
-
.input-send-btn {
|
|
1267
|
-
width: 34px;
|
|
1268
|
-
height: 34px;
|
|
1269
|
-
display: flex;
|
|
1270
|
-
align-items: center;
|
|
1271
|
-
justify-content: center;
|
|
1272
|
-
background: var(--color-primary);
|
|
1273
|
-
border: none;
|
|
1274
|
-
border-radius: var(--radius-md);
|
|
1275
|
-
cursor: pointer;
|
|
1276
|
-
color: white;
|
|
1277
|
-
transition: background-color var(--transition-fast), transform 0.1s;
|
|
1278
|
-
flex-shrink: 0;
|
|
1279
|
-
}
|
|
1280
|
-
.input-send-btn:hover { background: var(--color-primary-dark); }
|
|
1281
|
-
.input-send-btn:active { transform: scale(0.95); }
|
|
1282
|
-
.input-send-btn:disabled { opacity: 0.4; cursor: not-allowed; transform: none; }
|
|
1283
|
-
.input-send-btn svg { width: 16px; height: 16px; }
|
|
1284
|
-
|
|
1285
|
-
>>>>>>> 6bfde951cbeb65ec72b73da9c23b9c8c0ba0bbc1
|
|
1286
825
|
.input-wrapper {
|
|
1287
826
|
max-width: var(--msg-max-width);
|
|
1288
827
|
margin: 0 auto;
|
|
@@ -1545,15 +1084,9 @@
|
|
|
1545
1084
|
.permanently-expanded > summary::marker { display: none; content: ''; }
|
|
1546
1085
|
|
|
1547
1086
|
/* ===== Folder Browser Modal ===== */
|
|
1548
|
-
<<<<<<< HEAD
|
|
1549
1087
|
.folder-modal-overlay { display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:2000; align-items:center; justify-content:center; }
|
|
1550
1088
|
.folder-modal-overlay.visible { display:flex; }
|
|
1551
1089
|
.folder-modal { background:var(--color-bg-primary); border-radius:0.5rem; width:500px; max-width:90vw; max-height:80vh; display:flex; flex-direction:column; box-shadow:0 20px 60px rgba(0,0,0,0.3); }
|
|
1552
|
-
=======
|
|
1553
|
-
.folder-modal-overlay { display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); z-index:2000; align-items:center; justify-content:center; transition:opacity 0.15s ease; animation:fadeIn 0.15s ease; }
|
|
1554
|
-
.folder-modal-overlay.visible { display:flex; }
|
|
1555
|
-
.folder-modal { background:var(--color-bg-primary); border-radius:var(--radius-xl); width:500px; max-width:90vw; max-height:80vh; display:flex; flex-direction:column; box-shadow:var(--shadow-lg); animation:scaleIn 0.15s ease; }
|
|
1556
|
-
>>>>>>> 6bfde951cbeb65ec72b73da9c23b9c8c0ba0bbc1
|
|
1557
1090
|
.folder-modal-header { padding:1rem; display:flex; justify-content:space-between; align-items:center; flex-shrink:0; }
|
|
1558
1091
|
.folder-modal-header h3 { margin:0; font-size:1rem; font-weight:600; }
|
|
1559
1092
|
.folder-modal-close { background:none; border:none; font-size:1.25rem; cursor:pointer; color:var(--color-text-secondary); padding:0.25rem; line-height:1; }
|
|
@@ -1573,18 +1106,6 @@
|
|
|
1573
1106
|
.folder-modal-footer { padding:0.75rem 1rem; display:flex; justify-content:flex-end; gap:0.5rem; flex-shrink:0; }
|
|
1574
1107
|
.folder-modal-footer .btn { padding:0.5rem 1rem; font-size:0.8rem; }
|
|
1575
1108
|
|
|
1576
|
-
<<<<<<< HEAD
|
|
1577
|
-
=======
|
|
1578
|
-
@keyframes fadeIn {
|
|
1579
|
-
from { opacity: 0; }
|
|
1580
|
-
to { opacity: 1; }
|
|
1581
|
-
}
|
|
1582
|
-
@keyframes scaleIn {
|
|
1583
|
-
from { opacity: 0; transform: scale(0.96); }
|
|
1584
|
-
to { opacity: 1; transform: scale(1); }
|
|
1585
|
-
}
|
|
1586
|
-
|
|
1587
|
-
>>>>>>> 6bfde951cbeb65ec72b73da9c23b9c8c0ba0bbc1
|
|
1588
1109
|
.btn { padding:0.5rem 1rem; border:none; border-radius:0.375rem; font-weight:500; cursor:pointer; transition:all 0.15s; font-size:0.875rem; }
|
|
1589
1110
|
.btn-primary { background-color:var(--color-primary); color:white; }
|
|
1590
1111
|
.btn-primary:hover:not(:disabled) { background-color:var(--color-primary-dark); }
|
|
@@ -1707,18 +1228,6 @@
|
|
|
1707
1228
|
scrollbar-color: #475569 transparent;
|
|
1708
1229
|
}
|
|
1709
1230
|
|
|
1710
|
-
<<<<<<< HEAD
|
|
1711
|
-
=======
|
|
1712
|
-
/* Modern thin scrollbars */
|
|
1713
|
-
.sidebar-list, #output-scroll, .message-scroll-area {
|
|
1714
|
-
scrollbar-width: thin;
|
|
1715
|
-
scrollbar-color: transparent transparent;
|
|
1716
|
-
}
|
|
1717
|
-
.sidebar-list:hover, #output-scroll:hover {
|
|
1718
|
-
scrollbar-color: var(--color-border-strong) transparent;
|
|
1719
|
-
}
|
|
1720
|
-
|
|
1721
|
-
>>>>>>> 6bfde951cbeb65ec72b73da9c23b9c8c0ba0bbc1
|
|
1722
1231
|
.voice-mic-btn {
|
|
1723
1232
|
position: absolute;
|
|
1724
1233
|
top: 4px;
|
|
@@ -1974,133 +1483,6 @@
|
|
|
1974
1483
|
.icon-sm svg { width: 1rem !important; height: 1rem !important; }
|
|
1975
1484
|
.icon-lg svg { width: 1.5rem !important; height: 1.5rem !important; }
|
|
1976
1485
|
|
|
1977
|
-
<<<<<<< HEAD
|
|
1978
|
-
=======
|
|
1979
|
-
/* ===== STREAMING STATUS BAR ===== */
|
|
1980
|
-
.streaming-status-bar {
|
|
1981
|
-
max-width: var(--msg-max-width);
|
|
1982
|
-
margin: 0 auto 0.5rem;
|
|
1983
|
-
padding: 0.5rem 1rem;
|
|
1984
|
-
background: rgba(var(--color-primary-rgb), 0.06);
|
|
1985
|
-
border: 1px solid rgba(var(--color-primary-rgb), 0.15);
|
|
1986
|
-
border-radius: var(--radius-lg);
|
|
1987
|
-
display: none;
|
|
1988
|
-
align-items: center;
|
|
1989
|
-
gap: 0.625rem;
|
|
1990
|
-
font-size: 0.825rem;
|
|
1991
|
-
color: var(--color-primary);
|
|
1992
|
-
animation: slideUpFade 0.2s ease;
|
|
1993
|
-
}
|
|
1994
|
-
.streaming-status-bar.visible { display: flex; }
|
|
1995
|
-
.streaming-status-bar .status-agent-name { font-weight: 600; }
|
|
1996
|
-
.streaming-status-bar .status-cancel-btn {
|
|
1997
|
-
margin-left: auto;
|
|
1998
|
-
padding: 0.2rem 0.625rem;
|
|
1999
|
-
font-size: 0.75rem;
|
|
2000
|
-
background: none;
|
|
2001
|
-
border: 1px solid rgba(var(--color-primary-rgb), 0.3);
|
|
2002
|
-
border-radius: 999px;
|
|
2003
|
-
cursor: pointer;
|
|
2004
|
-
color: var(--color-primary);
|
|
2005
|
-
transition: background-color var(--transition-fast);
|
|
2006
|
-
}
|
|
2007
|
-
.streaming-status-bar .status-cancel-btn:hover { background: rgba(var(--color-primary-rgb), 0.1); }
|
|
2008
|
-
@keyframes slideUpFade {
|
|
2009
|
-
from { opacity: 0; transform: translateY(4px); }
|
|
2010
|
-
to { opacity: 1; transform: translateY(0); }
|
|
2011
|
-
}
|
|
2012
|
-
|
|
2013
|
-
/* ===== WELCOME EMPTY STATE ===== */
|
|
2014
|
-
.welcome-screen {
|
|
2015
|
-
display: none;
|
|
2016
|
-
flex-direction: column;
|
|
2017
|
-
align-items: center;
|
|
2018
|
-
justify-content: center;
|
|
2019
|
-
flex: 1;
|
|
2020
|
-
padding: 2rem 1.5rem;
|
|
2021
|
-
text-align: center;
|
|
2022
|
-
gap: 1.5rem;
|
|
2023
|
-
}
|
|
2024
|
-
.welcome-screen.visible { display: flex; }
|
|
2025
|
-
|
|
2026
|
-
.welcome-logo {
|
|
2027
|
-
width: 56px;
|
|
2028
|
-
height: 56px;
|
|
2029
|
-
background: linear-gradient(135deg, var(--color-primary), var(--color-primary-dark));
|
|
2030
|
-
border-radius: var(--radius-xl);
|
|
2031
|
-
display: flex;
|
|
2032
|
-
align-items: center;
|
|
2033
|
-
justify-content: center;
|
|
2034
|
-
color: white;
|
|
2035
|
-
font-weight: 800;
|
|
2036
|
-
font-size: 1.5rem;
|
|
2037
|
-
box-shadow: var(--shadow-md);
|
|
2038
|
-
}
|
|
2039
|
-
|
|
2040
|
-
.welcome-title {
|
|
2041
|
-
font-size: 1.5rem;
|
|
2042
|
-
font-weight: 700;
|
|
2043
|
-
color: var(--color-text-primary);
|
|
2044
|
-
letter-spacing: -0.02em;
|
|
2045
|
-
margin: 0;
|
|
2046
|
-
}
|
|
2047
|
-
|
|
2048
|
-
.welcome-subtitle {
|
|
2049
|
-
font-size: 0.9375rem;
|
|
2050
|
-
color: var(--color-text-secondary);
|
|
2051
|
-
margin: -0.75rem 0 0;
|
|
2052
|
-
}
|
|
2053
|
-
|
|
2054
|
-
.welcome-agents-grid {
|
|
2055
|
-
display: grid;
|
|
2056
|
-
grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
|
|
2057
|
-
gap: 0.75rem;
|
|
2058
|
-
width: 100%;
|
|
2059
|
-
max-width: 640px;
|
|
2060
|
-
}
|
|
2061
|
-
|
|
2062
|
-
.welcome-agent-card {
|
|
2063
|
-
padding: 0.875rem 1rem;
|
|
2064
|
-
background: var(--color-bg-secondary);
|
|
2065
|
-
border: 1px solid var(--color-border);
|
|
2066
|
-
border-radius: var(--radius-lg);
|
|
2067
|
-
cursor: pointer;
|
|
2068
|
-
transition: all var(--transition-fast);
|
|
2069
|
-
text-align: left;
|
|
2070
|
-
display: flex;
|
|
2071
|
-
flex-direction: column;
|
|
2072
|
-
gap: 0.375rem;
|
|
2073
|
-
}
|
|
2074
|
-
.welcome-agent-card:hover {
|
|
2075
|
-
border-color: var(--color-primary);
|
|
2076
|
-
background: rgba(var(--color-primary-rgb), 0.04);
|
|
2077
|
-
box-shadow: var(--shadow-sm);
|
|
2078
|
-
}
|
|
2079
|
-
|
|
2080
|
-
.welcome-agent-icon {
|
|
2081
|
-
width: 32px;
|
|
2082
|
-
height: 32px;
|
|
2083
|
-
border-radius: var(--radius-sm);
|
|
2084
|
-
display: flex;
|
|
2085
|
-
align-items: center;
|
|
2086
|
-
justify-content: center;
|
|
2087
|
-
font-size: 1rem;
|
|
2088
|
-
margin-bottom: 0.25rem;
|
|
2089
|
-
}
|
|
2090
|
-
|
|
2091
|
-
.welcome-agent-name {
|
|
2092
|
-
font-size: 0.825rem;
|
|
2093
|
-
font-weight: 600;
|
|
2094
|
-
color: var(--color-text-primary);
|
|
2095
|
-
}
|
|
2096
|
-
|
|
2097
|
-
.welcome-agent-desc {
|
|
2098
|
-
font-size: 0.7375rem;
|
|
2099
|
-
color: var(--color-text-muted);
|
|
2100
|
-
line-height: 1.4;
|
|
2101
|
-
}
|
|
2102
|
-
|
|
2103
|
-
>>>>>>> 6bfde951cbeb65ec72b73da9c23b9c8c0ba0bbc1
|
|
2104
1486
|
/* ===== STREAMING BLOCK STYLES ===== */
|
|
2105
1487
|
.block-text {
|
|
2106
1488
|
margin-bottom: 0;
|