clay-server 2.7.0 → 2.7.1

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.
@@ -0,0 +1,546 @@
1
+ /* ============================
2
+ Scheduler — Edit Modal
3
+ ============================ */
4
+
5
+ #schedule-edit-modal {
6
+ position: fixed;
7
+ inset: 0;
8
+ z-index: 310;
9
+ display: flex;
10
+ align-items: center;
11
+ justify-content: center;
12
+ }
13
+ #schedule-edit-modal.hidden { display: none; }
14
+
15
+ .schedule-edit-dialog {
16
+ width: 420px;
17
+ max-width: 90vw;
18
+ border-radius: 12px;
19
+ overflow: hidden;
20
+ }
21
+
22
+ .schedule-edit-header {
23
+ display: flex;
24
+ align-items: center;
25
+ justify-content: space-between;
26
+ padding: 14px 16px;
27
+ border-bottom: 1px solid var(--border);
28
+ background: var(--bg-alt);
29
+ }
30
+
31
+ .schedule-edit-title {
32
+ font-weight: 700;
33
+ font-size: 15px;
34
+ color: var(--text);
35
+ }
36
+
37
+ .schedule-edit-close {
38
+ background: none;
39
+ border: none;
40
+ color: var(--text-muted);
41
+ cursor: pointer;
42
+ font-size: 20px;
43
+ line-height: 1;
44
+ padding: 2px 4px;
45
+ }
46
+
47
+ .schedule-edit-close:hover {
48
+ color: var(--text);
49
+ }
50
+
51
+ .schedule-edit-body {
52
+ padding: 16px;
53
+ display: flex;
54
+ flex-direction: column;
55
+ gap: 14px;
56
+ max-height: 60vh;
57
+ overflow-y: auto;
58
+ }
59
+
60
+ /* --- Form fields --- */
61
+ .sched-field {
62
+ display: flex;
63
+ flex-direction: column;
64
+ gap: 4px;
65
+ }
66
+
67
+ .sched-field-label {
68
+ font-size: 12px;
69
+ font-weight: 700;
70
+ color: var(--text-secondary);
71
+ text-transform: uppercase;
72
+ letter-spacing: 0.04em;
73
+ }
74
+
75
+ .sched-field-input {
76
+ background: var(--input-bg, var(--bg-alt));
77
+ border: 1px solid var(--border);
78
+ border-radius: 6px;
79
+ padding: 8px 10px;
80
+ font-size: 14px;
81
+ color: var(--text);
82
+ outline: none;
83
+ font-family: inherit;
84
+ }
85
+
86
+ .sched-field-input:focus {
87
+ border-color: var(--accent);
88
+ box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 20%, transparent);
89
+ }
90
+
91
+ .sched-field-select {
92
+ background: var(--input-bg, var(--bg-alt));
93
+ border: 1px solid var(--border);
94
+ border-radius: 6px;
95
+ padding: 8px 10px;
96
+ font-size: 14px;
97
+ color: var(--text);
98
+ outline: none;
99
+ cursor: pointer;
100
+ appearance: none;
101
+ background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
102
+ background-repeat: no-repeat;
103
+ background-position: right 10px center;
104
+ padding-right: 30px;
105
+ }
106
+
107
+ .sched-field-select:focus {
108
+ border-color: var(--accent);
109
+ }
110
+
111
+ .sched-field-hint {
112
+ font-size: 11px;
113
+ color: var(--text-muted);
114
+ }
115
+
116
+ /* --- Repeat preset buttons --- */
117
+ .sched-preset-group {
118
+ display: flex;
119
+ flex-wrap: wrap;
120
+ gap: 6px;
121
+ }
122
+
123
+ .sched-preset-btn {
124
+ background: var(--bg-alt);
125
+ border: 1px solid var(--border);
126
+ color: var(--text-secondary);
127
+ cursor: pointer;
128
+ padding: 5px 12px;
129
+ border-radius: 6px;
130
+ font-size: 12px;
131
+ font-weight: 600;
132
+ transition: all 0.12s;
133
+ }
134
+
135
+ .sched-preset-btn:hover {
136
+ background: var(--hover);
137
+ color: var(--text);
138
+ }
139
+
140
+ .sched-preset-btn.active {
141
+ background: var(--accent);
142
+ color: #fff;
143
+ border-color: var(--accent);
144
+ }
145
+
146
+ /* --- Day-of-week picker --- */
147
+ .sched-dow-row {
148
+ display: flex;
149
+ gap: 4px;
150
+ }
151
+
152
+ .sched-dow-btn {
153
+ width: 36px;
154
+ height: 36px;
155
+ border-radius: 50%;
156
+ border: 1px solid var(--border);
157
+ background: var(--bg-alt);
158
+ color: var(--text-secondary);
159
+ cursor: pointer;
160
+ font-size: 12px;
161
+ font-weight: 700;
162
+ display: flex;
163
+ align-items: center;
164
+ justify-content: center;
165
+ transition: all 0.12s;
166
+ }
167
+
168
+ .sched-dow-btn:hover {
169
+ background: var(--hover);
170
+ color: var(--text);
171
+ }
172
+
173
+ .sched-dow-btn.active {
174
+ background: var(--accent);
175
+ color: #fff;
176
+ border-color: var(--accent);
177
+ }
178
+
179
+ /* --- Time picker --- */
180
+ .sched-time-row {
181
+ display: flex;
182
+ align-items: center;
183
+ gap: 8px;
184
+ }
185
+
186
+ .sched-time-input {
187
+ background: var(--input-bg, var(--bg-alt));
188
+ border: 1px solid var(--border);
189
+ border-radius: 6px;
190
+ padding: 8px 10px;
191
+ font-size: 16px;
192
+ font-weight: 600;
193
+ color: var(--text);
194
+ outline: none;
195
+ width: 110px;
196
+ font-family: "Roboto Mono", monospace;
197
+ }
198
+
199
+ .sched-time-input:focus {
200
+ border-color: var(--accent);
201
+ box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 20%, transparent);
202
+ }
203
+
204
+ /* --- Cron preview --- */
205
+ .sched-cron-preview {
206
+ background: var(--bg-alt);
207
+ border: 1px solid var(--border);
208
+ border-radius: 6px;
209
+ padding: 8px 12px;
210
+ font-size: 12px;
211
+ font-family: "Roboto Mono", monospace;
212
+ color: var(--text-muted);
213
+ }
214
+
215
+ .sched-cron-preview .human {
216
+ color: var(--text);
217
+ font-family: inherit;
218
+ font-weight: 600;
219
+ display: block;
220
+ margin-bottom: 2px;
221
+ }
222
+
223
+ /* --- Toggle switch --- */
224
+ .sched-toggle-row {
225
+ display: flex;
226
+ align-items: center;
227
+ justify-content: space-between;
228
+ }
229
+
230
+ .sched-toggle {
231
+ position: relative;
232
+ width: 40px;
233
+ height: 22px;
234
+ cursor: pointer;
235
+ }
236
+
237
+ .sched-toggle input {
238
+ display: none;
239
+ }
240
+
241
+ .sched-toggle-track {
242
+ position: absolute;
243
+ inset: 0;
244
+ border-radius: 11px;
245
+ background: var(--border);
246
+ transition: background 0.2s;
247
+ }
248
+
249
+ .sched-toggle input:checked + .sched-toggle-track {
250
+ background: var(--accent);
251
+ }
252
+
253
+ .sched-toggle-thumb {
254
+ position: absolute;
255
+ top: 2px;
256
+ left: 2px;
257
+ width: 18px;
258
+ height: 18px;
259
+ border-radius: 50%;
260
+ background: #fff;
261
+ transition: transform 0.2s;
262
+ box-shadow: 0 1px 3px rgba(0,0,0,0.2);
263
+ }
264
+
265
+ .sched-toggle input:checked ~ .sched-toggle-thumb {
266
+ transform: translateX(18px);
267
+ }
268
+
269
+ /* --- History list --- */
270
+ .sched-history {
271
+ max-height: 150px;
272
+ overflow-y: auto;
273
+ border: 1px solid var(--border);
274
+ border-radius: 6px;
275
+ }
276
+
277
+ .sched-history-empty {
278
+ padding: 16px;
279
+ text-align: center;
280
+ color: var(--text-muted);
281
+ font-size: 12px;
282
+ }
283
+
284
+ .sched-history-item {
285
+ display: flex;
286
+ align-items: center;
287
+ gap: 8px;
288
+ padding: 6px 10px;
289
+ border-bottom: 1px solid var(--border-subtle, var(--border));
290
+ font-size: 12px;
291
+ }
292
+
293
+ .sched-history-item:last-child {
294
+ border-bottom: none;
295
+ }
296
+
297
+ .sched-history-dot {
298
+ width: 8px;
299
+ height: 8px;
300
+ border-radius: 50%;
301
+ flex-shrink: 0;
302
+ }
303
+
304
+ .sched-history-dot.pass {
305
+ background: var(--success);
306
+ }
307
+
308
+ .sched-history-dot.fail, .sched-history-dot.error, .sched-history-dot.max_iterations {
309
+ background: var(--error);
310
+ }
311
+
312
+ .sched-history-date {
313
+ color: var(--text-muted);
314
+ flex-shrink: 0;
315
+ font-family: "Roboto Mono", monospace;
316
+ font-size: 11px;
317
+ }
318
+
319
+ .sched-history-result {
320
+ color: var(--text-secondary);
321
+ font-weight: 600;
322
+ }
323
+
324
+ .sched-history-iterations {
325
+ color: var(--text-muted);
326
+ margin-left: auto;
327
+ }
328
+
329
+ /* --- Footer buttons --- */
330
+ .schedule-edit-footer {
331
+ display: flex;
332
+ justify-content: flex-end;
333
+ gap: 8px;
334
+ padding: 12px 16px;
335
+ border-top: 1px solid var(--border);
336
+ background: var(--bg-alt);
337
+ }
338
+
339
+ .sched-btn {
340
+ padding: 7px 16px;
341
+ border-radius: 6px;
342
+ font-size: 13px;
343
+ font-weight: 600;
344
+ cursor: pointer;
345
+ border: 1px solid transparent;
346
+ transition: all 0.12s;
347
+ }
348
+
349
+ .sched-btn-cancel {
350
+ background: var(--bg-alt);
351
+ border-color: var(--border);
352
+ color: var(--text-secondary);
353
+ }
354
+
355
+ .sched-btn-cancel:hover {
356
+ background: var(--hover);
357
+ color: var(--text);
358
+ }
359
+
360
+ .sched-btn-save {
361
+ background: var(--accent);
362
+ color: #fff;
363
+ }
364
+
365
+ .sched-btn-save:hover {
366
+ filter: brightness(1.1);
367
+ }
368
+
369
+ .sched-btn-delete {
370
+ background: none;
371
+ border-color: var(--border);
372
+ color: var(--error);
373
+ margin-right: auto;
374
+ }
375
+
376
+ .sched-btn-delete:hover {
377
+ background: color-mix(in srgb, var(--error) 12%, transparent);
378
+ border-color: var(--error);
379
+ }
380
+
381
+ /* --- Scheduler tabs (Calendar / Tasks) --- */
382
+ .scheduler-tab {
383
+ background: none;
384
+ border: none;
385
+ color: var(--text-muted);
386
+ cursor: pointer;
387
+ padding: 10px 16px;
388
+ font-size: 13px;
389
+ font-weight: 700;
390
+ border-bottom: 2px solid transparent;
391
+ transition: all 0.12s;
392
+ }
393
+
394
+ .scheduler-tab.active {
395
+ color: var(--accent);
396
+ border-bottom-color: var(--accent);
397
+ }
398
+
399
+ .scheduler-tab:not(.active):hover {
400
+ color: var(--text);
401
+ }
402
+
403
+ /* --- Tasks list --- */
404
+ .scheduler-library {
405
+ flex: 1;
406
+ min-height: 0;
407
+ overflow-y: auto;
408
+ padding: 16px 24px;
409
+ }
410
+
411
+ .job-library-list {
412
+ display: flex;
413
+ flex-direction: column;
414
+ gap: 6px;
415
+ }
416
+
417
+ .job-library-item {
418
+ background: var(--bg-alt);
419
+ border: 1px solid var(--border);
420
+ border-radius: 8px;
421
+ padding: 10px 12px;
422
+ transition: border-color 0.12s;
423
+ }
424
+
425
+ .job-library-item:hover {
426
+ border-color: var(--accent);
427
+ }
428
+
429
+ .job-library-header {
430
+ display: flex;
431
+ align-items: center;
432
+ gap: 8px;
433
+ margin-bottom: 4px;
434
+ }
435
+
436
+ .job-library-name {
437
+ font-weight: 700;
438
+ font-size: 13px;
439
+ color: var(--text);
440
+ }
441
+
442
+ .job-library-badge {
443
+ font-size: 10px;
444
+ font-weight: 700;
445
+ padding: 2px 8px;
446
+ border-radius: 10px;
447
+ text-transform: uppercase;
448
+ letter-spacing: 0.03em;
449
+ }
450
+
451
+ .job-library-badge.scheduled {
452
+ background: color-mix(in srgb, var(--accent) 15%, transparent);
453
+ color: var(--accent);
454
+ }
455
+
456
+ .job-library-badge.oneoff {
457
+ background: var(--bg);
458
+ color: var(--text-muted);
459
+ border: 1px solid var(--border);
460
+ }
461
+
462
+ .job-library-meta {
463
+ font-size: 12px;
464
+ color: var(--text-secondary);
465
+ margin-bottom: 6px;
466
+ }
467
+
468
+ .job-library-task {
469
+ color: var(--text-muted);
470
+ margin-bottom: 2px;
471
+ }
472
+
473
+ .job-library-cron {
474
+ font-weight: 600;
475
+ }
476
+
477
+ .job-library-last-run {
478
+ font-size: 11px;
479
+ color: var(--text-muted);
480
+ }
481
+
482
+ .job-library-last-run .pass {
483
+ color: var(--success);
484
+ }
485
+
486
+ .job-library-last-run .fail {
487
+ color: var(--error);
488
+ }
489
+
490
+ .job-library-actions {
491
+ display: flex;
492
+ gap: 6px;
493
+ margin-top: 6px;
494
+ }
495
+
496
+ .job-lib-btn {
497
+ background: var(--bg);
498
+ border: 1px solid var(--border);
499
+ color: var(--text-secondary);
500
+ cursor: pointer;
501
+ padding: 4px 10px;
502
+ border-radius: 6px;
503
+ font-size: 11px;
504
+ font-weight: 600;
505
+ transition: all 0.12s;
506
+ }
507
+
508
+ .job-lib-btn:hover {
509
+ background: var(--hover);
510
+ color: var(--text);
511
+ }
512
+
513
+ .job-lib-btn.danger:hover {
514
+ background: color-mix(in srgb, var(--error) 12%, transparent);
515
+ color: var(--error);
516
+ border-color: var(--error);
517
+ }
518
+
519
+ /* --- Ralph wizard repeat select --- */
520
+ .ralph-input-select {
521
+ background: var(--input-bg, var(--bg-alt));
522
+ border: 1px solid var(--border);
523
+ border-radius: 6px;
524
+ padding: 6px 28px 6px 8px;
525
+ font-size: 13px;
526
+ color: var(--text);
527
+ outline: none;
528
+ cursor: pointer;
529
+ appearance: none;
530
+ background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
531
+ background-repeat: no-repeat;
532
+ background-position: right 8px center;
533
+ font-family: inherit;
534
+ }
535
+
536
+ .ralph-input-select:focus {
537
+ border-color: var(--accent);
538
+ }
539
+
540
+ @media (max-width: 480px) {
541
+ .schedule-edit-dialog {
542
+ width: 100vw;
543
+ max-width: none;
544
+ border-radius: 0;
545
+ }
546
+ }