codex-endpoint-switcher 1.0.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.
@@ -0,0 +1,507 @@
1
+ :root {
2
+ --bg: #f4eadf;
3
+ --panel: rgba(255, 249, 243, 0.84);
4
+ --panel-strong: rgba(255, 252, 248, 0.94);
5
+ --line: rgba(49, 40, 34, 0.12);
6
+ --text: #2f241e;
7
+ --muted: #73645b;
8
+ --accent: #d86135;
9
+ --accent-deep: #8f3114;
10
+ --accent-soft: rgba(216, 97, 53, 0.14);
11
+ --teal: #2e8b8b;
12
+ --success: #1d7a53;
13
+ --error: #a8342c;
14
+ --shadow: 0 24px 60px rgba(88, 55, 31, 0.12);
15
+ --radius-xl: 32px;
16
+ --radius-lg: 22px;
17
+ --radius-md: 16px;
18
+ }
19
+
20
+ * {
21
+ box-sizing: border-box;
22
+ }
23
+
24
+ body {
25
+ margin: 0;
26
+ min-height: 100vh;
27
+ color: var(--text);
28
+ font-family: "Segoe UI Variable", "Microsoft YaHei UI", "PingFang SC", sans-serif;
29
+ background:
30
+ radial-gradient(circle at top left, rgba(216, 97, 53, 0.22), transparent 28%),
31
+ radial-gradient(circle at right center, rgba(46, 139, 139, 0.18), transparent 30%),
32
+ linear-gradient(160deg, #f7efe6 0%, #f3e3d4 45%, #efe7e0 100%);
33
+ }
34
+
35
+ button,
36
+ input {
37
+ font: inherit;
38
+ }
39
+
40
+ code {
41
+ padding: 0.15rem 0.42rem;
42
+ border-radius: 999px;
43
+ background: rgba(47, 36, 30, 0.08);
44
+ }
45
+
46
+ .page-shell {
47
+ position: relative;
48
+ max-width: 1440px;
49
+ margin: 0 auto;
50
+ padding: 28px;
51
+ }
52
+
53
+ .hero-card,
54
+ .panel {
55
+ backdrop-filter: blur(18px);
56
+ -webkit-backdrop-filter: blur(18px);
57
+ background: var(--panel);
58
+ border: 1px solid var(--line);
59
+ box-shadow: var(--shadow);
60
+ }
61
+
62
+ .hero-card {
63
+ display: grid;
64
+ grid-template-columns: 1.6fr 0.9fr;
65
+ gap: 20px;
66
+ overflow: hidden;
67
+ padding: 34px;
68
+ border-radius: var(--radius-xl);
69
+ }
70
+
71
+ .eyebrow,
72
+ .panel-kicker {
73
+ margin: 0 0 10px;
74
+ color: var(--accent-deep);
75
+ letter-spacing: 0.18em;
76
+ font-size: 0.78rem;
77
+ font-weight: 700;
78
+ }
79
+
80
+ .hero-copy h1,
81
+ .panel-header h2,
82
+ .profile-heading h3 {
83
+ margin: 0;
84
+ font-family: "Bahnschrift", "Microsoft YaHei UI", sans-serif;
85
+ letter-spacing: 0.01em;
86
+ }
87
+
88
+ .hero-copy h1 {
89
+ font-size: clamp(2rem, 3vw, 3.3rem);
90
+ line-height: 1.05;
91
+ }
92
+
93
+ .hero-text {
94
+ max-width: 620px;
95
+ margin: 16px 0 0;
96
+ color: var(--muted);
97
+ font-size: 1rem;
98
+ line-height: 1.7;
99
+ }
100
+
101
+ .hero-actions {
102
+ display: flex;
103
+ flex-wrap: wrap;
104
+ gap: 12px;
105
+ margin-top: 24px;
106
+ }
107
+
108
+ .hero-side {
109
+ position: relative;
110
+ min-height: 220px;
111
+ border-radius: 28px;
112
+ background:
113
+ linear-gradient(145deg, rgba(216, 97, 53, 0.18), rgba(46, 139, 139, 0.16)),
114
+ rgba(255, 255, 255, 0.42);
115
+ border: 1px solid rgba(255, 255, 255, 0.3);
116
+ overflow: hidden;
117
+ }
118
+
119
+ .hero-badge {
120
+ position: absolute;
121
+ right: 22px;
122
+ bottom: 22px;
123
+ display: inline-flex;
124
+ align-items: center;
125
+ padding: 12px 18px;
126
+ border-radius: 999px;
127
+ background: rgba(255, 255, 255, 0.82);
128
+ border: 1px solid rgba(47, 36, 30, 0.08);
129
+ color: var(--text);
130
+ font-weight: 700;
131
+ }
132
+
133
+ .orb {
134
+ position: absolute;
135
+ border-radius: 999px;
136
+ filter: blur(2px);
137
+ animation: drift 9s ease-in-out infinite;
138
+ }
139
+
140
+ .orb-a {
141
+ top: 28px;
142
+ left: 36px;
143
+ width: 180px;
144
+ height: 180px;
145
+ background: radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.92), rgba(216, 97, 53, 0.6));
146
+ }
147
+
148
+ .orb-b {
149
+ right: 32px;
150
+ top: 84px;
151
+ width: 140px;
152
+ height: 140px;
153
+ background: radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.9), rgba(46, 139, 139, 0.65));
154
+ animation-delay: -3s;
155
+ }
156
+
157
+ .content-grid {
158
+ display: grid;
159
+ grid-template-columns: 1.15fr 0.85fr;
160
+ gap: 20px;
161
+ margin-top: 22px;
162
+ }
163
+
164
+ .panel {
165
+ padding: 24px;
166
+ border-radius: var(--radius-lg);
167
+ }
168
+
169
+ .current-panel,
170
+ .profiles-panel,
171
+ .footer-panel {
172
+ grid-column: 1 / 2;
173
+ }
174
+
175
+ .action-panel {
176
+ grid-column: 2 / 3;
177
+ grid-row: 1 / 3;
178
+ }
179
+
180
+ .footer-panel {
181
+ grid-column: 1 / 3;
182
+ }
183
+
184
+ .panel-header {
185
+ display: flex;
186
+ justify-content: space-between;
187
+ gap: 16px;
188
+ align-items: start;
189
+ margin-bottom: 18px;
190
+ }
191
+
192
+ .panel-tag,
193
+ .profile-count {
194
+ display: inline-flex;
195
+ align-items: center;
196
+ gap: 8px;
197
+ padding: 8px 12px;
198
+ border-radius: 999px;
199
+ background: var(--accent-soft);
200
+ color: var(--accent-deep);
201
+ font-weight: 700;
202
+ }
203
+
204
+ .current-grid {
205
+ display: grid;
206
+ grid-template-columns: repeat(2, minmax(0, 1fr));
207
+ gap: 14px;
208
+ }
209
+
210
+ .metric-card {
211
+ padding: 18px;
212
+ border-radius: var(--radius-md);
213
+ background: var(--panel-strong);
214
+ border: 1px solid rgba(47, 36, 30, 0.08);
215
+ }
216
+
217
+ .metric-card strong {
218
+ display: block;
219
+ margin-top: 8px;
220
+ font-size: 1rem;
221
+ word-break: break-all;
222
+ }
223
+
224
+ .metric-card-wide {
225
+ grid-column: span 2;
226
+ }
227
+
228
+ .metric-label {
229
+ color: var(--muted);
230
+ font-size: 0.88rem;
231
+ }
232
+
233
+ .stack-form {
234
+ display: grid;
235
+ gap: 14px;
236
+ padding: 16px;
237
+ border-radius: var(--radius-md);
238
+ background: rgba(255, 255, 255, 0.45);
239
+ border: 1px solid rgba(47, 36, 30, 0.08);
240
+ }
241
+
242
+ .stack-form + .stack-form {
243
+ margin-top: 16px;
244
+ }
245
+
246
+ .stack-form-alt {
247
+ background: rgba(251, 246, 240, 0.7);
248
+ }
249
+
250
+ .field {
251
+ display: grid;
252
+ gap: 8px;
253
+ }
254
+
255
+ .field span {
256
+ font-size: 0.92rem;
257
+ color: var(--muted);
258
+ }
259
+
260
+ input[type="text"],
261
+ input[type="password"],
262
+ input[type="file"] {
263
+ width: 100%;
264
+ min-height: 46px;
265
+ padding: 10px 14px;
266
+ border: 1px solid rgba(47, 36, 30, 0.12);
267
+ border-radius: 14px;
268
+ background: rgba(255, 255, 255, 0.82);
269
+ color: var(--text);
270
+ }
271
+
272
+ input[readonly] {
273
+ color: var(--muted);
274
+ background: rgba(249, 244, 238, 0.95);
275
+ }
276
+
277
+ .inline-field {
278
+ display: grid;
279
+ grid-template-columns: 1fr auto;
280
+ gap: 10px;
281
+ }
282
+
283
+ .checkbox-row {
284
+ display: flex;
285
+ gap: 10px;
286
+ align-items: center;
287
+ color: var(--muted);
288
+ }
289
+
290
+ .field-hint {
291
+ margin: -2px 0 0;
292
+ color: var(--muted);
293
+ font-size: 0.85rem;
294
+ line-height: 1.6;
295
+ }
296
+
297
+ .action-row {
298
+ display: flex;
299
+ flex-wrap: wrap;
300
+ gap: 10px;
301
+ }
302
+
303
+ .primary-button,
304
+ .secondary-button,
305
+ .ghost-button {
306
+ height: 44px;
307
+ padding: 0 16px;
308
+ border-radius: 999px;
309
+ border: 1px solid transparent;
310
+ cursor: pointer;
311
+ transition:
312
+ transform 0.18s ease,
313
+ box-shadow 0.18s ease,
314
+ background 0.18s ease;
315
+ }
316
+
317
+ .primary-button {
318
+ background: linear-gradient(135deg, #d86135, #b1431d);
319
+ color: #fff;
320
+ box-shadow: 0 12px 28px rgba(179, 67, 29, 0.28);
321
+ }
322
+
323
+ .secondary-button {
324
+ background: linear-gradient(135deg, #2e8b8b, #276d6d);
325
+ color: #fff;
326
+ box-shadow: 0 12px 28px rgba(39, 109, 109, 0.22);
327
+ }
328
+
329
+ .ghost-button {
330
+ background: rgba(255, 255, 255, 0.62);
331
+ color: var(--text);
332
+ border-color: rgba(47, 36, 30, 0.1);
333
+ }
334
+
335
+ .danger-button {
336
+ height: 44px;
337
+ padding: 0 16px;
338
+ border-radius: 999px;
339
+ border: 1px solid rgba(168, 52, 44, 0.15);
340
+ cursor: pointer;
341
+ background: rgba(168, 52, 44, 0.1);
342
+ color: var(--error);
343
+ transition:
344
+ transform 0.18s ease,
345
+ box-shadow 0.18s ease,
346
+ background 0.18s ease;
347
+ }
348
+
349
+ .primary-button:hover,
350
+ .secondary-button:hover,
351
+ .ghost-button:hover,
352
+ .danger-button:hover {
353
+ transform: translateY(-1px);
354
+ }
355
+
356
+ .primary-button:disabled,
357
+ .secondary-button:disabled,
358
+ .ghost-button:disabled,
359
+ .danger-button:disabled {
360
+ cursor: not-allowed;
361
+ opacity: 0.6;
362
+ transform: none;
363
+ }
364
+
365
+ .profiles-list {
366
+ display: grid;
367
+ gap: 14px;
368
+ }
369
+
370
+ .profile-card {
371
+ display: grid;
372
+ gap: 14px;
373
+ padding: 18px;
374
+ border-radius: var(--radius-md);
375
+ background: var(--panel-strong);
376
+ border: 1px solid rgba(47, 36, 30, 0.08);
377
+ }
378
+
379
+ .profile-card.active {
380
+ border-color: rgba(216, 97, 53, 0.42);
381
+ box-shadow: inset 0 0 0 1px rgba(216, 97, 53, 0.16);
382
+ }
383
+
384
+ .profile-topline {
385
+ display: flex;
386
+ justify-content: space-between;
387
+ gap: 16px;
388
+ align-items: start;
389
+ }
390
+
391
+ .card-actions {
392
+ display: flex;
393
+ flex-wrap: wrap;
394
+ gap: 8px;
395
+ justify-content: flex-end;
396
+ }
397
+
398
+ .profile-heading {
399
+ display: grid;
400
+ gap: 8px;
401
+ }
402
+
403
+ .profile-badges {
404
+ display: flex;
405
+ flex-wrap: wrap;
406
+ gap: 8px;
407
+ }
408
+
409
+ .mini-badge {
410
+ display: inline-flex;
411
+ align-items: center;
412
+ padding: 6px 10px;
413
+ border-radius: 999px;
414
+ background: rgba(47, 36, 30, 0.06);
415
+ color: var(--muted);
416
+ font-size: 0.82rem;
417
+ }
418
+
419
+ .mini-badge.active {
420
+ background: rgba(216, 97, 53, 0.14);
421
+ color: var(--accent-deep);
422
+ }
423
+
424
+ .profile-meta {
425
+ display: grid;
426
+ gap: 8px;
427
+ }
428
+
429
+ .profile-meta span {
430
+ display: grid;
431
+ gap: 4px;
432
+ color: var(--muted);
433
+ font-size: 0.92rem;
434
+ }
435
+
436
+ .profile-meta strong {
437
+ color: var(--text);
438
+ }
439
+
440
+ .profile-path {
441
+ margin: 0;
442
+ color: var(--muted);
443
+ font-size: 0.86rem;
444
+ word-break: break-all;
445
+ }
446
+
447
+ .empty-state {
448
+ padding: 26px;
449
+ border-radius: var(--radius-md);
450
+ text-align: center;
451
+ color: var(--muted);
452
+ background: rgba(255, 255, 255, 0.56);
453
+ border: 1px dashed rgba(47, 36, 30, 0.16);
454
+ }
455
+
456
+ .status-box {
457
+ min-height: 70px;
458
+ padding: 18px;
459
+ border-radius: var(--radius-md);
460
+ border: 1px solid rgba(47, 36, 30, 0.08);
461
+ line-height: 1.7;
462
+ white-space: pre-wrap;
463
+ }
464
+
465
+ .status-box.info {
466
+ background: rgba(46, 139, 139, 0.08);
467
+ color: #245c5c;
468
+ }
469
+
470
+ .status-box.success {
471
+ background: rgba(29, 122, 83, 0.1);
472
+ color: var(--success);
473
+ }
474
+
475
+ .status-box.error {
476
+ background: rgba(168, 52, 44, 0.1);
477
+ color: var(--error);
478
+ }
479
+
480
+ @keyframes drift {
481
+ 0%,
482
+ 100% {
483
+ transform: translate3d(0, 0, 0) scale(1);
484
+ }
485
+ 50% {
486
+ transform: translate3d(8px, -12px, 0) scale(1.04);
487
+ }
488
+ }
489
+
490
+ @media (max-width: 1160px) {
491
+ .hero-card,
492
+ .content-grid {
493
+ grid-template-columns: 1fr;
494
+ }
495
+
496
+ .action-panel,
497
+ .footer-panel,
498
+ .profiles-panel,
499
+ .current-panel {
500
+ grid-column: auto;
501
+ grid-row: auto;
502
+ }
503
+
504
+ .hero-side {
505
+ min-height: 180px;
506
+ }
507
+ }