@korso/shepherd-ui 0.10.0 → 0.11.0
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/LICENSE +661 -661
- package/README.md +50 -47
- package/dist/ShepherdRoot.d.ts +6 -1
- package/dist/ShepherdRoot.js +4 -3
- package/dist/components/Dashboard.d.ts +6 -1
- package/dist/components/Dashboard.js +2 -2
- package/dist/config/ConfigPanel.d.ts +6 -1
- package/dist/config/ConfigPanel.js +3 -2
- package/dist/config/SignOutAction.d.ts +7 -0
- package/dist/config/SignOutAction.js +7 -0
- package/dist/lib/{Dashboard-BSGZuM-A.js → Dashboard-YgxAVEUF.js} +604 -561
- package/dist/lib/index.d.ts +18 -3
- package/dist/lib/index.js +377 -359
- package/dist/lib/selfhost.js +32 -32
- package/dist/lib/styles.css +507 -495
- package/dist/selfhost/assets/index-BhrpCYNE.js +40 -0
- package/dist/selfhost/assets/index-Do2kYzi3.css +1 -0
- package/dist/selfhost/index.html +13 -13
- package/dist/selfhost.js +14 -13
- package/package.json +67 -67
- package/dist/selfhost/assets/index-BQL_SpLG.js +0 -40
- package/dist/selfhost/assets/index-CGncP2MD.css +0 -1
package/dist/lib/styles.css
CHANGED
|
@@ -1,495 +1,507 @@
|
|
|
1
|
-
:root {
|
|
2
|
-
--bg:#ece0c6; --ink:#322c20; --ink2:#6f6450; --ink3:#9c917a;
|
|
3
|
-
--line:#d7c9ac; --line2:#e0d4b9; --live:#3d8b58; --drop:#bd4f3a;
|
|
4
|
-
--chip:#e3d6ba; --terr:#7a6a48; --card:#f5ecd9;
|
|
5
|
-
}
|
|
6
|
-
* { box-sizing:border-box; }
|
|
7
|
-
html,body { height:100%; }
|
|
8
|
-
body {
|
|
9
|
-
margin:0; background:var(--bg); color:var(--ink);
|
|
10
|
-
font:14px/1.45 'Inter', ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
|
|
11
|
-
-webkit-font-smoothing:antialiased;
|
|
12
|
-
}
|
|
13
|
-
.wrap { max-width:1100px; margin:0 auto; padding:40px 44px; }
|
|
14
|
-
|
|
15
|
-
header { display:flex; align-items:center; gap:12px; padding-bottom:18px; }
|
|
16
|
-
.brand { font-size:17px; font-weight:600; }
|
|
17
|
-
.vitals { color:var(--ink3); font-size:12.5px; }
|
|
18
|
-
.grow { flex:1; }
|
|
19
|
-
.status { font-size:12px; color:var(--ink3); }
|
|
20
|
-
.status--ok { color:var(--live); }
|
|
21
|
-
.status--warn { color:var(--terr); }
|
|
22
|
-
.status--error { color:var(--drop); }
|
|
23
|
-
.freshness { font-size:12px; color:var(--ink3); }
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
.
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
.repo
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
.repo-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
.repo-mi
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
.
|
|
45
|
-
.
|
|
46
|
-
|
|
47
|
-
.
|
|
48
|
-
|
|
49
|
-
/*
|
|
50
|
-
|
|
51
|
-
.
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
.ws-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
.ws-
|
|
62
|
-
.ws-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
.ws-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
.ws-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
.ws-
|
|
76
|
-
.ws-
|
|
77
|
-
.ws-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
.ws-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
.ws-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
.ws-
|
|
87
|
-
color:var(--
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
.ws-
|
|
92
|
-
.ws-
|
|
93
|
-
|
|
94
|
-
.ws-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
.ws-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
.
|
|
101
|
-
.
|
|
102
|
-
border:
|
|
103
|
-
.
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
.
|
|
107
|
-
.
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
.
|
|
111
|
-
|
|
112
|
-
.
|
|
113
|
-
.
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
.
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
.
|
|
120
|
-
.
|
|
121
|
-
|
|
122
|
-
.
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
.
|
|
126
|
-
.
|
|
127
|
-
.
|
|
128
|
-
.
|
|
129
|
-
.
|
|
130
|
-
|
|
131
|
-
.
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
.
|
|
135
|
-
|
|
136
|
-
.
|
|
137
|
-
.
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
.
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
.
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
.
|
|
147
|
-
.
|
|
148
|
-
|
|
149
|
-
.
|
|
150
|
-
.
|
|
151
|
-
|
|
152
|
-
.
|
|
153
|
-
.
|
|
154
|
-
.
|
|
155
|
-
.
|
|
156
|
-
.
|
|
157
|
-
|
|
158
|
-
.
|
|
159
|
-
.
|
|
160
|
-
.
|
|
161
|
-
.
|
|
162
|
-
.
|
|
163
|
-
|
|
164
|
-
.
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
.
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
.
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
.
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
.chat
|
|
177
|
-
|
|
178
|
-
.chat
|
|
179
|
-
.
|
|
180
|
-
.
|
|
181
|
-
.
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
.
|
|
185
|
-
.
|
|
186
|
-
.
|
|
187
|
-
.
|
|
188
|
-
|
|
189
|
-
.
|
|
190
|
-
|
|
191
|
-
.
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
.
|
|
195
|
-
.
|
|
196
|
-
|
|
197
|
-
.msg--
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
.
|
|
203
|
-
.
|
|
204
|
-
.
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
.chat-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
.
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
.
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
.mention-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
.
|
|
225
|
-
.
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
.gate
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
.
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
.
|
|
243
|
-
.config
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
box-shadow:inset 2px 0 0
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
.
|
|
272
|
-
.
|
|
273
|
-
.
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
.shepherd-config .
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
.shepherd-config .
|
|
282
|
-
|
|
283
|
-
.shepherd-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
.shepherd-config .
|
|
288
|
-
.shepherd-config .card-
|
|
289
|
-
font-size:
|
|
290
|
-
|
|
291
|
-
.shepherd-config .
|
|
292
|
-
.shepherd-config .
|
|
293
|
-
.shepherd-config .
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
.shepherd-config
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
.shepherd-config select {
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
background-
|
|
317
|
-
|
|
318
|
-
.shepherd-config
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
.shepherd-config
|
|
330
|
-
.shepherd-config
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
.shepherd-config
|
|
335
|
-
.shepherd-config
|
|
336
|
-
|
|
337
|
-
/*
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
.shepherd-config .
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
.shepherd-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
/*
|
|
356
|
-
|
|
357
|
-
.shepherd-connect-agent .
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
color:var(--
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
.shepherd-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
.shepherd-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
.shepherd-config .invite-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
.shepherd-config .invite-
|
|
394
|
-
|
|
395
|
-
.shepherd-config .invite-
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
.shepherd-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
.shepherd-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
.shepherd-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
.shepherd-feedback__panel
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
.shepherd-feedback__panel
|
|
429
|
-
.shepherd-feedback__panel
|
|
430
|
-
|
|
431
|
-
.shepherd-
|
|
432
|
-
padding:
|
|
433
|
-
background:
|
|
434
|
-
|
|
435
|
-
.shepherd-
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
|
|
441
|
-
.shepherd-
|
|
442
|
-
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
.shepherd-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
.shepherd-
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
.shepherd-
|
|
464
|
-
|
|
465
|
-
.shepherd-
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
.shepherd-
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
.shepherd-
|
|
483
|
-
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
|
|
487
|
-
border-
|
|
488
|
-
|
|
489
|
-
|
|
490
|
-
|
|
491
|
-
|
|
492
|
-
.shepherd-
|
|
493
|
-
|
|
494
|
-
|
|
495
|
-
.shepherd-
|
|
1
|
+
:root {
|
|
2
|
+
--bg:#ece0c6; --ink:#322c20; --ink2:#6f6450; --ink3:#9c917a;
|
|
3
|
+
--line:#d7c9ac; --line2:#e0d4b9; --live:#3d8b58; --drop:#bd4f3a;
|
|
4
|
+
--chip:#e3d6ba; --terr:#7a6a48; --card:#f5ecd9;
|
|
5
|
+
}
|
|
6
|
+
* { box-sizing:border-box; }
|
|
7
|
+
html,body { height:100%; }
|
|
8
|
+
body {
|
|
9
|
+
margin:0; background:var(--bg); color:var(--ink);
|
|
10
|
+
font:14px/1.45 'Inter', ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
|
|
11
|
+
-webkit-font-smoothing:antialiased;
|
|
12
|
+
}
|
|
13
|
+
.wrap { max-width:1100px; margin:0 auto; padding:40px 44px; }
|
|
14
|
+
|
|
15
|
+
header { display:flex; align-items:center; gap:12px; padding-bottom:18px; }
|
|
16
|
+
.brand { font-size:17px; font-weight:600; }
|
|
17
|
+
.vitals { color:var(--ink3); font-size:12.5px; }
|
|
18
|
+
.grow { flex:1; }
|
|
19
|
+
.status { font-size:12px; color:var(--ink3); }
|
|
20
|
+
.status--ok { color:var(--live); }
|
|
21
|
+
.status--warn { color:var(--terr); }
|
|
22
|
+
.status--error { color:var(--drop); }
|
|
23
|
+
.freshness { font-size:12px; color:var(--ink3); }
|
|
24
|
+
.header-signout { font:inherit; font-size:13px; color:var(--ink2); cursor:pointer;
|
|
25
|
+
border:1px solid var(--line); border-radius:8px; padding:5px 11px;
|
|
26
|
+
background:transparent; transition:color .12s ease, border-color .12s ease, background .12s ease; }
|
|
27
|
+
.header-signout:hover { color:var(--ink); border-color:var(--ink3); background:rgba(255,250,238,.35); }
|
|
28
|
+
.header-signout:focus-visible { outline:none; border-color:var(--terr);
|
|
29
|
+
box-shadow:0 0 0 3px rgba(122,106,72,.14); }
|
|
30
|
+
|
|
31
|
+
/* Repo selector (hidden when <2 repos; populated by app.js) */
|
|
32
|
+
.repo { position:relative; }
|
|
33
|
+
.repo-trig { display:inline-flex; align-items:center; gap:6px; font-size:13px;
|
|
34
|
+
font-family:inherit; color:var(--ink); appearance:none;
|
|
35
|
+
border:1px solid var(--line); border-radius:8px; padding:4px 10px;
|
|
36
|
+
background:rgba(255,250,238,.4); cursor:pointer; }
|
|
37
|
+
.repo-trig .slash { color:var(--ink3); }
|
|
38
|
+
.repo-menu { position:absolute; top:36px; left:0; min-width:200px; background:var(--card);
|
|
39
|
+
border:1px solid var(--line); border-radius:10px; padding:5px;
|
|
40
|
+
box-shadow:0 8px 24px rgba(50,40,20,.14); z-index:5; }
|
|
41
|
+
.repo-mi { display:flex; justify-content:space-between; gap:14px; padding:7px 9px;
|
|
42
|
+
width:100%; text-align:left; border:0; appearance:none; font-family:inherit; color:inherit;
|
|
43
|
+
background:transparent; border-radius:7px; font-size:13px; cursor:pointer; }
|
|
44
|
+
.repo-mi:hover { background:var(--chip); }
|
|
45
|
+
.repo-mi.on { background:var(--chip); font-weight:600; }
|
|
46
|
+
.repo-mi .ct { font-size:11px; color:var(--ink3); }
|
|
47
|
+
.repo-mi.all { border-top:1px solid var(--line2); margin-top:4px; padding-top:9px; color:var(--ink2); }
|
|
48
|
+
|
|
49
|
+
/* Tabs */
|
|
50
|
+
.tabs { display:flex; gap:4px; margin-left:auto; }
|
|
51
|
+
.tab { font-size:13px; color:var(--ink2); padding:5px 11px; border:0; border-radius:7px;
|
|
52
|
+
background:transparent; cursor:pointer; font:inherit; }
|
|
53
|
+
.tab--active { background:var(--ink); color:var(--bg); }
|
|
54
|
+
|
|
55
|
+
/* Workspace switcher (app-bar): the active-workspace indicator + the one
|
|
56
|
+
home for switch/create/join. Shown on every tab. */
|
|
57
|
+
.ws-switcher { position:relative; }
|
|
58
|
+
.ws-trig { display:inline-flex; align-items:center; gap:8px; font:inherit; font-size:13px;
|
|
59
|
+
font-weight:600; color:var(--ink); cursor:pointer;
|
|
60
|
+
border:1px solid var(--line); border-radius:9px; padding:5px 10px; background:var(--card); }
|
|
61
|
+
.ws-trig:hover { border-color:var(--ink3); }
|
|
62
|
+
.ws-trig--empty { background:transparent; border-style:dashed; border-color:var(--ink2); }
|
|
63
|
+
.ws-avatar { width:18px; height:18px; border-radius:6px; background:var(--ink); color:var(--bg);
|
|
64
|
+
display:grid; place-items:center; font-size:10px; font-weight:700; flex:none; }
|
|
65
|
+
.ws-avatar--sm { width:16px; height:16px; font-size:9px; }
|
|
66
|
+
.ws-plus { color:var(--ink2); font-weight:700; }
|
|
67
|
+
.ws-name { max-width:180px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
|
|
68
|
+
.ws-caret { color:var(--ink3); font-size:10px; }
|
|
69
|
+
|
|
70
|
+
.ws-menu { position:absolute; top:40px; left:0; width:240px; z-index:20;
|
|
71
|
+
background:var(--card); border:1px solid var(--line); border-radius:11px; padding:6px;
|
|
72
|
+
box-shadow:0 8px 24px rgba(50,40,20,.16); }
|
|
73
|
+
.ws-menu__head { margin:0; padding:6px 8px; font-size:10px; letter-spacing:.08em;
|
|
74
|
+
text-transform:uppercase; color:var(--ink3); }
|
|
75
|
+
.ws-menu__none { margin:0; padding:2px 8px 6px; color:var(--ink3); font-style:italic; font-size:13px; }
|
|
76
|
+
.ws-menu__list { list-style:none; margin:0; padding:0; }
|
|
77
|
+
.ws-mi { display:flex; align-items:center; gap:8px; width:100%; text-align:left; font:inherit;
|
|
78
|
+
font-size:13px; color:var(--ink); background:transparent; border:0; border-radius:7px;
|
|
79
|
+
padding:7px 8px; cursor:pointer; }
|
|
80
|
+
.ws-mi:hover { background:var(--chip); }
|
|
81
|
+
.ws-mi--on { font-weight:600; }
|
|
82
|
+
.ws-mi__name { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
|
|
83
|
+
.ws-mi__check { color:var(--live); }
|
|
84
|
+
.ws-menu__actions { display:flex; flex-direction:column; margin-top:5px; padding-top:5px;
|
|
85
|
+
border-top:1px solid var(--line2); }
|
|
86
|
+
.ws-action { display:flex; align-items:center; gap:8px; width:100%; text-align:left; font:inherit;
|
|
87
|
+
font-size:13px; color:var(--ink2); background:transparent; border:0; border-radius:7px;
|
|
88
|
+
padding:8px; cursor:pointer; }
|
|
89
|
+
.ws-action:hover { background:var(--chip); color:var(--ink); }
|
|
90
|
+
|
|
91
|
+
.ws-form { display:flex; flex-direction:column; gap:8px; padding:4px; }
|
|
92
|
+
.ws-form label { font-size:10px; font-weight:600; letter-spacing:.05em; text-transform:uppercase;
|
|
93
|
+
color:var(--ink3); }
|
|
94
|
+
.ws-form input { padding:8px 10px; border-radius:8px; border:1px solid var(--line);
|
|
95
|
+
background:var(--bg); color:var(--ink); font:inherit; }
|
|
96
|
+
.ws-form input:focus { outline:none; border-color:var(--terr); box-shadow:0 0 0 3px rgba(122,106,72,.14); }
|
|
97
|
+
.ws-form__row { display:flex; gap:8px; justify-content:flex-end; }
|
|
98
|
+
.ws-form__row button { font:inherit; font-size:13px; font-weight:600; border-radius:8px;
|
|
99
|
+
padding:7px 14px; cursor:pointer; border:1px solid var(--ink); background:var(--ink); color:var(--bg); }
|
|
100
|
+
.ws-form__row button:disabled { opacity:.55; cursor:default; }
|
|
101
|
+
.ws-form__back { background:transparent !important; color:var(--ink2) !important;
|
|
102
|
+
border-color:var(--line) !important; }
|
|
103
|
+
.ws-menu__error { margin:6px 4px 2px; font-size:12.5px; color:var(--drop); }
|
|
104
|
+
|
|
105
|
+
/* Crew strip */
|
|
106
|
+
.crew { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:26px 0 32px; }
|
|
107
|
+
.person { display:inline-flex; align-items:center; gap:9px; padding:5px 13px 5px 5px;
|
|
108
|
+
border:1px solid var(--line); border-radius:999px; background:var(--card); font-size:13px; }
|
|
109
|
+
.person--idle { opacity:.55; }
|
|
110
|
+
.avatar { width:24px; height:24px; border-radius:50%; display:grid; place-items:center;
|
|
111
|
+
font-size:10px; font-weight:700; color:#fff; flex:none; }
|
|
112
|
+
.person__name { font-weight:600; }
|
|
113
|
+
.person__doing { color:var(--ink3); font-size:12px; }
|
|
114
|
+
|
|
115
|
+
/* Board */
|
|
116
|
+
.board { display:grid; grid-template-columns:1fr 1px 1fr; gap:0; }
|
|
117
|
+
.board__rule { background:var(--line); }
|
|
118
|
+
.col { padding:0 36px; } .col:first-child { padding-left:0; } .col:last-child { padding-right:0; }
|
|
119
|
+
.colhead { display:flex; align-items:center; gap:8px; margin-bottom:6px; }
|
|
120
|
+
.colhead h2 { font-size:12px; font-weight:600; letter-spacing:.03em; margin:0;
|
|
121
|
+
text-transform:uppercase; color:var(--ink2); }
|
|
122
|
+
.colhead .n { font-size:11px; color:var(--ink3); background:var(--chip);
|
|
123
|
+
border-radius:999px; padding:1px 8px; }
|
|
124
|
+
|
|
125
|
+
.task { padding:16px 0; border-bottom:1px solid var(--line2); }
|
|
126
|
+
.task__r1 { display:flex; align-items:center; gap:8px; }
|
|
127
|
+
.task__who { font-size:13.5px; font-weight:600; }
|
|
128
|
+
.task__tag { font-size:11px; color:var(--ink3); }
|
|
129
|
+
.task__repo { font-size:11px; color:var(--terr); background:rgba(122,106,72,.1);
|
|
130
|
+
border-radius:4px; padding:0 6px; }
|
|
131
|
+
.task__stat { margin-left:auto; font-size:11px; font-weight:500; color:var(--ink3); }
|
|
132
|
+
.task__stat--drop { color:var(--drop); }
|
|
133
|
+
.livedot { width:7px; height:7px; border-radius:50%; background:var(--live); margin-left:auto; }
|
|
134
|
+
.task__intent { font-size:13.5px; margin:5px 0 0; line-height:1.45; }
|
|
135
|
+
.terr { margin-top:8px; display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
|
|
136
|
+
.terr__lbl { font-size:9.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--ink3); }
|
|
137
|
+
.glob { font-family:ui-monospace, Menlo, monospace; font-size:11px; color:var(--terr);
|
|
138
|
+
background:rgba(122,106,72,.12); border:1px solid rgba(122,106,72,.22);
|
|
139
|
+
border-radius:5px; padding:1px 7px; }
|
|
140
|
+
.task__meta { font-size:11.5px; color:var(--ink3); margin-top:6px; }
|
|
141
|
+
/* expandable territory (2+ paths collapse to a one-line "N paths" toggle) */
|
|
142
|
+
.terrx { margin-top:8px; }
|
|
143
|
+
.terrx summary { list-style:none; cursor:pointer; display:flex; align-items:center;
|
|
144
|
+
gap:6px; flex-wrap:wrap; user-select:none; }
|
|
145
|
+
.terrx summary::-webkit-details-marker { display:none; }
|
|
146
|
+
.terrx .terr--full { margin-top:8px; }
|
|
147
|
+
.glob--more { cursor:pointer; color:var(--ink2); background:var(--chip);
|
|
148
|
+
border:1px solid var(--line); }
|
|
149
|
+
.glob--more .tw { color:var(--ink3); display:inline-block; transition:transform .15s; }
|
|
150
|
+
.terrx[open] summary .glob--more .tw { transform:rotate(90deg); }
|
|
151
|
+
/* grouped agent box: header + claims rail + collapsible "narrower" fold */
|
|
152
|
+
.grp { padding:16px 0; border-bottom:1px solid var(--line2); }
|
|
153
|
+
.grp__head { display:flex; align-items:center; gap:8px; }
|
|
154
|
+
.grp__who { font-size:13.5px; font-weight:600; }
|
|
155
|
+
.grp__tag { font-size:11px; color:var(--ink3); }
|
|
156
|
+
.grp__count { font-size:11px; color:var(--ink3); }
|
|
157
|
+
.grp__dot { width:7px; height:7px; border-radius:50%; background:var(--live); margin-left:auto; }
|
|
158
|
+
.claims { margin:10px 0 0 6px; padding-left:14px; border-left:1px solid var(--line); }
|
|
159
|
+
.claim { padding:6px 0; }
|
|
160
|
+
.claim + .claim { border-top:1px solid var(--line2); margin-top:6px; }
|
|
161
|
+
.fold { margin-top:10px; }
|
|
162
|
+
.fold summary { list-style:none; cursor:pointer; font-size:12px; color:var(--ink2);
|
|
163
|
+
display:inline-flex; align-items:center; gap:6px; user-select:none; }
|
|
164
|
+
.fold summary::-webkit-details-marker { display:none; }
|
|
165
|
+
.fold summary .tw { display:inline-block; color:var(--ink3); transition:transform .15s; }
|
|
166
|
+
.fold[open] summary .tw { transform:rotate(90deg); }
|
|
167
|
+
.fold__body { margin:8px 0 0 6px; padding-left:14px; border-left:1px dashed var(--line); }
|
|
168
|
+
.covered { font-size:10.5px; color:var(--ink3); font-style:italic; margin-top:4px; }
|
|
169
|
+
.day { font-size:11px; color:var(--ink3); padding:18px 0 2px; font-weight:600; }
|
|
170
|
+
.more { margin-top:20px; font-size:12.5px; color:var(--ink2); padding:7px 13px;
|
|
171
|
+
border:1px solid var(--line); border-radius:8px; background:rgba(255,250,238,.35);
|
|
172
|
+
cursor:pointer; }
|
|
173
|
+
.empty { color:var(--ink3); font-style:italic; padding:14px 0; }
|
|
174
|
+
|
|
175
|
+
/* Chat (re-themed; structure unchanged) */
|
|
176
|
+
.chat-wrap { background:var(--card); border:1px solid var(--line); border-radius:12px;
|
|
177
|
+
display:flex; flex-direction:column; overflow:hidden; height:calc(100vh - 150px); min-height:320px; }
|
|
178
|
+
.chat { flex:1; overflow-y:auto; padding:16px; }
|
|
179
|
+
.chat { scrollbar-width:thin; scrollbar-color:var(--line) transparent; }
|
|
180
|
+
.chat::-webkit-scrollbar { width:10px; }
|
|
181
|
+
.chat::-webkit-scrollbar-track { background:transparent; }
|
|
182
|
+
.chat::-webkit-scrollbar-thumb { background:var(--line); border-radius:999px;
|
|
183
|
+
border:3px solid var(--card); background-clip:padding-box; }
|
|
184
|
+
.chat::-webkit-scrollbar-thumb:hover { background:var(--ink3); background-clip:padding-box; }
|
|
185
|
+
.chat__note { padding:9px 16px; font-size:11.5px; color:var(--ink3); }
|
|
186
|
+
.msg { display:flex; gap:11px; padding:9px 0; }
|
|
187
|
+
.msg__avatar { flex:none; width:32px; height:32px; border-radius:50%; display:grid;
|
|
188
|
+
place-items:center; font-size:12px; font-weight:700; color:#fff; }
|
|
189
|
+
.msg__body { min-width:0; flex:1; }
|
|
190
|
+
.msg__head { display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; }
|
|
191
|
+
.msg__who { font-weight:600; }
|
|
192
|
+
.msg__human { font-size:12px; color:var(--ink3); }
|
|
193
|
+
.msg__to { font-size:11.5px; color:var(--terr); }
|
|
194
|
+
.msg__time { font-size:11.5px; color:var(--ink3); margin-left:auto; }
|
|
195
|
+
.msg__text { margin-top:3px; padding:8px 12px; border-radius:4px 12px 12px 12px;
|
|
196
|
+
background:var(--chip); white-space:pre-wrap; word-break:break-word; }
|
|
197
|
+
.msg--targeted .msg__text { box-shadow:inset 3px 0 0 var(--terr); }
|
|
198
|
+
|
|
199
|
+
/* Operator's own messages — same group-chat structure, mirrored to the right. */
|
|
200
|
+
.msg--me { flex-direction:row-reverse; }
|
|
201
|
+
.msg--me .msg__head { flex-direction:row-reverse; }
|
|
202
|
+
.msg--me .msg__time { margin-left:0; margin-right:auto; }
|
|
203
|
+
.msg--me .msg__body { display:flex; flex-direction:column; align-items:flex-end; }
|
|
204
|
+
.msg--me .msg__text { border-radius:12px 4px 12px 12px; background:#d4e7d2; }
|
|
205
|
+
.msg--me.msg--targeted .msg__text { box-shadow:inset -3px 0 0 var(--terr); }
|
|
206
|
+
|
|
207
|
+
/* Composer */
|
|
208
|
+
.composer { position:relative; border-top:1px solid var(--line); padding:10px 12px; }
|
|
209
|
+
.chat-form { display:flex; gap:8px; }
|
|
210
|
+
.chat-input { flex:1; padding:9px 12px; border-radius:8px; border:1px solid var(--line);
|
|
211
|
+
background:var(--bg); color:var(--ink); font:inherit; }
|
|
212
|
+
.chat-input:focus { outline:none; border-color:var(--terr); }
|
|
213
|
+
.chat-send { padding:9px 16px; border-radius:8px; border:1px solid var(--ink);
|
|
214
|
+
background:var(--ink); color:var(--bg); font-weight:600; cursor:pointer; font:inherit; }
|
|
215
|
+
.chat-send:disabled { opacity:.5; cursor:default; }
|
|
216
|
+
|
|
217
|
+
/* @-mention autocomplete — floats above the input */
|
|
218
|
+
.mention-pop { position:absolute; left:12px; right:12px; bottom:56px; z-index:6;
|
|
219
|
+
background:var(--card); border:1px solid var(--line); border-radius:10px; padding:5px;
|
|
220
|
+
box-shadow:0 8px 24px rgba(50,40,20,.16); max-height:200px; overflow-y:auto; }
|
|
221
|
+
.mention-mi { display:flex; align-items:center; gap:9px; width:100%; text-align:left;
|
|
222
|
+
border:0; appearance:none; font-family:inherit; color:inherit; background:transparent;
|
|
223
|
+
border-radius:7px; padding:6px 8px; font-size:13px; cursor:pointer; }
|
|
224
|
+
.mention-mi:hover, .mention-mi.on { background:var(--chip); }
|
|
225
|
+
.mention-mi .ma { width:22px; height:22px; border-radius:50%; display:grid; place-items:center;
|
|
226
|
+
font-size:9px; font-weight:700; color:#fff; flex:none; }
|
|
227
|
+
|
|
228
|
+
/* Token gate */
|
|
229
|
+
.gate { max-width:420px; margin:12vh auto 0; text-align:center; }
|
|
230
|
+
.gate h1 { font-size:19px; margin:0 0 6px; }
|
|
231
|
+
.gate p { color:var(--ink2); margin:0 0 20px; }
|
|
232
|
+
.gate form { display:flex; gap:8px; }
|
|
233
|
+
.gate input { flex:1; padding:10px 12px; border-radius:8px; border:1px solid var(--line);
|
|
234
|
+
background:var(--card); color:var(--ink); }
|
|
235
|
+
.gate button { padding:10px 16px; border-radius:8px; border:1px solid var(--ink);
|
|
236
|
+
background:var(--ink); color:var(--bg); font-weight:600; cursor:pointer; }
|
|
237
|
+
|
|
238
|
+
/* --- Multi-workspace hosted shell + config surface. Reuses the board's
|
|
239
|
+
tokens and its editorial vocabulary (uppercase micro-labels echoing the
|
|
240
|
+
column heads, hairline rules) so Config reads as part of the board. --- */
|
|
241
|
+
.shepherd-root { max-width:1100px; margin:0 auto; padding:40px 44px; }
|
|
242
|
+
.shepherd-root > main { padding-top:18px; }
|
|
243
|
+
.shepherd-config { display:flex; flex-direction:column; }
|
|
244
|
+
.shepherd-config h2 { font-size:16px; margin:0 0 22px; }
|
|
245
|
+
|
|
246
|
+
/* Config sidebar: a left nav of sections beside the active section's
|
|
247
|
+
panel, replacing the old single long scroll. */
|
|
248
|
+
.config-layout { display:flex; gap:32px; align-items:flex-start; }
|
|
249
|
+
.config-nav { flex:none; width:170px; display:flex; flex-direction:column; gap:2px;
|
|
250
|
+
position:sticky; top:0; }
|
|
251
|
+
/* Scoped under .shepherd-config to out-specify the generic dark-fill
|
|
252
|
+
`.shepherd-config button` rule — these are plain nav links, not buttons. */
|
|
253
|
+
.shepherd-config .config-nav__item { text-align:left; font:inherit; font-size:13.5px;
|
|
254
|
+
color:var(--ink2); background:transparent; border:0; border-radius:8px; padding:8px 12px;
|
|
255
|
+
cursor:pointer; box-shadow:inset 2px 0 0 transparent; transition:color .12s ease, background .12s ease; }
|
|
256
|
+
/* Extra .config-nav in the chain so this out-specifies the generic dark
|
|
257
|
+
`.shepherd-config button:hover` fill — a translucent tint, not a block. */
|
|
258
|
+
.shepherd-config .config-nav .config-nav__item:hover { color:var(--ink);
|
|
259
|
+
background:rgba(50,44,32,.06); }
|
|
260
|
+
.shepherd-config .config-nav__item--on { color:var(--ink); font-weight:600;
|
|
261
|
+
box-shadow:inset 2px 0 0 var(--ink); }
|
|
262
|
+
.shepherd-config .config-nav .config-nav__item--on:hover { background:transparent; }
|
|
263
|
+
.config-panel { flex:1; min-width:0; }
|
|
264
|
+
|
|
265
|
+
/* Two sections can share a panel (Members + Invites); set them off by a
|
|
266
|
+
hairline, mirroring the old flat-section separation. */
|
|
267
|
+
.config-panel > section + section { margin-top:26px; padding-top:26px;
|
|
268
|
+
border-top:1px solid var(--line2); }
|
|
269
|
+
|
|
270
|
+
/* No-workspace Config prompt (create/join now live in the switcher). */
|
|
271
|
+
.config-none { color:var(--ink2); font-size:13.5px; max-width:520px; }
|
|
272
|
+
.config-signout { margin-top:28px; padding-top:24px; border-top:1px solid var(--line2); }
|
|
273
|
+
.config-signout .card-body { align-items:flex-start; }
|
|
274
|
+
.shepherd-config .config-signout button { background:transparent; color:var(--ink2);
|
|
275
|
+
border-color:var(--line); padding:7px 14px; }
|
|
276
|
+
.shepherd-config .config-signout button:hover:not(:disabled) { color:var(--ink);
|
|
277
|
+
border-color:var(--ink3); background:rgba(50,44,32,.06); }
|
|
278
|
+
|
|
279
|
+
/* Read-only workspace facts (name / role) in General. Deliberately plain
|
|
280
|
+
text — no border/background — so they don't read as editable inputs. */
|
|
281
|
+
.shepherd-config .readonly-value { margin:0; font-size:15px; color:var(--ink);
|
|
282
|
+
padding:1px 0; font-weight:500; }
|
|
283
|
+
.shepherd-general .leave { padding-top:4px; }
|
|
284
|
+
.shepherd-general .delete { padding-top:4px; }
|
|
285
|
+
.shepherd-config button.danger { border-color:var(--drop); background:transparent; color:var(--drop);
|
|
286
|
+
align-self:flex-start; }
|
|
287
|
+
.shepherd-config button.danger:hover:not(:disabled) { background:var(--drop); color:var(--bg); }
|
|
288
|
+
.shepherd-config .card-head h3 {
|
|
289
|
+
font-size:13px; font-weight:600; letter-spacing:.04em; text-transform:uppercase;
|
|
290
|
+
color:var(--ink2); margin:0; }
|
|
291
|
+
.shepherd-config .card-sub { margin:4px 0 0; font-size:12.5px; color:var(--ink3); }
|
|
292
|
+
.shepherd-config .card-head { margin-bottom:16px; }
|
|
293
|
+
.shepherd-config .card-body { display:flex; flex-direction:column; gap:16px; }
|
|
294
|
+
.shepherd-config .card-body > [role="alert"] { margin:0; color:var(--drop); font-size:13px; }
|
|
295
|
+
.shepherd-config .card-body > [role="status"] { margin:0; color:var(--ink2); font-size:13px; }
|
|
296
|
+
|
|
297
|
+
/* A field: uppercase eyebrow label, optional helper, then input(s) + action
|
|
298
|
+
on one row. Labels borrow the board's .colhead h2 treatment. */
|
|
299
|
+
.shepherd-config .field { display:flex; flex-direction:column; gap:8px; }
|
|
300
|
+
.shepherd-config .card-body label {
|
|
301
|
+
font-size:11px; font-weight:600; letter-spacing:.05em; text-transform:uppercase; color:var(--ink3); }
|
|
302
|
+
.shepherd-config .helper { margin:0; font-size:12.5px; color:var(--ink2); }
|
|
303
|
+
.shepherd-config .field > select { width:100%; }
|
|
304
|
+
.shepherd-config .field__row { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
|
|
305
|
+
.shepherd-config .field__row > input { flex:1; min-width:200px; }
|
|
306
|
+
|
|
307
|
+
/* Invite-by-code: a compact button with the freshly-created code shown
|
|
308
|
+
above it (the button below mints another). */
|
|
309
|
+
.shepherd-invites .invites { gap:12px; }
|
|
310
|
+
.shepherd-invites .invites > button { align-self:flex-start; }
|
|
311
|
+
|
|
312
|
+
.shepherd-config input, .shepherd-config select {
|
|
313
|
+
padding:9px 12px; border-radius:8px; border:1px solid var(--line);
|
|
314
|
+
/* background-COLOR, not the `background` shorthand — the shorthand
|
|
315
|
+
resets background-image and erases the select's chevron above. */
|
|
316
|
+
background-color:var(--bg); color:var(--ink); font:inherit;
|
|
317
|
+
transition:border-color .12s ease, box-shadow .12s ease; }
|
|
318
|
+
.shepherd-config input::placeholder { color:var(--ink3); }
|
|
319
|
+
.shepherd-config input:focus, .shepherd-config select:focus {
|
|
320
|
+
outline:none; border-color:var(--terr); box-shadow:0 0 0 3px rgba(122,106,72,.14); }
|
|
321
|
+
/* Select dropdown affordance. AFTER the shared input/select rule on
|
|
322
|
+
purpose: `padding` there is a shorthand and would reset the wider
|
|
323
|
+
padding-right reserved for the chevron. */
|
|
324
|
+
.shepherd-config select {
|
|
325
|
+
appearance:none; -webkit-appearance:none; -moz-appearance:none;
|
|
326
|
+
cursor:pointer;
|
|
327
|
+
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='7' viewBox='0 0 12 7'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%236f6450' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
|
|
328
|
+
background-repeat:no-repeat; background-position:right 14px center; padding-right:40px; }
|
|
329
|
+
.shepherd-config select:hover:not(:disabled) { border-color:var(--terr); }
|
|
330
|
+
.shepherd-config button {
|
|
331
|
+
padding:9px 16px; border-radius:8px; border:1px solid var(--ink);
|
|
332
|
+
background:var(--ink); color:var(--bg); font-weight:600; cursor:pointer; font:inherit;
|
|
333
|
+
white-space:nowrap; transition:background .12s ease; }
|
|
334
|
+
.shepherd-config button:hover:not(:disabled) { background:#413a2a; }
|
|
335
|
+
.shepherd-config button:disabled { opacity:.55; cursor:default; }
|
|
336
|
+
|
|
337
|
+
/* Token / member rows: leading name grows, meta + action ride the right.
|
|
338
|
+
Flat rows separated by hairlines (mirrors the board's .claim rows)
|
|
339
|
+
rather than individually boxed items. */
|
|
340
|
+
.shepherd-config ul { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; }
|
|
341
|
+
.shepherd-config li { display:flex; align-items:center; gap:10px; padding:10px 0; font-size:13px; }
|
|
342
|
+
.shepherd-config li + li { border-top:1px solid var(--line2); }
|
|
343
|
+
.shepherd-config li > span:first-child { flex:1; min-width:0; font-weight:500; }
|
|
344
|
+
.shepherd-config li button { padding:5px 12px; }
|
|
345
|
+
.shepherd-config .role { color:var(--ink3); font-size:12px; }
|
|
346
|
+
.shepherd-config .token-meta { color:var(--ink3); font-size:12px; }
|
|
347
|
+
.shepherd-config .email-invite__status { margin:0; font-size:12.5px; color:var(--ink2); }
|
|
348
|
+
|
|
349
|
+
/* Install command block. */
|
|
350
|
+
.shepherd-connect-agent .install-command { position:relative; }
|
|
351
|
+
.shepherd-connect-agent pre { margin:0; padding:12px 14px; border-radius:8px;
|
|
352
|
+
border:1px solid var(--line); background:var(--bg); color:var(--ink);
|
|
353
|
+
font-family:ui-monospace, SFMono-Regular, Menlo, monospace; font-size:12px; line-height:1.5;
|
|
354
|
+
overflow-x:auto; white-space:pre-wrap; word-break:break-word; }
|
|
355
|
+
/* Bare icon button (clipboard → check on copy), not a filled pill. Extra
|
|
356
|
+
selector depth beats the generic dark `.shepherd-config button` fill. */
|
|
357
|
+
.shepherd-config .shepherd-connect-agent .install-command__copy {
|
|
358
|
+
position:absolute; top:7px; right:7px; display:grid; place-items:center;
|
|
359
|
+
width:28px; height:28px; padding:0; border-radius:7px; border:0;
|
|
360
|
+
background:transparent; color:var(--ink3); cursor:pointer;
|
|
361
|
+
transition:background .12s ease, color .12s ease; }
|
|
362
|
+
.shepherd-config .shepherd-connect-agent .install-command__copy:hover {
|
|
363
|
+
background:rgba(50,44,32,.08); color:var(--ink); }
|
|
364
|
+
.shepherd-connect-agent h4 { margin:6px 0 0; font-size:11px; font-weight:600;
|
|
365
|
+
letter-spacing:.05em; text-transform:uppercase; color:var(--ink3); }
|
|
366
|
+
|
|
367
|
+
/* First-run auto-install note + its collapsed manual reference: even
|
|
368
|
+
rhythm, and a summary that reads as quiet body text (not a heading). */
|
|
369
|
+
.shepherd-connect-agent .hook-setup { display:flex; flex-direction:column; gap:10px; }
|
|
370
|
+
.shepherd-connect-agent .hook-setup .card-sub { margin:0; }
|
|
371
|
+
.shepherd-connect-agent .hook-reference summary { cursor:pointer; font-size:12.5px;
|
|
372
|
+
color:var(--ink2); user-select:none; }
|
|
373
|
+
.shepherd-connect-agent .hook-reference[open] summary { margin-bottom:10px; }
|
|
374
|
+
|
|
375
|
+
.shepherd-connect-agent .token-once {
|
|
376
|
+
font-family:ui-monospace, SFMono-Regular, Menlo, monospace; font-size:12px;
|
|
377
|
+
padding:10px 12px; border-radius:8px;
|
|
378
|
+
background:var(--chip); border:1px solid var(--line2); }
|
|
379
|
+
|
|
380
|
+
/* Created-invite card: an eyebrow + use count + a quiet Revoke, then the
|
|
381
|
+
code and join link each with their own Copy affordance. */
|
|
382
|
+
.shepherd-config .invite-result { align-self:stretch; display:flex; flex-direction:column;
|
|
383
|
+
gap:12px; padding:14px 16px; border-radius:10px; background:var(--card);
|
|
384
|
+
border:1px solid var(--line); }
|
|
385
|
+
.shepherd-config .invite-result__head { display:flex; align-items:center; gap:12px; }
|
|
386
|
+
.shepherd-config .invite-result__eyebrow { flex:1; font-size:11px; font-weight:600;
|
|
387
|
+
letter-spacing:.05em; text-transform:uppercase; color:var(--ink3); }
|
|
388
|
+
.shepherd-config .invite-uses { font-size:12px; color:var(--ink3); }
|
|
389
|
+
.shepherd-config .invite-result__copyrow { display:flex; align-items:center; gap:10px; }
|
|
390
|
+
.shepherd-config .invite-result__copyrow > code { flex:1; min-width:0; font-size:15px;
|
|
391
|
+
font-weight:600; font-family:ui-monospace, SFMono-Regular, Menlo, monospace;
|
|
392
|
+
color:var(--ink); letter-spacing:.02em; word-break:break-all; }
|
|
393
|
+
.shepherd-config .invite-result__copyrow--link { padding-top:10px;
|
|
394
|
+
border-top:1px solid var(--line2); }
|
|
395
|
+
.shepherd-config .invite-result__copyrow--link a { flex:1; min-width:0; font-size:12px;
|
|
396
|
+
color:var(--ink2); word-break:break-all; }
|
|
397
|
+
|
|
398
|
+
/* Quiet buttons inside the card: a bordered Copy pill and a text-only
|
|
399
|
+
Revoke. Extra selector depth beats the generic dark `button` fill+hover. */
|
|
400
|
+
.shepherd-config .invite-result .copy-btn { flex:none; padding:5px 12px; font-size:12px;
|
|
401
|
+
font-weight:600; border-radius:7px; border:1px solid var(--line); background:var(--bg);
|
|
402
|
+
color:var(--ink2); cursor:pointer; }
|
|
403
|
+
.shepherd-config .invite-result .copy-btn:hover { background:var(--ink); color:var(--bg);
|
|
404
|
+
border-color:var(--ink); }
|
|
405
|
+
.shepherd-config .invite-result .link-btn { flex:none; padding:0; font-size:12px;
|
|
406
|
+
font-weight:600; border:0; background:transparent; color:var(--drop); cursor:pointer; }
|
|
407
|
+
.shepherd-config .invite-result .link-btn:hover { background:transparent;
|
|
408
|
+
text-decoration:underline; }
|
|
409
|
+
.shepherd-config .revoked { color:var(--ink3); text-decoration:line-through; }
|
|
410
|
+
.shepherd-empty-state { text-align:center; color:var(--ink2); padding:48px 24px; }
|
|
411
|
+
.shepherd-empty-state button { margin-top:14px; }
|
|
412
|
+
|
|
413
|
+
/* Feedback widget: fixed bottom-right, floats over every tab. */
|
|
414
|
+
.shepherd-feedback { position:fixed; right:20px; bottom:20px; z-index:10; }
|
|
415
|
+
.shepherd-feedback__trigger {
|
|
416
|
+
padding:9px 16px; border-radius:999px; border:1px solid var(--ink);
|
|
417
|
+
background:var(--ink); color:var(--bg); font-weight:600; font-size:13px; font:inherit;
|
|
418
|
+
cursor:pointer; box-shadow:0 8px 24px rgba(50,40,20,.18); }
|
|
419
|
+
.shepherd-feedback__trigger:hover { background:#413a2a; }
|
|
420
|
+
.shepherd-feedback__panel {
|
|
421
|
+
position:absolute; right:0; bottom:calc(100% + 10px); width:280px;
|
|
422
|
+
display:flex; flex-direction:column; gap:10px; padding:16px;
|
|
423
|
+
background:var(--card); border:1px solid var(--line); border-radius:12px;
|
|
424
|
+
box-shadow:0 8px 24px rgba(50,40,20,.18); }
|
|
425
|
+
.shepherd-feedback__panel h3 {
|
|
426
|
+
margin:0; font-size:13px; font-weight:600; letter-spacing:.04em;
|
|
427
|
+
text-transform:uppercase; color:var(--ink2); }
|
|
428
|
+
.shepherd-feedback__panel [role="status"] { margin:0; font-size:13px; color:var(--ink2); }
|
|
429
|
+
.shepherd-feedback__panel [role="alert"] { margin:0; font-size:13px; color:var(--drop); }
|
|
430
|
+
.shepherd-feedback__types { display:flex; gap:6px; }
|
|
431
|
+
.shepherd-feedback__types button {
|
|
432
|
+
flex:1; padding:6px 0; border-radius:8px; border:1px solid var(--line);
|
|
433
|
+
background:transparent; color:var(--ink2); font-size:12.5px; font:inherit;
|
|
434
|
+
cursor:pointer; transition:background .12s ease, color .12s ease; }
|
|
435
|
+
.shepherd-feedback__types button[aria-pressed="true"] {
|
|
436
|
+
background:var(--ink); color:var(--bg); border-color:var(--ink); font-weight:600; }
|
|
437
|
+
.shepherd-feedback__panel textarea {
|
|
438
|
+
min-height:80px; padding:9px 12px; border-radius:8px; border:1px solid var(--line);
|
|
439
|
+
background:var(--bg); color:var(--ink); font:inherit; resize:vertical; }
|
|
440
|
+
.shepherd-feedback__panel textarea::placeholder { color:var(--ink3); }
|
|
441
|
+
.shepherd-feedback__panel textarea:focus {
|
|
442
|
+
outline:none; border-color:var(--terr); box-shadow:0 0 0 3px rgba(122,106,72,.14); }
|
|
443
|
+
.shepherd-feedback__panel > button {
|
|
444
|
+
padding:9px 16px; border-radius:8px; border:1px solid var(--ink);
|
|
445
|
+
background:var(--ink); color:var(--bg); font-weight:600; cursor:pointer; font:inherit; }
|
|
446
|
+
.shepherd-feedback__panel > button:hover:not(:disabled) { background:#413a2a; }
|
|
447
|
+
.shepherd-feedback__panel > button:disabled { opacity:.55; cursor:default; }
|
|
448
|
+
|
|
449
|
+
/* Modal — a centered card over a dimmed backdrop. Used by the type-to-confirm
|
|
450
|
+
Delete workspace dialog. The first true modal in the app (the feedback
|
|
451
|
+
widget is an inline popover), so its chrome lives here rather than being
|
|
452
|
+
shared with .shepherd-feedback__panel. */
|
|
453
|
+
.shepherd-modal__backdrop {
|
|
454
|
+
position:fixed; inset:0; z-index:50; display:flex; align-items:center;
|
|
455
|
+
justify-content:center; padding:20px; background:rgba(30,24,12,.45); }
|
|
456
|
+
.shepherd-modal {
|
|
457
|
+
width:100%; max-width:440px; display:flex; flex-direction:column; gap:12px;
|
|
458
|
+
padding:22px; background:var(--card); border:1px solid var(--line);
|
|
459
|
+
border-radius:12px; box-shadow:0 16px 48px rgba(50,40,20,.28); }
|
|
460
|
+
.shepherd-modal h3 {
|
|
461
|
+
margin:0; font-size:13px; font-weight:600; letter-spacing:.04em;
|
|
462
|
+
text-transform:uppercase; color:var(--ink2); }
|
|
463
|
+
.shepherd-modal__body { margin:0; font-size:13.5px; line-height:1.5; color:var(--ink); }
|
|
464
|
+
.shepherd-modal__label { font-size:12.5px; color:var(--ink2); }
|
|
465
|
+
.shepherd-modal input {
|
|
466
|
+
width:100%; padding:9px 12px; border-radius:8px; border:1px solid var(--line);
|
|
467
|
+
background:var(--bg); color:var(--ink); font:inherit;
|
|
468
|
+
transition:border-color .12s ease, box-shadow .12s ease; }
|
|
469
|
+
.shepherd-modal input:focus {
|
|
470
|
+
outline:none; border-color:var(--terr); box-shadow:0 0 0 3px rgba(122,106,72,.14); }
|
|
471
|
+
.shepherd-modal [role="alert"] { margin:0; font-size:13px; color:var(--drop); }
|
|
472
|
+
.shepherd-modal__actions { display:flex; justify-content:flex-end; gap:10px; margin-top:4px; }
|
|
473
|
+
.shepherd-modal__actions button.danger {
|
|
474
|
+
border-color:var(--drop); background:transparent; color:var(--drop); }
|
|
475
|
+
.shepherd-modal__actions button.danger:hover:not(:disabled) {
|
|
476
|
+
background:var(--drop); color:var(--bg); }
|
|
477
|
+
.shepherd-modal__actions button:disabled { opacity:.55; cursor:default; }
|
|
478
|
+
|
|
479
|
+
/* Join workspace — the invite-link landing surface (/shepherd/join/:code).
|
|
480
|
+
A single centered card on the tan canvas; states: joining / joined /
|
|
481
|
+
error-with-retry. */
|
|
482
|
+
.shepherd-join { display:flex; align-items:center; justify-content:center;
|
|
483
|
+
min-height:70vh; padding:24px; }
|
|
484
|
+
.shepherd-join__card { width:100%; max-width:420px; display:flex;
|
|
485
|
+
flex-direction:column; align-items:center; gap:10px; text-align:center;
|
|
486
|
+
padding:36px 32px; background:var(--card); border:1px solid var(--line);
|
|
487
|
+
border-radius:14px; box-shadow:0 16px 48px rgba(50,40,20,.14); }
|
|
488
|
+
.shepherd-join__brand { margin:0; font-size:11px; font-weight:600;
|
|
489
|
+
letter-spacing:.12em; text-transform:uppercase; color:var(--ink3); }
|
|
490
|
+
.shepherd-join__card h1 { margin:0; font-size:19px; font-weight:600;
|
|
491
|
+
color:var(--ink); }
|
|
492
|
+
.shepherd-join__copy { margin:0; font-size:13.5px; line-height:1.5;
|
|
493
|
+
color:var(--ink2); }
|
|
494
|
+
.shepherd-join__copy strong { color:var(--ink); }
|
|
495
|
+
.shepherd-join__error { margin:0; font-size:13px; line-height:1.5;
|
|
496
|
+
color:var(--drop); }
|
|
497
|
+
.shepherd-join__spinner { width:22px; height:22px; margin-top:6px;
|
|
498
|
+
border-radius:50%; border:2.5px solid var(--line);
|
|
499
|
+
border-top-color:var(--ink); animation:shepherd-join-spin .8s linear infinite; }
|
|
500
|
+
@keyframes shepherd-join-spin { to { transform:rotate(360deg); } }
|
|
501
|
+
@media (prefers-reduced-motion: reduce) {
|
|
502
|
+
.shepherd-join__spinner { animation:none; }
|
|
503
|
+
}
|
|
504
|
+
.shepherd-join__retry { margin-top:6px; padding:9px 18px; border-radius:8px;
|
|
505
|
+
border:1px solid var(--ink); background:var(--ink); color:var(--bg);
|
|
506
|
+
font:inherit; font-size:13px; font-weight:600; cursor:pointer; }
|
|
507
|
+
.shepherd-join__retry:hover { background:#413a2a; }
|