development-engine-vector 0.3.0__py3-none-any.whl

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.
dev/ui/static/web.css ADDED
@@ -0,0 +1,722 @@
1
+ :root {
2
+ --bg-primary: #f8fafc;
3
+ --bg-secondary: #eef2ff;
4
+ --bg-tertiary: #e0e7ff;
5
+ --text-primary: #1e293b;
6
+ --text-secondary: #475569;
7
+ --text-tertiary: #64748b;
8
+ --accent: #6366f1;
9
+ --accent-hover: #4f46e5;
10
+ --danger: #ef4444;
11
+ --success: #10b981;
12
+ --warning: #f59e0b;
13
+ --border: #cbd5e1;
14
+ --input-bg: #ffffff;
15
+ --input-border: #cbd5e1;
16
+ --input-focus: #6366f1;
17
+ --shadow: 0 1px 3px rgba(0,0,0,0.1);
18
+ --shadow-md: 0 4px 6px rgba(0,0,0,0.1);
19
+ --transition: all 0.2s ease-in-out;
20
+ }
21
+
22
+ * { margin: 0; padding: 0; box-sizing: border-box; }
23
+ html, body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
24
+ body {
25
+ background: var(--bg-primary);
26
+ color: var(--text-primary);
27
+ overflow-x: hidden;
28
+ }
29
+
30
+ #root {
31
+ display: flex;
32
+ height: 100vh;
33
+ }
34
+
35
+ .sidebar {
36
+ width: 240px;
37
+ background: #ffffff;
38
+ border-right: 1px solid var(--border);
39
+ overflow-y: auto;
40
+ padding: 20px 0;
41
+ }
42
+
43
+ .content {
44
+ flex: 1;
45
+ min-width: 0;
46
+ overflow: auto;
47
+ padding: 24px;
48
+ }
49
+
50
+ .sidebar-header {
51
+ padding: 0 20px 20px;
52
+ border-bottom: 1px solid var(--border);
53
+ margin-bottom: 10px;
54
+ }
55
+
56
+ .sidebar-title {
57
+ font-weight: 700;
58
+ font-size: 14px;
59
+ color: var(--text-secondary);
60
+ text-transform: uppercase;
61
+ letter-spacing: 0.5px;
62
+ }
63
+
64
+ .nav-group {
65
+ margin-bottom: 15px;
66
+ }
67
+
68
+ .nav-group-title {
69
+ padding: 8px 20px;
70
+ font-size: 11px;
71
+ font-weight: 600;
72
+ color: var(--text-tertiary);
73
+ text-transform: uppercase;
74
+ letter-spacing: 0.5px;
75
+ margin-top: 10px;
76
+ }
77
+
78
+ .nav-item {
79
+ padding: 10px 20px;
80
+ cursor: pointer;
81
+ color: var(--text-secondary);
82
+ font-size: 13px;
83
+ transition: var(--transition);
84
+ border-left: 3px solid transparent;
85
+ display: flex;
86
+ align-items: center;
87
+ }
88
+
89
+ .nav-item .icon {
90
+ display: inline-flex;
91
+ align-items: center;
92
+ justify-content: center;
93
+ width: 16px;
94
+ height: 16px;
95
+ margin-right: 10px;
96
+ stroke: currentColor;
97
+ fill: none;
98
+ }
99
+
100
+ .nav-item:hover {
101
+ background: var(--bg-secondary);
102
+ color: var(--accent);
103
+ }
104
+
105
+ .nav-item.active {
106
+ background: var(--bg-tertiary);
107
+ color: var(--accent);
108
+ border-left-color: var(--accent);
109
+ font-weight: 600;
110
+ }
111
+
112
+ .page-header {
113
+ display: flex;
114
+ justify-content: space-between;
115
+ align-items: flex-end;
116
+ gap: 16px;
117
+ margin-bottom: 20px;
118
+ }
119
+
120
+ .page-title {
121
+ font-size: 22px;
122
+ font-weight: 700;
123
+ color: var(--text-primary);
124
+ }
125
+
126
+ .page-subtitle {
127
+ color: var(--text-secondary);
128
+ font-size: 13px;
129
+ line-height: 1.4;
130
+ }
131
+
132
+ .drawer {
133
+ position: fixed;
134
+ inset: 0;
135
+ z-index: 1000;
136
+ display: flex;
137
+ pointer-events: none;
138
+ opacity: 0;
139
+ visibility: hidden;
140
+ transition: opacity 0.3s ease, backdrop-filter 0.3s ease;
141
+ backdrop-filter: blur(0px);
142
+ }
143
+
144
+ .drawer.open {
145
+ pointer-events: auto;
146
+ opacity: 1;
147
+ visibility: visible;
148
+ backdrop-filter: blur(4px);
149
+ }
150
+
151
+ .drawer-backdrop {
152
+ position: absolute;
153
+ inset: 0;
154
+ background: rgba(15, 23, 42, 0.6);
155
+ cursor: pointer;
156
+ }
157
+
158
+ .drawer-panel {
159
+ position: absolute;
160
+ inset: 40px;
161
+ top: 40px;
162
+ bottom: 40px;
163
+ background: #ffffff;
164
+ border-radius: 12px;
165
+ box-shadow: 0 20px 60px rgba(15, 23, 42, 0.3);
166
+ transform: scale(0.95) translateY(20px);
167
+ transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
168
+ display: flex;
169
+ flex-direction: column;
170
+ overflow: hidden;
171
+ }
172
+
173
+ .drawer.open .drawer-panel {
174
+ transform: scale(1) translateY(0);
175
+ }
176
+
177
+ .drawer-header {
178
+ padding: 24px 24px 0;
179
+ display: flex;
180
+ justify-content: space-between;
181
+ align-items: flex-start;
182
+ gap: 16px;
183
+ flex-shrink: 0;
184
+ }
185
+
186
+ .drawer-title {
187
+ display: flex;
188
+ flex-direction: column;
189
+ gap: 4px;
190
+ flex: 1;
191
+ }
192
+
193
+ .drawer-title .title {
194
+ font-size: 20px;
195
+ font-weight: 700;
196
+ color: var(--text-primary);
197
+ letter-spacing: -0.3px;
198
+ }
199
+
200
+ .drawer-title .subtitle {
201
+ color: var(--text-secondary);
202
+ font-size: 13px;
203
+ font-weight: 500;
204
+ }
205
+
206
+ .drawer-tabs {
207
+ display: flex;
208
+ gap: 8px;
209
+ padding: 16px 24px 6px;
210
+ border-bottom: 1px solid var(--border);
211
+ overflow-x: auto;
212
+ flex-shrink: 0;
213
+ }
214
+
215
+ .drawer-tab {
216
+ padding: 12px 18px 14px;
217
+ border-radius: 8px 8px 0 0;
218
+ background: transparent;
219
+ color: var(--text-tertiary);
220
+ text-align: center;
221
+ font-size: 13px;
222
+ font-weight: 600;
223
+ cursor: pointer;
224
+ transition: var(--transition);
225
+ white-space: nowrap;
226
+ border-bottom: 3px solid transparent;
227
+ margin-bottom: 0;
228
+ }
229
+
230
+ .drawer-tab:hover {
231
+ color: var(--text-secondary);
232
+ background: rgba(236, 233, 255, 0.8);
233
+ }
234
+
235
+ .drawer-tab.active {
236
+ color: var(--accent);
237
+ box-shadow: inset 0 -3px 0 0 var(--accent);
238
+ background: transparent;
239
+ }
240
+
241
+ .drawer-list {
242
+ list-style: none;
243
+ margin: 0;
244
+ padding: 0;
245
+ display: flex;
246
+ flex-direction: column;
247
+ gap: 12px;
248
+ }
249
+
250
+ .drawer-list li {
251
+ background: var(--bg-secondary);
252
+ border-radius: 8px;
253
+ padding: 12px;
254
+ border-left: 3px solid var(--accent);
255
+ }
256
+
257
+ .drawer-list li strong {
258
+ display: block;
259
+ color: var(--text-primary);
260
+ font-weight: 600;
261
+ margin-bottom: 4px;
262
+ }
263
+
264
+ .drawer-list li span {
265
+ display: block;
266
+ color: var(--text-secondary);
267
+ font-size: 12px;
268
+ word-break: break-word;
269
+ }
270
+
271
+ .drawer-close {
272
+ border: none;
273
+ background: transparent;
274
+ color: var(--text-tertiary);
275
+ font-size: 28px;
276
+ cursor: pointer;
277
+ line-height: 1;
278
+ width: 40px;
279
+ height: 40px;
280
+ display: flex;
281
+ align-items: center;
282
+ justify-content: center;
283
+ border-radius: 6px;
284
+ transition: var(--transition);
285
+ flex-shrink: 0;
286
+ }
287
+
288
+ .drawer-close:hover {
289
+ background: var(--bg-secondary);
290
+ color: var(--text-primary);
291
+ }
292
+
293
+ .drawer-body {
294
+ padding: 24px;
295
+ overflow-y: auto;
296
+ flex: 1;
297
+ min-height: 0;
298
+ }
299
+
300
+ .drawer-section {
301
+ margin-bottom: 28px;
302
+ }
303
+
304
+ .drawer-section:last-child {
305
+ margin-bottom: 0;
306
+ }
307
+
308
+ .drawer-section h3 {
309
+ margin-bottom: 14px;
310
+ font-size: 12px;
311
+ text-transform: uppercase;
312
+ letter-spacing: 0.6px;
313
+ color: var(--text-secondary);
314
+ font-weight: 700;
315
+ }
316
+
317
+ .card-row {
318
+ display: flex;
319
+ justify-content: space-between;
320
+ gap: 12px;
321
+ margin-bottom: 12px;
322
+ color: var(--text-secondary);
323
+ font-size: 13px;
324
+ align-items: center;
325
+ padding: 8px 0;
326
+ border-bottom: 1px solid var(--border);
327
+ }
328
+
329
+ .card-row:last-child {
330
+ border-bottom: none;
331
+ }
332
+
333
+ .page-title {
334
+ font-size: 28px;
335
+ font-weight: 700;
336
+ color: var(--text-primary);
337
+ margin-bottom: 5px;
338
+ }
339
+
340
+ .page-subtitle {
341
+ font-size: 14px;
342
+ color: var(--text-secondary);
343
+ }
344
+
345
+ .grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 20px; }
346
+ .grid-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 20px; margin-bottom: 20px; }
347
+ .grid-4 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 20px; margin-bottom: 20px; }
348
+
349
+ .card {
350
+ background: #ffffff;
351
+ border: 1px solid var(--border);
352
+ border-radius: 8px;
353
+ padding: 20px;
354
+ box-shadow: var(--shadow);
355
+ transition: var(--transition);
356
+ }
357
+
358
+ .card:hover {
359
+ box-shadow: var(--shadow-md);
360
+ transform: translateY(-2px);
361
+ }
362
+
363
+ .card-header {
364
+ font-weight: 600;
365
+ font-size: 14px;
366
+ color: var(--text-secondary);
367
+ text-transform: uppercase;
368
+ letter-spacing: 0.5px;
369
+ margin-bottom: 12px;
370
+ }
371
+
372
+ .card-value {
373
+ font-size: 32px;
374
+ font-weight: 700;
375
+ color: var(--accent);
376
+ margin-bottom: 8px;
377
+ }
378
+
379
+ .card-label {
380
+ font-size: 13px;
381
+ color: var(--text-tertiary);
382
+ }
383
+
384
+ .form-group {
385
+ margin-bottom: 15px;
386
+ }
387
+
388
+ .form-label {
389
+ display: block;
390
+ font-weight: 600;
391
+ font-size: 13px;
392
+ margin-bottom: 6px;
393
+ color: var(--text-secondary);
394
+ text-transform: uppercase;
395
+ letter-spacing: 0.5px;
396
+ }
397
+
398
+ .form-input, .form-select, .form-textarea {
399
+ width: 100%;
400
+ padding: 10px 12px;
401
+ border: 1px solid var(--input-border);
402
+ border-radius: 6px;
403
+ background: var(--input-bg);
404
+ color: var(--text-primary);
405
+ font-size: 13px;
406
+ transition: var(--transition);
407
+ font-family: inherit;
408
+ }
409
+
410
+ .form-input:focus, .form-select:focus, .form-textarea:focus {
411
+ outline: none;
412
+ border-color: var(--input-focus);
413
+ box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1);
414
+ }
415
+
416
+ .form-textarea {
417
+ resize: vertical;
418
+ min-height: 100px;
419
+ }
420
+
421
+ .button {
422
+ padding: 10px 16px;
423
+ border: none;
424
+ border-radius: 6px;
425
+ font-weight: 600;
426
+ font-size: 13px;
427
+ cursor: pointer;
428
+ transition: var(--transition);
429
+ text-transform: uppercase;
430
+ letter-spacing: 0.5px;
431
+ }
432
+
433
+ .button-primary {
434
+ background: var(--accent);
435
+ color: white;
436
+ }
437
+
438
+ .button-primary:hover {
439
+ background: var(--accent-hover);
440
+ }
441
+
442
+ .button-secondary {
443
+ background: var(--bg-secondary);
444
+ color: var(--text-primary);
445
+ border: 1px solid var(--border);
446
+ }
447
+
448
+ .button-secondary:hover {
449
+ background: var(--bg-tertiary);
450
+ }
451
+
452
+ .button-danger {
453
+ background: var(--danger);
454
+ color: white;
455
+ }
456
+
457
+ .button-danger:hover {
458
+ opacity: 0.9;
459
+ }
460
+
461
+ .button:disabled {
462
+ opacity: 0.5;
463
+ cursor: not-allowed;
464
+ }
465
+
466
+ .table {
467
+ width: 100%;
468
+ border-collapse: collapse;
469
+ font-size: 13px;
470
+ margin-bottom: 20px;
471
+ }
472
+
473
+ .table thead {
474
+ background: var(--bg-secondary);
475
+ border-bottom: 2px solid var(--border);
476
+ }
477
+
478
+ .table th {
479
+ padding: 12px;
480
+ text-align: left;
481
+ font-weight: 600;
482
+ color: var(--text-secondary);
483
+ text-transform: uppercase;
484
+ font-size: 11px;
485
+ letter-spacing: 0.5px;
486
+ }
487
+
488
+ .table td {
489
+ padding: 12px;
490
+ border-bottom: 1px solid var(--border);
491
+ }
492
+
493
+ .table tr:hover {
494
+ background: var(--bg-secondary);
495
+ }
496
+
497
+ .table tr.clickable {
498
+ cursor: pointer;
499
+ }
500
+
501
+ .truncate {
502
+ overflow: hidden;
503
+ text-overflow: ellipsis;
504
+ white-space: nowrap;
505
+ max-width: 400px;
506
+ }
507
+
508
+ .badge {
509
+ display: inline-block;
510
+ padding: 4px 8px;
511
+ border-radius: 4px;
512
+ font-size: 11px;
513
+ font-weight: 600;
514
+ text-transform: uppercase;
515
+ letter-spacing: 0.5px;
516
+ }
517
+
518
+ .badge-info { background: var(--bg-tertiary); color: var(--accent); }
519
+ .badge-success { background: #d1fae5; color: var(--success); }
520
+ .badge-warning { background: #fef3c7; color: var(--warning); }
521
+ .badge-danger { background: #fee2e2; color: var(--danger); }
522
+
523
+ .alert {
524
+ padding: 12px 16px;
525
+ border-radius: 6px;
526
+ margin-bottom: 15px;
527
+ font-size: 13px;
528
+ border-left: 4px solid;
529
+ }
530
+
531
+ .alert-info {
532
+ background: #ede9fe;
533
+ border-left-color: var(--accent);
534
+ color: var(--accent);
535
+ }
536
+
537
+ .alert-success {
538
+ background: #d1fae5;
539
+ border-left-color: var(--success);
540
+ color: var(--success);
541
+ }
542
+
543
+ .alert-warning {
544
+ background: #fef3c7;
545
+ border-left-color: var(--warning);
546
+ color: var(--warning);
547
+ }
548
+
549
+ .alert-danger {
550
+ background: #fee2e2;
551
+ border-left-color: var(--danger);
552
+ color: var(--danger);
553
+ }
554
+
555
+ .hidden { display: none; }
556
+ .text-center { text-align: center; }
557
+ .text-muted { color: var(--text-tertiary); }
558
+ .mt-20 { margin-top: 20px; }
559
+ .mb-20 { margin-bottom: 20px; }
560
+ .gap-10 { gap: 10px; }
561
+
562
+ .loading {
563
+ text-align: center;
564
+ padding: 30px;
565
+ color: var(--text-tertiary);
566
+ }
567
+
568
+ .spinner {
569
+ border: 3px solid var(--bg-secondary);
570
+ border-top: 3px solid var(--accent);
571
+ border-radius: 50%;
572
+ width: 30px;
573
+ height: 30px;
574
+ animation: spin 1s linear infinite;
575
+ margin: 0 auto 10px;
576
+ }
577
+
578
+ @keyframes spin {
579
+ 0% { transform: rotate(0deg); }
580
+ 100% { transform: rotate(360deg); }
581
+ }
582
+
583
+ @media (max-width: 768px) {
584
+ .drawer-panel {
585
+ inset: 20px;
586
+ border-radius: 8px;
587
+ }
588
+
589
+ .drawer-header {
590
+ padding: 16px 16px 0;
591
+ }
592
+
593
+ .drawer-tabs {
594
+ padding: 12px 16px 0;
595
+ }
596
+
597
+ .drawer-body {
598
+ padding: 16px;
599
+ }
600
+
601
+ .drawer-tab {
602
+ padding: 10px 12px;
603
+ font-size: 12px;
604
+ }
605
+ }
606
+
607
+ @media (max-width: 480px) {
608
+ .drawer-panel {
609
+ inset: 0;
610
+ border-radius: 0;
611
+ }
612
+
613
+ .drawer {
614
+ backdrop-filter: none;
615
+ }
616
+
617
+ .drawer-backdrop {
618
+ display: none;
619
+ }
620
+ }
621
+
622
+ .button-group {
623
+ display: flex;
624
+ gap: 10px;
625
+ margin-bottom: 20px;
626
+ }
627
+
628
+ .button-group .button {
629
+ flex: 1;
630
+ }
631
+
632
+ .details-grid {
633
+ display: grid;
634
+ grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
635
+ gap: 20px;
636
+ margin-bottom: 20px;
637
+ }
638
+
639
+ .detail-item {
640
+ background: rgba(255, 255, 255, 0.92);
641
+ border: 1px solid rgba(148, 163, 184, 0.18);
642
+ padding: 18px;
643
+ border-radius: 12px;
644
+ min-height: 86px;
645
+ display: flex;
646
+ flex-direction: column;
647
+ justify-content: space-between;
648
+ }
649
+
650
+ .detail-label {
651
+ font-size: 11px;
652
+ font-weight: 600;
653
+ color: var(--text-secondary);
654
+ text-transform: uppercase;
655
+ letter-spacing: 0.5px;
656
+ margin-bottom: 10px;
657
+ }
658
+
659
+ .detail-value {
660
+ font-size: 16px;
661
+ color: var(--text-primary);
662
+ font-weight: 700;
663
+ word-break: break-word;
664
+ }
665
+
666
+ .session-panel {
667
+ background: var(--bg-secondary);
668
+ border: 1px solid var(--border);
669
+ border-radius: 12px;
670
+ overflow: hidden;
671
+ }
672
+
673
+ .session-panel .data-row {
674
+ display: flex;
675
+ justify-content: space-between;
676
+ align-items: center;
677
+ padding: 12px 18px;
678
+ border-bottom: 1px solid var(--border);
679
+ }
680
+
681
+ .session-panel .data-row:last-child {
682
+ border-bottom: none;
683
+ }
684
+
685
+ .session-panel .data-label {
686
+ color: var(--text-secondary);
687
+ font-size: 11px;
688
+ font-weight: 600;
689
+ text-transform: uppercase;
690
+ letter-spacing: 0.5px;
691
+ }
692
+
693
+ .session-panel .data-value {
694
+ color: var(--text-primary);
695
+ font-size: 14px;
696
+ font-weight: 700;
697
+ text-align: right;
698
+ min-width: 100px;
699
+ }
700
+
701
+ .code-block {
702
+ background: var(--bg-secondary);
703
+ padding: 15px;
704
+ border-radius: 6px;
705
+ overflow-x: auto;
706
+ font-family: "Monaco", "Menlo", monospace;
707
+ font-size: 12px;
708
+ color: var(--text-primary);
709
+ margin-bottom: 20px;
710
+ }
711
+
712
+ .status-indicator {
713
+ display: inline-block;
714
+ width: 8px;
715
+ height: 8px;
716
+ border-radius: 50%;
717
+ margin-right: 6px;
718
+ }
719
+
720
+ .status-online { background: var(--success); }
721
+ .status-offline { background: var(--danger); }
722
+ .status-idle { background: var(--warning); }