CSS · 60120 bytes Raw Blame History
1 /* SPDX-License-Identifier: AGPL-3.0-or-later */
2 /*
3 * shithub — base styles.
4 *
5 * S02 layers our own chrome over the Primer CSS that ships in
6 * /static/primer/primer.css. We pull a small set of token overrides so the
7 * theme system (light / dark / auto / high-contrast) drives everything via
8 * CSS custom properties.
9 *
10 * Color tokens follow Primer's naming so most of these become migration
11 * candidates as Primer's primitives stabilize.
12 */
13
14 :root {
15 --canvas-default: #ffffff;
16 --canvas-subtle: #f6f8fa;
17 --canvas-inset: #eaeef2;
18 --fg-default: #1f2328;
19 --fg-muted: #59636e;
20 --border-default: #d0d7de;
21 --border-muted: #d8dee4;
22 --accent-fg: #0969da;
23 --accent-emphasis: #0969da;
24 --accent-subtle: #fff8c5; /* GitHub's "you-are-here" line highlight */
25 --success-fg: #1a7f37;
26 --danger-fg: #cf222e;
27 --shithub-mark: var(--danger-fg);
28 }
29
30 [data-theme="dark"] {
31 --canvas-default: #0d1117;
32 --canvas-subtle: #161b22;
33 --canvas-inset: #010409;
34 --fg-default: #f0f6fc;
35 --fg-muted: #9198a1;
36 --border-default: #3d444d;
37 --border-muted: #232a33;
38 --accent-fg: #4493f8;
39 --accent-emphasis: #1f6feb;
40 --accent-subtle: rgba(187, 128, 9, 0.15); /* dark-mode :target wash */
41 --success-fg: #3fb950;
42 --danger-fg: #f85149;
43 }
44
45 [data-theme="high-contrast"] {
46 --canvas-default: #000000;
47 --canvas-subtle: #0a0c10;
48 --canvas-inset: #000000;
49 --fg-default: #ffffff;
50 --fg-muted: #d9dee3;
51 --border-default: #7a828e;
52 --border-muted: #525964;
53 --accent-fg: #71b7ff;
54 --accent-emphasis: #409eff;
55 --accent-subtle: rgba(255, 215, 0, 0.25);
56 --success-fg: #4ed162;
57 --danger-fg: #ff6a69;
58 }
59
60 * { box-sizing: border-box; }
61
62 html, body {
63 margin: 0;
64 padding: 0;
65 background: var(--canvas-default);
66 color: var(--fg-default);
67 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif;
68 font-size: 16px;
69 line-height: 1.5;
70 }
71
72 a {
73 color: var(--accent-fg);
74 text-decoration: none;
75 }
76 a:hover { text-decoration: underline; }
77
78 code {
79 font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
80 font-size: 0.875em;
81 background: var(--canvas-subtle);
82 padding: 0.1em 0.35em;
83 border-radius: 4px;
84 }
85
86 /* ========== Nav ========== */
87
88 .shithub-body {
89 min-height: 100vh;
90 display: flex;
91 flex-direction: column;
92 }
93
94 .shithub-nav {
95 display: flex;
96 align-items: center;
97 gap: 1.5rem;
98 padding: 0.75rem 1.25rem;
99 background: var(--canvas-subtle);
100 border-bottom: 1px solid var(--border-default);
101 }
102
103 .shithub-nav-brand {
104 display: flex;
105 align-items: center;
106 gap: 0.5rem;
107 color: var(--fg-default);
108 font-weight: 600;
109 letter-spacing: -0.01em;
110 }
111 .shithub-nav-brand:hover { text-decoration: none; }
112 .shithub-nav-brand svg { color: var(--shithub-mark); }
113
114 .shithub-nav-links {
115 display: flex;
116 gap: 1rem;
117 flex: 1;
118 }
119 .shithub-nav-links a {
120 color: var(--fg-default);
121 font-size: 0.9rem;
122 }
123
124 .shithub-nav-actions {
125 display: flex;
126 gap: 0.5rem;
127 align-items: center;
128 }
129
130 /* User-menu dropdown — uses native <details>/<summary> so it works without JS. */
131 .shithub-user-menu { position: relative; }
132 .shithub-user-menu > summary {
133 list-style: none;
134 display: inline-flex;
135 align-items: center;
136 gap: 0.5rem;
137 padding: 0.25rem 0.6rem;
138 border: 1px solid var(--border-default);
139 border-radius: 6px;
140 background: transparent;
141 cursor: pointer;
142 font-size: 0.875rem;
143 color: var(--fg-default);
144 }
145 .shithub-user-menu > summary::-webkit-details-marker { display: none; }
146 .shithub-user-menu-avatar {
147 width: 24px;
148 height: 24px;
149 border-radius: 50%;
150 display: block;
151 background: var(--canvas-default);
152 }
153 .shithub-user-menu-name { font-weight: 500; }
154 .shithub-user-menu-panel {
155 position: absolute;
156 right: 0;
157 top: calc(100% + 0.35rem);
158 min-width: 220px;
159 background: var(--canvas-default);
160 border: 1px solid var(--border-default);
161 border-radius: 6px;
162 padding: 0.4rem 0;
163 box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
164 z-index: 50;
165 display: flex;
166 flex-direction: column;
167 }
168 .shithub-user-menu-header {
169 padding: 0.5rem 0.85rem;
170 font-size: 0.8rem;
171 color: var(--fg-muted);
172 border-bottom: 1px solid var(--border-default);
173 margin-bottom: 0.25rem;
174 }
175 .shithub-user-menu-panel a,
176 .shithub-user-menu-signout button {
177 display: block;
178 text-align: left;
179 width: 100%;
180 padding: 0.45rem 0.85rem;
181 background: transparent;
182 border: 0;
183 color: var(--fg-default);
184 font-size: 0.875rem;
185 cursor: pointer;
186 }
187 .shithub-user-menu-panel a:hover,
188 .shithub-user-menu-signout button:hover {
189 background: var(--canvas-subtle);
190 text-decoration: none;
191 }
192 .shithub-user-menu-signout { margin: 0; padding: 0; border-top: 1px solid var(--border-default); margin-top: 0.25rem; }
193
194 .hello-greeting {
195 margin: 1rem auto 1.5rem;
196 padding: 0.85rem 1rem;
197 border: 1px solid var(--border-default);
198 border-radius: 6px;
199 background: var(--canvas-subtle);
200 max-width: 32rem;
201 text-align: left;
202 }
203 .hello-greeting p { margin: 0 0 0.5rem; }
204 .hello-quicklinks { display: flex; gap: 1rem; flex-wrap: wrap; font-size: 0.9rem; }
205
206 .shithub-button {
207 display: inline-flex;
208 align-items: center;
209 padding: 0.4rem 0.85rem;
210 border-radius: 6px;
211 font-size: 0.875rem;
212 font-weight: 500;
213 border: 1px solid transparent;
214 cursor: pointer;
215 }
216 .shithub-button-ghost {
217 color: var(--fg-default);
218 border-color: var(--border-default);
219 background: transparent;
220 }
221 .shithub-button-primary {
222 color: #fff;
223 background: var(--accent-emphasis);
224 border-color: var(--accent-emphasis);
225 }
226 .shithub-button-primary:hover { text-decoration: none; opacity: 0.92; }
227
228 /* ========== Main + Footer ========== */
229
230 .shithub-main {
231 flex: 1;
232 width: 100%;
233 }
234
235 .shithub-footer {
236 border-top: 1px solid var(--border-default);
237 background: var(--canvas-subtle);
238 padding: 1.25rem;
239 font-size: 0.85rem;
240 color: var(--fg-muted);
241 }
242 .shithub-footer-inner {
243 max-width: 1200px;
244 margin: 0 auto;
245 display: flex;
246 justify-content: space-between;
247 align-items: center;
248 gap: 1rem;
249 }
250 .shithub-footer-brand {
251 display: flex;
252 align-items: center;
253 gap: 0.4rem;
254 color: var(--fg-default);
255 }
256 .shithub-footer-brand svg { color: var(--shithub-mark); }
257 .shithub-footer-meta { color: var(--fg-muted); margin-left: 0.5rem; font-size: 0.8rem; }
258 .shithub-footer-links { display: flex; gap: 1rem; }
259
260 /* ========== Hello page ========== */
261
262 .hello {
263 max-width: 640px;
264 margin: 4rem auto;
265 padding: 2rem 1.5rem;
266 text-align: center;
267 }
268 .hello-logo {
269 margin: 0 auto 1.5rem;
270 width: 160px;
271 height: 160px;
272 color: var(--shithub-mark);
273 }
274 .hello-logo svg { width: 100%; height: 100%; }
275 .hello-title {
276 font-size: 2.75rem;
277 margin: 0 0 0.5rem;
278 letter-spacing: -0.02em;
279 }
280 .hello-tagline {
281 color: var(--fg-muted);
282 font-size: 1.15rem;
283 margin: 0 0 2rem;
284 }
285 .hello-meta {
286 display: grid;
287 grid-template-columns: max-content 1fr;
288 gap: 0.25rem 1rem;
289 max-width: 24rem;
290 margin: 0 auto 2rem;
291 padding: 1rem 1.5rem;
292 background: var(--canvas-subtle);
293 border: 1px solid var(--border-default);
294 border-radius: 6px;
295 text-align: left;
296 font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
297 font-size: 0.875rem;
298 }
299 .hello-meta dt { color: var(--fg-muted); }
300 .hello-meta dd { margin: 0; }
301 .hello-status {
302 color: var(--fg-muted);
303 margin: 0 auto 2rem;
304 max-width: 36rem;
305 }
306 .hello-links {
307 display: flex;
308 justify-content: center;
309 gap: 1rem;
310 font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
311 font-size: 0.875rem;
312 }
313
314 /* ========== Error pages ========== */
315
316 .error-page {
317 max-width: 540px;
318 margin: 6rem auto;
319 padding: 2rem 1.5rem;
320 text-align: center;
321 }
322 .error-glyph {
323 display: inline-flex;
324 width: 64px; height: 64px;
325 align-items: center; justify-content: center;
326 border-radius: 50%;
327 background: var(--canvas-subtle);
328 color: var(--danger-fg);
329 margin-bottom: 1.5rem;
330 }
331 .error-glyph svg { width: 32px; height: 32px; }
332 .error-status {
333 margin: 0;
334 font-size: 4rem;
335 letter-spacing: -0.04em;
336 color: var(--fg-default);
337 }
338 .error-title {
339 margin: 0 0 0.75rem;
340 font-size: 1.4rem;
341 font-weight: 500;
342 }
343 .error-detail {
344 color: var(--fg-muted);
345 margin: 0 0 2rem;
346 max-width: 36rem;
347 margin-left: auto;
348 margin-right: auto;
349 }
350 .error-hint a {
351 display: inline-block;
352 padding: 0.5rem 1rem;
353 border: 1px solid var(--border-default);
354 border-radius: 6px;
355 color: var(--fg-default);
356 }
357 .error-hint a:hover { text-decoration: none; background: var(--canvas-subtle); }
358 .error-request-id {
359 margin-top: 2rem;
360 color: var(--fg-muted);
361 font-size: 0.8rem;
362 }
363
364 /* ----- auth (S05) ----- */
365 .shithub-auth {
366 max-width: 28rem;
367 margin: 3rem auto;
368 padding: 2rem;
369 background: var(--canvas-default);
370 border: 1px solid var(--border-default);
371 border-radius: 8px;
372 }
373 .shithub-auth h1 {
374 margin: 0 0 1.5rem;
375 font-size: 1.5rem;
376 }
377 .shithub-auth form { display: grid; gap: 1rem; }
378 .shithub-auth label { display: grid; gap: 0.25rem; font-weight: 500; }
379 .shithub-auth input[type=text],
380 .shithub-auth input[type=email],
381 .shithub-auth input[type=password] {
382 font: inherit;
383 padding: 0.5rem 0.75rem;
384 border: 1px solid var(--border-default);
385 border-radius: 6px;
386 background: var(--canvas-subtle);
387 }
388 .shithub-auth-aside {
389 margin: 1.5rem 0 0;
390 text-align: center;
391 color: var(--fg-muted);
392 font-size: 0.9rem;
393 }
394 .shithub-flash {
395 margin: 0 0 1rem;
396 padding: 0.75rem 1rem;
397 border-radius: 6px;
398 border: 1px solid var(--border-default);
399 }
400 .shithub-flash-error { background: rgba(248, 81, 73, 0.1); border-color: rgba(248, 81, 73, 0.3); }
401 .shithub-flash-notice { background: rgba(56, 139, 253, 0.1); border-color: rgba(56, 139, 253, 0.3); }
402
403 /* ----- 2FA (S06) ----- */
404 .shithub-auth-wide { max-width: 32rem; }
405 .shithub-2fa-steps { margin: 0 0 1.5rem; padding-left: 1.25rem; }
406 .shithub-2fa-steps li { margin: 0.25rem 0; }
407 .shithub-2fa-qr {
408 display: flex;
409 justify-content: center;
410 margin: 1rem 0;
411 padding: 1rem;
412 background: #ffffff;
413 border-radius: 6px;
414 border: 1px solid var(--border-default);
415 }
416 .shithub-2fa-secret {
417 text-align: center;
418 font-family: monospace;
419 margin: 0 0 1.5rem;
420 color: var(--fg-muted);
421 }
422 .shithub-recovery-codes {
423 list-style: none;
424 margin: 1rem 0;
425 padding: 1rem;
426 display: grid;
427 grid-template-columns: repeat(2, 1fr);
428 gap: 0.5rem;
429 background: var(--canvas-subtle);
430 border-radius: 6px;
431 font-family: monospace;
432 font-size: 1.05em;
433 }
434 .shithub-recovery-codes li code { background: transparent; padding: 0; }
435 .shithub-button-danger { background: rgba(248, 81, 73, 0.15); border-color: rgba(248, 81, 73, 0.4); }
436
437 /* ----- SSH keys (S07) ----- */
438 .shithub-key-list { list-style: none; padding: 0; margin: 1rem 0 2rem; }
439 .shithub-key-row {
440 display: flex;
441 justify-content: space-between;
442 align-items: flex-start;
443 gap: 1rem;
444 padding: 0.75rem;
445 border: 1px solid var(--border-default);
446 border-radius: 6px;
447 margin-bottom: 0.5rem;
448 }
449 .shithub-key-meta { margin-left: 0.75rem; color: var(--fg-muted); font-size: 0.85rem; }
450 .shithub-key-fp { display: block; margin-top: 0.25rem; font-size: 0.85rem; word-break: break-all; }
451 .shithub-key-last { display: block; margin-top: 0.25rem; color: var(--fg-muted); font-size: 0.8rem; }
452 .shithub-key-empty { color: var(--fg-muted); margin: 1rem 0 2rem; }
453
454 /* ----- profile (S09) ----- */
455 .shithub-profile { max-width: 56rem; margin: 2rem auto; padding: 0 1rem; }
456 .shithub-profile-header { display: flex; gap: 1.5rem; align-items: flex-start; }
457 .shithub-profile-avatar { width: 200px; height: 200px; border-radius: 50%; background: var(--canvas-subtle); border: 1px solid var(--border-default); }
458 .shithub-profile-id h1 { margin: 0 0 0.25rem; font-size: 1.5rem; }
459 .shithub-profile-handle { margin: 0; color: var(--fg-muted); }
460 .shithub-profile-pronouns { margin: 0.25rem 0 0; color: var(--fg-muted); font-size: 0.9rem; }
461 .shithub-profile-you { margin-left: 0.5rem; padding: 0.1rem 0.4rem; background: var(--canvas-subtle); border: 1px solid var(--border-default); border-radius: 6px; font-size: 0.7rem; color: var(--fg-muted); vertical-align: middle; }
462 .shithub-profile-id .shithub-button { margin-top: 0.75rem; display: inline-block; }
463 .shithub-profile-bio { margin: 1.5rem 0; font-size: 1.05rem; }
464 .shithub-profile-meta { display: grid; grid-template-columns: max-content 1fr; gap: 0.25rem 1rem; margin: 1rem 0; }
465 .shithub-profile-meta dt { color: var(--fg-muted); font-weight: 500; }
466 .shithub-profile-meta dd { margin: 0; }
467 .shithub-profile-pinned, .shithub-profile-contributions, .shithub-profile-readme { margin: 2rem 0; }
468 .shithub-profile-pinned h2, .shithub-profile-contributions h2, .shithub-profile-readme h2 { font-size: 1.1rem; margin: 0 0 0.5rem; padding-bottom: 0.25rem; border-bottom: 1px solid var(--border-default); }
469 .shithub-empty { color: var(--fg-muted); font-style: italic; padding: 1rem; background: var(--canvas-subtle); border-radius: 6px; }
470 .shithub-profile-unavailable h1 { color: var(--fg-muted); }
471
472 /* ----- settings shell (S10) ----- */
473 .shithub-settings-page {
474 max-width: 64rem;
475 margin: 2rem auto;
476 padding: 0 1rem;
477 display: grid;
478 grid-template-columns: 220px 1fr;
479 gap: 2rem;
480 align-items: start;
481 }
482 .shithub-settings-side { font-size: 0.9rem; }
483 .shithub-settings-side-title {
484 margin: 0 0 0.75rem;
485 font-size: 1.5rem;
486 font-weight: 400;
487 padding-bottom: 0.5rem;
488 border-bottom: 1px solid var(--border-default);
489 }
490 .shithub-settings-side nav ul {
491 list-style: none;
492 padding: 0;
493 margin: 0 0 1rem;
494 }
495 .shithub-settings-side nav li {
496 border-radius: 6px;
497 }
498 .shithub-settings-side nav li.active {
499 background: var(--canvas-subtle);
500 border-left: 2px solid var(--accent-emphasis);
501 }
502 .shithub-settings-side nav li a {
503 display: block;
504 padding: 0.4rem 0.75rem;
505 color: var(--fg-default);
506 text-decoration: none;
507 border-radius: 6px;
508 }
509 .shithub-settings-side nav li a:hover { background: var(--canvas-subtle); }
510 .shithub-settings-side nav li.active a { font-weight: 500; }
511 .shithub-settings-side-group {
512 margin: 1.25rem 0 0.5rem;
513 padding-top: 0.75rem;
514 border-top: 1px solid var(--border-default);
515 font-size: 0.75rem;
516 font-weight: 600;
517 text-transform: uppercase;
518 letter-spacing: 0.05em;
519 color: var(--fg-muted);
520 }
521 .shithub-settings-danger { color: #cf222e; }
522
523 .shithub-settings-content { min-width: 0; }
524 .shithub-settings-content > h1 {
525 margin: 0 0 1.5rem;
526 padding-bottom: 0.75rem;
527 border-bottom: 1px solid var(--border-default);
528 font-size: 1.5rem;
529 font-weight: 400;
530 }
531 .shithub-settings-section {
532 margin: 0 0 2rem;
533 padding-bottom: 1.5rem;
534 border-bottom: 1px solid var(--border-muted, var(--border-default));
535 }
536 .shithub-settings-section:last-child { border-bottom: none; }
537 .shithub-settings-section h2 {
538 margin: 0 0 0.5rem;
539 font-size: 1rem;
540 font-weight: 600;
541 }
542 .shithub-settings-section p { margin: 0 0 1rem; color: var(--fg-muted); }
543 .shithub-settings-section form { display: grid; gap: 0.85rem; max-width: 32rem; }
544 .shithub-settings-section label { display: grid; gap: 0.25rem; font-weight: 500; font-size: 0.9rem; }
545 .shithub-settings-section input[type=text],
546 .shithub-settings-section input[type=email],
547 .shithub-settings-section input[type=password],
548 .shithub-settings-section input[type=url],
549 .shithub-settings-section textarea,
550 .shithub-settings-section select {
551 font: inherit;
552 padding: 0.5rem 0.75rem;
553 border: 1px solid var(--border-default);
554 border-radius: 6px;
555 background: var(--canvas-subtle);
556 }
557 .shithub-settings-section textarea { min-height: 4rem; resize: vertical; }
558 .shithub-settings-section .shithub-button { justify-self: start; }
559
560 .shithub-settings-danger-zone {
561 border: 1px solid rgba(207, 34, 46, 0.4);
562 border-radius: 6px;
563 padding: 1rem 1.25rem;
564 background: rgba(207, 34, 46, 0.04);
565 }
566 .shithub-settings-danger-zone h2 { color: #cf222e; }
567
568 .shithub-settings-section label small {
569 font-weight: 400;
570 color: var(--fg-muted);
571 font-size: 0.8rem;
572 }
573
574 .shithub-profile-edit {
575 display: grid;
576 grid-template-columns: minmax(0, 1fr) 220px;
577 gap: 2rem;
578 align-items: start;
579 }
580 .shithub-profile-edit-form { margin: 0; padding: 0; border: none; }
581 .shithub-profile-edit-aside h2 { margin: 0 0 0.75rem; font-size: 0.9rem; font-weight: 600; }
582 .shithub-profile-edit-avatar {
583 width: 200px;
584 height: 200px;
585 border-radius: 50%;
586 border: 1px solid var(--border-default);
587 background: var(--canvas-subtle);
588 display: block;
589 }
590 .shithub-empty-note {
591 margin: 0.5rem 0 0;
592 font-size: 0.8rem;
593 color: var(--fg-muted);
594 }
595 .shithub-profile-edit-aside form {
596 margin: 0.75rem 0 0;
597 display: grid;
598 gap: 0.5rem;
599 }
600 .shithub-profile-edit-upload span {
601 display: block;
602 font-size: 0.85rem;
603 font-weight: 500;
604 margin-bottom: 0.25rem;
605 }
606 .shithub-profile-edit-upload input[type=file] {
607 font-size: 0.85rem;
608 }
609
610 @media (max-width: 720px) {
611 .shithub-settings-page {
612 grid-template-columns: 1fr;
613 }
614 .shithub-profile-edit {
615 grid-template-columns: 1fr;
616 }
617 }
618
619 /* ----- theme picker (S10) ----- */
620 .shithub-theme-grid {
621 border: none;
622 padding: 0;
623 margin: 0 0 1rem;
624 display: grid;
625 grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
626 gap: 0.75rem;
627 }
628 .shithub-theme-grid legend {
629 padding: 0;
630 margin: 0 0 0.5rem;
631 font-size: 0.85rem;
632 font-weight: 500;
633 }
634 .shithub-theme-card {
635 display: grid;
636 gap: 0.25rem;
637 padding: 0.85rem 1rem;
638 border: 1px solid var(--border-default);
639 border-radius: 8px;
640 background: var(--canvas-subtle);
641 cursor: pointer;
642 position: relative;
643 transition: border-color 120ms;
644 }
645 .shithub-theme-card:hover { border-color: var(--accent-emphasis); }
646 .shithub-theme-card.active {
647 border-color: var(--accent-emphasis);
648 box-shadow: 0 0 0 1px var(--accent-emphasis) inset;
649 }
650 .shithub-theme-card input[type=radio] {
651 position: absolute;
652 top: 0.6rem;
653 right: 0.6rem;
654 }
655 .shithub-theme-card-title {
656 font-weight: 600;
657 font-size: 0.95rem;
658 }
659 .shithub-theme-card-desc {
660 font-size: 0.8rem;
661 color: var(--fg-muted);
662 }
663
664 /* ----- emails (S10) ----- */
665 .shithub-email-list {
666 list-style: none;
667 padding: 0;
668 margin: 1rem 0 0;
669 display: grid;
670 gap: 0.5rem;
671 }
672 .shithub-email-row {
673 display: flex;
674 justify-content: space-between;
675 align-items: center;
676 gap: 1rem;
677 padding: 0.75rem 1rem;
678 border: 1px solid var(--border-default);
679 border-radius: 6px;
680 background: var(--canvas-subtle);
681 }
682 .shithub-email-meta { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
683 .shithub-email-addr { background: transparent; padding: 0; font-weight: 500; }
684 .shithub-email-actions { display: flex; gap: 0.5rem; flex-wrap: wrap; }
685 .shithub-email-actions form { display: inline; }
686 .shithub-pill {
687 font-size: 0.7rem;
688 padding: 0.1rem 0.5rem;
689 border-radius: 999px;
690 border: 1px solid var(--border-default);
691 text-transform: uppercase;
692 letter-spacing: 0.04em;
693 font-weight: 600;
694 }
695 .shithub-pill-primary { background: rgba(56, 139, 253, 0.15); border-color: rgba(56, 139, 253, 0.4); }
696 .shithub-pill-verified { background: rgba(63, 185, 80, 0.15); border-color: rgba(63, 185, 80, 0.4); }
697 .shithub-pill-unverified { background: rgba(187, 128, 9, 0.15); border-color: rgba(187, 128, 9, 0.4); }
698
699 /* ----- notifications (S10) ----- */
700 .shithub-notif-form { display: grid; gap: 0.75rem; max-width: 36rem; }
701 .shithub-notif-row {
702 display: grid;
703 grid-template-columns: max-content 1fr;
704 gap: 0.75rem;
705 padding: 0.75rem 1rem;
706 border: 1px solid var(--border-default);
707 border-radius: 6px;
708 background: var(--canvas-subtle);
709 align-items: start;
710 }
711 .shithub-notif-row.required { background: rgba(56, 139, 253, 0.06); }
712 .shithub-notif-row strong { display: block; font-size: 0.95rem; }
713 .shithub-notif-row small { display: block; color: var(--fg-muted); font-size: 0.85rem; }
714
715 .shithub-session-meta {
716 display: grid;
717 grid-template-columns: max-content 1fr;
718 gap: 0.25rem 1rem;
719 margin: 0;
720 }
721 .shithub-session-meta dt { color: var(--fg-muted); font-weight: 500; }
722 .shithub-session-meta dd { margin: 0; word-break: break-all; }
723
724 /* ----- repo create + empty home (S11) ----- */
725 .shithub-repo-new {
726 max-width: 56rem;
727 margin: 2rem auto;
728 padding: 0 1rem;
729 }
730 .shithub-repo-new h1 {
731 margin: 0 0 0.5rem;
732 font-size: 1.5rem;
733 font-weight: 400;
734 }
735 .shithub-repo-new-lede {
736 margin: 0 0 1.5rem;
737 color: var(--fg-muted);
738 padding-bottom: 1rem;
739 border-bottom: 1px solid var(--border-default);
740 }
741 .shithub-repo-new-form {
742 display: grid;
743 gap: 1.25rem;
744 max-width: 36rem;
745 }
746 .shithub-repo-new-form label { display: grid; gap: 0.25rem; font-weight: 500; font-size: 0.9rem; }
747 .shithub-repo-new-form input[type=text],
748 .shithub-repo-new-form select {
749 font: inherit;
750 padding: 0.5rem 0.75rem;
751 border: 1px solid var(--border-default);
752 border-radius: 6px;
753 background: var(--canvas-subtle);
754 }
755 .shithub-repo-new-form em { color: #cf222e; font-style: normal; }
756 .shithub-repo-new-form small { font-weight: 400; color: var(--fg-muted); font-size: 0.8rem; }
757
758 .shithub-repo-new-visibility, .shithub-repo-new-init {
759 border: none;
760 padding: 0;
761 margin: 0;
762 display: grid;
763 gap: 0.5rem;
764 }
765 .shithub-repo-new-visibility legend, .shithub-repo-new-init legend {
766 padding: 0;
767 font-size: 0.85rem;
768 font-weight: 600;
769 margin-bottom: 0.5rem;
770 }
771 .shithub-repo-new-vis-card,
772 .shithub-repo-new-init-row {
773 display: grid;
774 grid-template-columns: max-content 1fr;
775 gap: 0.75rem;
776 padding: 0.75rem 1rem;
777 border: 1px solid var(--border-default);
778 border-radius: 6px;
779 background: var(--canvas-subtle);
780 }
781 .shithub-repo-new-vis-card.active { border-color: var(--accent-emphasis); }
782 .shithub-repo-new-vis-card strong,
783 .shithub-repo-new-init-row strong { display: block; font-size: 0.95rem; }
784 .shithub-repo-new-vis-card small,
785 .shithub-repo-new-init-row small { display: block; color: var(--fg-muted); font-size: 0.85rem; }
786
787 .shithub-repo-empty {
788 max-width: 56rem;
789 margin: 2rem auto;
790 padding: 0 1rem;
791 }
792 .shithub-repo-empty-head h1 {
793 margin: 0 0 0.5rem;
794 font-size: 1.4rem;
795 font-weight: 400;
796 display: flex;
797 align-items: center;
798 gap: 0.4rem;
799 }
800 .shithub-repo-empty-sep { color: var(--fg-muted); }
801 .shithub-repo-empty-desc {
802 margin: 0 0 1rem;
803 color: var(--fg-muted);
804 }
805 .shithub-pill-private { background: rgba(187, 128, 9, 0.15); border-color: rgba(187, 128, 9, 0.4); }
806 .shithub-repo-empty-quickstart {
807 margin-top: 1rem;
808 padding: 1.25rem;
809 border: 1px solid var(--border-default);
810 border-radius: 8px;
811 background: var(--canvas-subtle);
812 }
813 .shithub-repo-empty-quickstart h2 { margin: 0 0 0.5rem; font-size: 1rem; }
814 .shithub-repo-empty-quickstart h3 { margin: 1.25rem 0 0.5rem; font-size: 0.9rem; font-weight: 600; }
815 .shithub-repo-empty-clone { display: grid; gap: 0.5rem; margin: 0.75rem 0; }
816 .shithub-repo-empty-clone label { display: grid; grid-template-columns: 70px 1fr; gap: 0.5rem; align-items: center; }
817 .shithub-repo-empty-clone span { font-size: 0.8rem; color: var(--fg-muted); font-weight: 600; }
818 .shithub-repo-empty-clone input {
819 font: inherit;
820 font-family: monospace;
821 font-size: 0.85rem;
822 padding: 0.5rem 0.75rem;
823 border: 1px solid var(--border-default);
824 border-radius: 6px;
825 background: var(--canvas-default);
826 }
827 .shithub-repo-empty-quickstart pre {
828 padding: 0.75rem 1rem;
829 border: 1px solid var(--border-default);
830 border-radius: 6px;
831 background: var(--canvas-default);
832 font-size: 0.85rem;
833 overflow-x: auto;
834 }
835
836 /* Populated-repo placeholder (S17 will replace with real tree view) */
837 .shithub-repo-populated {
838 max-width: 56rem;
839 margin: 2rem auto;
840 padding: 0 1rem;
841 }
842 .shithub-repo-populated-head h1 {
843 margin: 0 0 0.5rem;
844 font-size: 1.4rem;
845 font-weight: 400;
846 display: flex;
847 align-items: center;
848 gap: 0.4rem;
849 }
850 .shithub-repo-populated-sep { color: var(--fg-muted); }
851 .shithub-repo-populated-desc { margin: 0 0 1rem; color: var(--fg-muted); }
852 .shithub-repo-headcommit {
853 margin-top: 1rem;
854 padding: 0.85rem 1rem;
855 border: 1px solid var(--border-default);
856 border-radius: 8px;
857 background: var(--canvas-subtle);
858 }
859 .shithub-repo-headcommit-meta {
860 display: flex;
861 flex-wrap: wrap;
862 gap: 0.75rem;
863 font-size: 0.85rem;
864 color: var(--fg-muted);
865 align-items: center;
866 }
867 .shithub-repo-headcommit-branch {
868 font-weight: 600;
869 color: var(--fg-default);
870 padding: 0.1rem 0.5rem;
871 border: 1px solid var(--border-default);
872 border-radius: 999px;
873 background: var(--canvas-default);
874 font-size: 0.75rem;
875 }
876 .shithub-repo-headcommit-oid { font-family: monospace; }
877 .shithub-repo-headcommit-author { color: var(--fg-default); }
878 .shithub-repo-headcommit-subject { margin: 0.5rem 0 0; font-size: 0.95rem; }
879 .shithub-repo-headcommit-other-branch p { margin: 0; font-size: 0.9rem; color: var(--fg-muted); }
880 .shithub-repo-populated-clone {
881 margin-top: 1rem;
882 display: grid;
883 gap: 0.5rem;
884 }
885 .shithub-repo-populated-clone label { display: grid; grid-template-columns: 70px 1fr; gap: 0.5rem; align-items: center; }
886 .shithub-repo-populated-clone span { font-size: 0.8rem; color: var(--fg-muted); font-weight: 600; }
887 .shithub-repo-populated-clone input {
888 font: inherit;
889 font-family: monospace;
890 font-size: 0.85rem;
891 padding: 0.5rem 0.75rem;
892 border: 1px solid var(--border-default);
893 border-radius: 6px;
894 background: var(--canvas-default);
895 }
896 .shithub-repo-populated-note { margin-top: 1rem; font-size: 0.8rem; color: var(--fg-muted); }
897
898 /* ========== Code tab (S17) ========== */
899 /* The repo-page wrapper drives the outer width — every code/blob/list
900 view now gets the same wide container with consistent gutters,
901 matching GitHub's full-width code layout. The inner sections used
902 to set their own max-widths and pinched the layout into a narrow
903 column. */
904 .shithub-repo-page {
905 max-width: 1280px;
906 margin: 1.5rem auto;
907 padding: 0 1.25rem;
908 }
909 .shithub-code, .shithub-blob, .shithub-finder {
910 margin: 0;
911 padding: 0;
912 }
913 /* Code body (tree + blob source) sits in a bordered panel so it
914 reads as a distinct surface — matches the panelled "Code" view in
915 the GitHub reference screenshots. */
916 .shithub-tree, .shithub-blob-source {
917 border: 1px solid var(--border-default);
918 border-radius: 6px;
919 background: var(--canvas-subtle);
920 overflow-x: auto;
921 }
922 .shithub-tree { background: var(--canvas-default); }
923 .shithub-blob-source { background: var(--canvas-default); }
924 .shithub-code-head {
925 display: flex;
926 align-items: center;
927 justify-content: space-between;
928 margin-bottom: 1rem;
929 padding-bottom: 0.5rem;
930 border-bottom: 1px solid var(--border-default);
931 }
932 .shithub-code-crumbs { font-size: 1rem; }
933 .shithub-code-crumbs a { color: var(--fg-default); }
934 .shithub-code-sep { color: var(--fg-muted); margin: 0 0.25rem; }
935 .shithub-code-actions { display: flex; gap: 0.5rem; align-items: center; }
936
937 .shithub-ref-switcher { position: relative; }
938 .shithub-ref-switcher > summary {
939 list-style: none;
940 display: inline-flex;
941 align-items: center;
942 padding: 0.3rem 0.7rem;
943 border: 1px solid var(--border-default);
944 border-radius: 6px;
945 cursor: pointer;
946 font-size: 0.875rem;
947 }
948 .shithub-ref-switcher > summary::-webkit-details-marker { display: none; }
949 .shithub-ref-panel {
950 position: absolute;
951 z-index: 30;
952 top: calc(100% + 0.4rem);
953 left: 0;
954 min-width: 220px;
955 max-height: 360px;
956 overflow-y: auto;
957 background: var(--canvas-default);
958 border: 1px solid var(--border-default);
959 border-radius: 6px;
960 padding: 0.5rem;
961 box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
962 }
963 .shithub-ref-panel a {
964 display: block;
965 padding: 0.3rem 0.4rem;
966 color: var(--fg-default);
967 font-size: 0.875rem;
968 }
969 .shithub-ref-panel strong { display: block; margin: 0.4rem 0 0.2rem; font-size: 0.75rem; color: var(--fg-muted); text-transform: uppercase; }
970
971 .shithub-clone-dropdown { position: relative; }
972 .shithub-clone-dropdown > summary { list-style: none; display: inline-flex; align-items: center; gap: 0.35rem; cursor: pointer; }
973 .shithub-clone-dropdown > summary::-webkit-details-marker { display: none; }
974 .shithub-clone-panel {
975 position: absolute;
976 z-index: 30;
977 top: calc(100% + 0.4rem);
978 right: 0;
979 min-width: 320px;
980 background: var(--canvas-default);
981 border: 1px solid var(--border-default);
982 border-radius: 6px;
983 padding: 0.75rem;
984 box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
985 }
986 .shithub-clone-row + .shithub-clone-row { margin-top: 0.6rem; }
987 .shithub-clone-row label { display: block; font-size: 0.75rem; color: var(--fg-muted); margin-bottom: 0.25rem; }
988 .shithub-clone-input { display: flex; gap: 0.4rem; }
989 .shithub-clone-input input {
990 flex: 1;
991 padding: 0.3rem 0.5rem;
992 font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
993 font-size: 0.8rem;
994 border: 1px solid var(--border-default);
995 border-radius: 4px;
996 background: var(--canvas-subtle);
997 color: var(--fg-default);
998 }
999 .shithub-clone-input button { padding: 0.3rem 0.5rem; }
1000 .shithub-clone-hint { margin: 0.6rem 0 0; font-size: 0.75rem; color: var(--fg-muted); }
1001
1002 /* Profile sub-nav (S30) — Overview / Repositories / Stars tabs. */
1003 .shithub-profile-tabs {
1004 display: flex;
1005 gap: 0.25rem;
1006 margin: 1rem 0 1.25rem;
1007 border-bottom: 1px solid var(--border-default);
1008 }
1009 .shithub-profile-tab {
1010 display: inline-flex;
1011 align-items: center;
1012 gap: 0.4rem;
1013 padding: 0.6rem 0.85rem;
1014 color: var(--fg-default);
1015 border-bottom: 2px solid transparent;
1016 font-size: 0.9rem;
1017 text-decoration: none;
1018 position: relative;
1019 bottom: -1px;
1020 }
1021 .shithub-profile-tab:hover { background: var(--canvas-subtle); border-radius: 6px 6px 0 0; }
1022 .shithub-profile-tab.is-active { border-bottom-color: var(--accent-emphasis, #fd8c73); font-weight: 600; }
1023 .shithub-tab-count {
1024 display: inline-block;
1025 padding: 0.05rem 0.45rem;
1026 border-radius: 999px;
1027 background: var(--canvas-subtle);
1028 border: 1px solid var(--border-default);
1029 font-size: 0.75rem;
1030 color: var(--fg-muted);
1031 }
1032
1033 /* Repositories tab list. */
1034 .shithub-repo-list { list-style: none; padding: 0; margin: 0; }
1035 .shithub-repo-list-row {
1036 padding: 1rem 0;
1037 border-bottom: 1px solid var(--border-default);
1038 }
1039 .shithub-repo-list-name { margin: 0; font-size: 1.1rem; display: flex; gap: 0.4rem; align-items: center; flex-wrap: wrap; }
1040 .shithub-repo-list-name a { color: var(--accent-fg, #4493f8); }
1041 .shithub-repo-list-meta { color: var(--fg-muted); font-size: 0.8rem; display: flex; gap: 1rem; flex-wrap: wrap; margin: 0.4rem 0 0; }
1042 .shithub-pill-archived { background: #ffd35a; color: #3b2300; }
1043
1044 /* Repo subnav (S30 polish): GitHub-style Code / Issues / Pulls / Settings tabs. */
1045 .shithub-repo-page-head {
1046 margin-bottom: 0.25rem;
1047 }
1048 .shithub-repo-page-title { font-size: 1.4rem; margin: 0.5rem 0; display: flex; align-items: center; gap: 0.4rem; flex-wrap: wrap; }
1049 .shithub-repo-page-title a { color: var(--accent-fg, #4493f8); }
1050 .shithub-repo-subnav {
1051 display: flex;
1052 gap: 0.25rem;
1053 margin: 0 0 1.25rem;
1054 border-bottom: 1px solid var(--border-default);
1055 flex-wrap: wrap;
1056 }
1057 .shithub-repo-subnav-tab {
1058 display: inline-flex;
1059 align-items: center;
1060 gap: 0.4rem;
1061 padding: 0.55rem 0.85rem;
1062 color: var(--fg-default);
1063 border-bottom: 2px solid transparent;
1064 font-size: 0.9rem;
1065 text-decoration: none;
1066 position: relative;
1067 bottom: -1px;
1068 }
1069 .shithub-repo-subnav-tab:hover { background: var(--canvas-subtle); border-radius: 6px 6px 0 0; }
1070 .shithub-repo-subnav-tab.is-active { border-bottom-color: var(--accent-emphasis, #fd8c73); font-weight: 600; }
1071
1072 /* New-repo owner picker (S30) */
1073 .shithub-repo-new-owner-row { display: flex; gap: 0.5rem; align-items: end; flex-wrap: wrap; }
1074 .shithub-repo-new-owner select { padding: 0.4rem 0.5rem; }
1075 .shithub-repo-new-sep { font-size: 1.5rem; color: var(--fg-muted); padding-bottom: 0.4rem; }
1076
1077 .shithub-tree {
1078 width: 100%;
1079 border-collapse: collapse;
1080 font-size: 0.9rem;
1081 }
1082 .shithub-tree td {
1083 padding: 0.4rem 0.5rem;
1084 border-bottom: 1px solid var(--border-default);
1085 }
1086 .shithub-tree-icon { width: 24px; color: var(--fg-muted); }
1087 .shithub-tree-icon svg { display: block; }
1088 .shithub-tree-name a { color: var(--fg-default); }
1089 .shithub-tree-size { width: 100px; text-align: right; color: var(--fg-muted); font-variant-numeric: tabular-nums; }
1090 .shithub-tree-symlink, .shithub-tree-submodule { color: var(--fg-muted); font-style: italic; font-size: 0.8rem; }
1091
1092 .shithub-readme {
1093 margin-top: 2rem;
1094 padding: 1.25rem;
1095 border: 1px solid var(--border-default);
1096 border-radius: 6px;
1097 background: var(--canvas-subtle);
1098 }
1099 .shithub-readme h1, .shithub-readme h2 { border-bottom: 1px solid var(--border-default); padding-bottom: 0.3rem; }
1100 .shithub-readme code { font-family: monospace; padding: 0.1em 0.3em; background: var(--canvas-default); border-radius: 3px; }
1101 .shithub-readme pre code { padding: 0; background: none; }
1102 .shithub-readme-plain { white-space: pre-wrap; }
1103
1104 .shithub-blob-meta { color: var(--fg-muted); font-size: 0.85rem; margin-right: 0.5rem; }
1105 /* Blob source: a row-per-line <table>. We render the gutter + code
1106 ourselves and feed Chroma only token spans (no <pre>, no <table>)
1107 so the chrome is consistent across lexers and the no-lexer fallback,
1108 per the S33 viewer refactor. Forgejo / Gitea use the same shape.
1109 The reasoning is robustness: chroma's own table mode has rules we
1110 can't fully override (cell padding, line-number `<a>` styles), and
1111 they leak whenever a lexer changes its emit shape. Owning the table
1112 makes the layout immune to that drift. */
1113 .shithub-blob-source .chroma { padding: 0; background: var(--canvas-default); }
1114 .shithub-blob-source .chroma a { color: inherit; text-decoration: none; }
1115 .shithub-blob-lines {
1116 width: 100%;
1117 border-collapse: collapse;
1118 border-spacing: 0;
1119 margin: 0;
1120 font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
1121 font-size: 0.825rem;
1122 line-height: 20px;
1123 tab-size: 4;
1124 }
1125 /* Gutter cell. width:1% + white-space:nowrap forces shrink-to-fit:
1126 the cell sizes itself to the max line-number width and no wider.
1127 text-align:right keeps the digit flush against the divider. */
1128 .shithub-blob-lines td.shithub-blob-lnum {
1129 width: 1%;
1130 min-width: 2.5rem;
1131 padding: 0 12px;
1132 background: var(--canvas-subtle);
1133 border-right: 1px solid var(--border-default);
1134 color: var(--fg-muted);
1135 text-align: right;
1136 user-select: none;
1137 white-space: nowrap;
1138 vertical-align: top;
1139 }
1140 .shithub-blob-lines td.shithub-blob-lnum a {
1141 color: inherit;
1142 display: block;
1143 }
1144 /* Code cell. white-space:pre preserves indentation; the wrapper
1145 handles horizontal scroll for long lines. */
1146 .shithub-blob-lines td.shithub-blob-lcode {
1147 padding: 0 12px;
1148 vertical-align: top;
1149 white-space: pre;
1150 }
1151 .shithub-blob-lines td.shithub-blob-lcode .shithub-blob-line {
1152 display: inline-block;
1153 min-width: 100%;
1154 }
1155 /* Hover surfaces the row; :target highlights the line referenced by
1156 #L<n> in the URL (browsers handle scrolling). */
1157 .shithub-blob-lines tr:hover td.shithub-blob-lcode {
1158 background: var(--canvas-subtle);
1159 }
1160 .shithub-blob-lines tr:target td.shithub-blob-lcode,
1161 .shithub-blob-lines tr:target td.shithub-blob-lnum {
1162 background: var(--accent-subtle, #fff8c5);
1163 }
1164 .shithub-blob-too-large, .shithub-blob-binary {
1165 padding: 1rem;
1166 border: 1px dashed var(--border-default);
1167 border-radius: 6px;
1168 text-align: center;
1169 color: var(--fg-muted);
1170 }
1171 .shithub-blob-image { text-align: center; padding: 1rem; background: var(--canvas-subtle); border-radius: 6px; }
1172 .shithub-blob-image img { max-width: 100%; max-height: 80vh; }
1173 .shithub-blob-source { overflow-x: auto; }
1174 .shithub-blob-source .chroma { font-size: 0.85rem; }
1175 .shithub-blob-markdown { padding: 1rem; }
1176 .shithub-button-disabled { opacity: 0.5; pointer-events: none; }
1177
1178 .shithub-finder-form { display: flex; gap: 0.5rem; align-items: center; margin: 1rem 0; }
1179 .shithub-finder-form input { font: inherit; padding: 0.4rem 0.6rem; border: 1px solid var(--border-default); border-radius: 6px; flex: 1; }
1180 .shithub-finder-results { list-style: none; padding: 0; }
1181 .shithub-finder-results li { padding: 0.3rem 0.5rem; border-bottom: 1px solid var(--border-default); font-family: monospace; font-size: 0.875rem; }
1182
1183 /* ========== Commits + Commit + Blame (S18) ========== */
1184 .shithub-avatar-sm {
1185 display: inline-block;
1186 width: 20px;
1187 height: 20px;
1188 border-radius: 50%;
1189 vertical-align: middle;
1190 margin-right: 0.4rem;
1191 }
1192 .shithub-identicon {
1193 background: linear-gradient(135deg, #cce, #ecc);
1194 }
1195 .shithub-commits-filter {
1196 display: flex;
1197 gap: 0.5rem;
1198 align-items: end;
1199 flex-wrap: wrap;
1200 margin: 1rem 0;
1201 }
1202 .shithub-commits-filter input {
1203 padding: 0.3rem 0.5rem;
1204 border: 1px solid var(--border-default);
1205 border-radius: 6px;
1206 font: inherit;
1207 }
1208 .shithub-commits-list { list-style: none; padding: 0; margin: 0; }
1209 .shithub-commits-row {
1210 display: grid;
1211 grid-template-columns: 220px 1fr;
1212 gap: 0.75rem;
1213 padding: 0.6rem 0.5rem;
1214 border-bottom: 1px solid var(--border-default);
1215 align-items: start;
1216 }
1217 .shithub-commits-author { color: var(--fg-muted); font-size: 0.875rem; }
1218 .shithub-commits-meta { display: flex; flex-direction: column; gap: 0.2rem; }
1219 .shithub-commits-subject { color: var(--fg-default); font-weight: 500; }
1220 .shithub-commits-sha { color: var(--fg-muted); font-size: 0.8rem; }
1221 .shithub-pager { display: flex; gap: 1rem; padding: 1rem 0; }
1222
1223 .shithub-commit-view { max-width: 64rem; margin: 1.5rem auto; padding: 0 1rem; }
1224 .shithub-commit-meta {
1225 margin-top: 1rem;
1226 padding: 1rem;
1227 border: 1px solid var(--border-default);
1228 border-radius: 6px;
1229 background: var(--canvas-subtle);
1230 }
1231 .shithub-commit-subject { margin: 0 0 0.5rem; font-size: 1.2rem; }
1232 .shithub-commit-body { margin: 0.75rem 0; font-family: monospace; font-size: 0.9rem; line-height: 1.4; }
1233 .shithub-commit-people { display: flex; gap: 1.5rem; flex-wrap: wrap; margin: 0.75rem 0; font-size: 0.875rem; }
1234 .shithub-commit-actor { display: inline-flex; align-items: center; gap: 0.4rem; }
1235 .shithub-commit-role { color: var(--fg-muted); font-weight: 500; }
1236 .shithub-commit-refs { display: grid; grid-template-columns: max-content 1fr; gap: 0.5rem 1rem; font-size: 0.875rem; }
1237 .shithub-commit-refs dt { color: var(--fg-muted); }
1238 .shithub-commit-refs dd { margin: 0; font-family: monospace; }
1239
1240 .shithub-commit-files { margin-top: 1.5rem; }
1241 .shithub-commit-files-table { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
1242 .shithub-commit-files-table th, .shithub-commit-files-table td {
1243 padding: 0.4rem 0.6rem;
1244 border-bottom: 1px solid var(--border-default);
1245 text-align: left;
1246 }
1247 .shithub-num-col { width: 80px; text-align: right; font-variant-numeric: tabular-nums; }
1248 .shithub-add { color: #22863a; }
1249 .shithub-del { color: #cb2431; }
1250 .shithub-status-A { color: #22863a; font-weight: 600; }
1251 .shithub-status-M { color: #b08800; font-weight: 600; }
1252 .shithub-status-D { color: #cb2431; font-weight: 600; }
1253 .shithub-status-R { color: #6f42c1; font-weight: 600; }
1254 .shithub-status-C { color: #0366d6; font-weight: 600; }
1255
1256 .shithub-blame-table { width: 100%; border-collapse: collapse; font-family: monospace; font-size: 0.85rem; }
1257 .shithub-blame-chunk-header td {
1258 padding: 0.4rem 0.6rem;
1259 background: var(--canvas-subtle);
1260 border-top: 1px solid var(--border-default);
1261 font-family: var(--shithub-font-default, sans-serif);
1262 font-size: 0.8rem;
1263 color: var(--fg-muted);
1264 display: flex;
1265 gap: 0.4rem;
1266 align-items: center;
1267 }
1268 .shithub-blame-lineno { width: 50px; text-align: right; padding-right: 0.5rem; color: var(--fg-muted); }
1269 .shithub-blame-lineno a { color: inherit; }
1270 .shithub-blame-content pre { margin: 0; white-space: pre; }
1271 .shithub-blame-too-large {
1272 padding: 1rem;
1273 border: 1px dashed var(--border-default);
1274 border-radius: 6px;
1275 text-align: center;
1276 color: var(--fg-muted);
1277 }
1278
1279 /* ========== Diff renderer (S19) ========== */
1280 .shithub-commit-files-head {
1281 display: flex;
1282 align-items: center;
1283 justify-content: space-between;
1284 margin-bottom: 0.5rem;
1285 }
1286 .shithub-diff-toggles { display: flex; gap: 0.25rem; }
1287 .shithub-diff-body { margin-top: 1rem; }
1288 .shithub-diff-file {
1289 margin-top: 1rem;
1290 border: 1px solid var(--border-default);
1291 border-radius: 6px;
1292 overflow: hidden;
1293 }
1294 .shithub-diff-file-head {
1295 display: flex;
1296 align-items: center;
1297 justify-content: space-between;
1298 gap: 0.75rem;
1299 padding: 0.5rem 0.75rem;
1300 background: var(--canvas-subtle);
1301 border-bottom: 1px solid var(--border-default);
1302 font-size: 0.875rem;
1303 }
1304 .shithub-diff-file-action { color: var(--fg-muted); font-style: italic; }
1305 .shithub-diff-binary, .shithub-diff-image, .shithub-diff-empty, .shithub-diff-truncated {
1306 padding: 1rem;
1307 text-align: center;
1308 color: var(--fg-muted);
1309 }
1310 .shithub-diff-file-toolarge { padding: 0.5rem 0.75rem; }
1311 .shithub-diff-file-toolarge > summary { cursor: pointer; color: var(--fg-muted); }
1312 .shithub-diff-table {
1313 width: 100%;
1314 border-collapse: collapse;
1315 font-family: monospace;
1316 font-size: 0.85rem;
1317 table-layout: fixed;
1318 }
1319 .shithub-diff-table td { padding: 0 0.5rem; vertical-align: top; }
1320 .shithub-diff-table pre { margin: 0; white-space: pre; }
1321 .shithub-diff-lineno {
1322 width: 50px;
1323 text-align: right;
1324 color: var(--fg-muted);
1325 user-select: none;
1326 background: var(--canvas-subtle);
1327 }
1328 .shithub-diff-content { width: auto; }
1329 .shithub-diff-add { background: rgba(46, 160, 67, 0.10); }
1330 .shithub-diff-del { background: rgba(248, 81, 73, 0.10); }
1331 .shithub-diff-add .shithub-diff-content { background: rgba(46, 160, 67, 0.05); }
1332 .shithub-diff-del .shithub-diff-content { background: rgba(248, 81, 73, 0.05); }
1333 .shithub-diff-pad { background: var(--canvas-subtle); }
1334 .shithub-diff-hunk-head td {
1335 padding: 0.4rem 0.75rem;
1336 background: var(--canvas-default);
1337 border-top: 1px solid var(--border-default);
1338 border-bottom: 1px solid var(--border-default);
1339 color: var(--fg-muted);
1340 }
1341 .shithub-diff-split td.shithub-diff-content {
1342 width: 50%;
1343 border-left: 1px solid var(--border-default);
1344 }
1345
1346 /* ========== Branches/Tags/Compare/Settings (S20) ========== */
1347 .shithub-branches, .shithub-tags, .shithub-compare, .shithub-settings-branches {
1348 max-width: 64rem;
1349 margin: 1.5rem auto;
1350 padding: 0 1rem;
1351 }
1352 .shithub-branches-filter { display: flex; gap: 0.4rem; }
1353 .shithub-branches-table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
1354 .shithub-branches-table th, .shithub-branches-table td {
1355 padding: 0.5rem 0.75rem;
1356 text-align: left;
1357 border-bottom: 1px solid var(--border-default);
1358 }
1359 .shithub-branches-subject { color: var(--fg-default); }
1360 .shithub-compare-summary { padding: 0.75rem 1rem; background: var(--canvas-subtle); border-radius: 6px; display: flex; gap: 1rem; align-items: center; flex-wrap: wrap; }
1361 .shithub-compare-empty { padding: 1.5rem; text-align: center; color: var(--fg-muted); border: 1px dashed var(--border-default); border-radius: 6px; }
1362 .shithub-compare-commits { margin-top: 1.5rem; }
1363 .shithub-settings-branches form label { display: block; margin: 0.5rem 0; }
1364 .shithub-settings-branches form input[type=text],
1365 .shithub-settings-branches form select { font: inherit; padding: 0.4rem 0.6rem; border: 1px solid var(--border-default); border-radius: 6px; min-width: 280px; }
1366
1367 /* ========== Issues / Labels / Milestones (S21) ========== */
1368 .shithub-issues, .shithub-issue-view, .shithub-issue-new, .shithub-labels, .shithub-milestones {
1369 max-width: 64rem;
1370 margin: 1.5rem auto;
1371 padding: 0 1rem;
1372 }
1373 .shithub-issues-head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; }
1374 .shithub-issues-actions { display: flex; gap: 0.4rem; }
1375 .shithub-issues-filter { display: flex; gap: 1.5rem; padding: 0.75rem 0; border-bottom: 1px solid var(--border-default); margin: 1rem 0; }
1376 .shithub-issues-tab { color: var(--fg-muted); padding: 0.25rem 0; border-bottom: 2px solid transparent; }
1377 .shithub-issues-tab-active { color: var(--fg-default); border-bottom-color: var(--accent-emphasis, #0969da); font-weight: 600; }
1378 .shithub-issues-dot { display: inline-block; width: 0.6rem; height: 0.6rem; border-radius: 50%; vertical-align: middle; margin-right: 0.25rem; }
1379 .shithub-issues-dot-open { background: #1a7f37; }
1380 .shithub-issues-dot-closed { background: #8250df; }
1381 .shithub-issues-list { list-style: none; padding: 0; margin: 0; }
1382 .shithub-issues-row {
1383 display: flex; gap: 0.75rem; align-items: flex-start;
1384 padding: 0.75rem 0.5rem;
1385 border-bottom: 1px solid var(--border-default);
1386 }
1387 .shithub-issues-state { font-size: 1.1rem; line-height: 1.2; }
1388 .shithub-issues-state-open { color: #1a7f37; }
1389 .shithub-issues-state-closed { color: #8250df; }
1390 .shithub-issues-body { flex: 1; }
1391 .shithub-issues-title { font-weight: 600; color: var(--fg-default); }
1392 .shithub-issues-title:hover { color: var(--accent-emphasis, #0969da); }
1393 .shithub-issues-meta { color: var(--fg-muted); font-size: 0.85rem; margin-top: 0.2rem; }
1394 .shithub-issues-assignees { font-size: 0.85rem; }
1395 .shithub-issues-empty { color: var(--fg-muted); padding: 2rem; text-align: center; border: 1px dashed var(--border-default); border-radius: 6px; }
1396 .shithub-issue-num { color: var(--fg-muted); font-weight: 400; margin-left: 0.5rem; }
1397 .shithub-issue-title-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; border-bottom: 1px solid var(--border-default); padding-bottom: 0.75rem; }
1398 .shithub-issue-title { display: flex; gap: 0.5rem; align-items: baseline; flex-wrap: wrap; margin: 0; }
1399 .shithub-issue-head-actions { display: flex; gap: 0.5rem; flex: 0 0 auto; }
1400 .shithub-issue-meta { color: var(--fg-muted); margin: 0.75rem 0 1.5rem; display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
1401 .shithub-issue-meta .shithub-pill, .shithub-comment-form .shithub-button, .shithub-sidebar-button { display: inline-flex; align-items: center; justify-content: center; gap: 0.25rem; }
1402 .shithub-issue-grid { display: grid; grid-template-columns: minmax(0, 1fr) 18rem; gap: 1.5rem; }
1403 @media (max-width: 900px) { .shithub-issue-grid { grid-template-columns: 1fr; } }
1404 .shithub-comment {
1405 border: 1px solid var(--border-default);
1406 border-radius: 6px;
1407 margin-bottom: 1rem;
1408 background: var(--canvas-default);
1409 }
1410 .shithub-comment-head {
1411 padding: 0.5rem 0.75rem;
1412 background: var(--canvas-subtle);
1413 border-bottom: 1px solid var(--border-default);
1414 font-size: 0.9rem;
1415 color: var(--fg-muted);
1416 }
1417 .shithub-comment-body { padding: 0.75rem; }
1418 .shithub-event {
1419 color: var(--fg-muted);
1420 font-size: 0.85rem;
1421 display: flex;
1422 align-items: center;
1423 gap: 0.5rem;
1424 padding: 0.55rem 0;
1425 margin: 0 0 1rem 1.2rem;
1426 position: relative;
1427 }
1428 .shithub-event::before {
1429 content: "";
1430 position: absolute;
1431 top: -1rem;
1432 bottom: -1rem;
1433 left: 0.6rem;
1434 border-left: 2px solid var(--border-default);
1435 z-index: 0;
1436 }
1437 .shithub-event-icon {
1438 width: 1.3rem;
1439 height: 1.3rem;
1440 border: 1px solid var(--border-default);
1441 border-radius: 50%;
1442 background: var(--canvas-default);
1443 color: var(--fg-muted);
1444 display: inline-flex;
1445 align-items: center;
1446 justify-content: center;
1447 position: relative;
1448 z-index: 1;
1449 flex: 0 0 auto;
1450 }
1451 .shithub-event-icon svg { width: 0.8rem; height: 0.8rem; }
1452 .shithub-event-linked .shithub-event-icon { color: var(--fg-muted); }
1453 .shithub-event a { font-weight: 600; }
1454 .shithub-comment-form { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 1rem; }
1455 .shithub-comment-form textarea, .shithub-issue-form textarea, .shithub-issue-form input[type=text] {
1456 font: inherit; padding: 0.5rem; border: 1px solid var(--border-default); border-radius: 6px; width: 100%;
1457 resize: vertical;
1458 }
1459 .shithub-issue-form { display: flex; flex-direction: column; gap: 1rem; max-width: 48rem; }
1460 .shithub-form-row { display: flex; flex-direction: column; gap: 0.25rem; }
1461 .shithub-form-row span { font-weight: 600; font-size: 0.9rem; }
1462 .shithub-form-actions { display: flex; gap: 0.5rem; justify-content: flex-end; }
1463 .shithub-form-actions-start { justify-content: flex-start; }
1464 .shithub-issue-sidebar section { padding: 0.75rem 0; border-bottom: 1px solid var(--border-default); position: relative; }
1465 .shithub-sidebar-heading { display: flex; justify-content: space-between; gap: 0.75rem; align-items: center; margin-bottom: 0.5rem; }
1466 .shithub-issue-sidebar h3 { font-size: 0.85rem; color: var(--fg-muted); margin: 0; }
1467 .shithub-sidebar-icon, .shithub-sidebar-editor > summary {
1468 color: var(--fg-muted);
1469 display: inline-flex;
1470 align-items: center;
1471 justify-content: center;
1472 width: 1.25rem;
1473 height: 1.25rem;
1474 cursor: pointer;
1475 }
1476 .shithub-sidebar-editor > summary { list-style: none; }
1477 .shithub-sidebar-editor > summary::-webkit-details-marker { display: none; }
1478 .shithub-popover {
1479 position: absolute;
1480 right: 0;
1481 top: 2rem;
1482 z-index: 20;
1483 min-width: 17rem;
1484 display: flex;
1485 flex-direction: column;
1486 gap: 0.55rem;
1487 padding: 0.75rem;
1488 background: var(--canvas-default);
1489 border: 1px solid var(--border-default);
1490 border-radius: 8px;
1491 box-shadow: 0 8px 24px rgba(140, 149, 159, 0.2);
1492 }
1493 .shithub-popover input[type=text], .shithub-popover select {
1494 font: inherit;
1495 width: 100%;
1496 padding: 0.45rem 0.5rem;
1497 border: 1px solid var(--border-default);
1498 border-radius: 6px;
1499 background: var(--canvas-default);
1500 color: var(--fg-default);
1501 }
1502 .shithub-inline-form { display: inline; }
1503 .shithub-link-button {
1504 border: 0;
1505 padding: 0;
1506 background: transparent;
1507 color: var(--accent-emphasis, #0969da);
1508 font: inherit;
1509 cursor: pointer;
1510 display: inline-flex;
1511 gap: 0.35rem;
1512 align-items: center;
1513 }
1514 .shithub-sidebar-button { width: 100%; }
1515 .shithub-participant { display: inline-block; margin: 0 0.35rem 0.35rem 0; }
1516 .shithub-issue-actions form { margin: 0.25rem 0; }
1517 .shithub-issue-signedout { color: var(--fg-muted); padding: 1rem; text-align: center; border: 1px dashed var(--border-default); border-radius: 6px; }
1518 .shithub-label {
1519 display: inline-block;
1520 font-size: 0.75rem;
1521 padding: 0.1rem 0.5rem;
1522 border-radius: 1rem;
1523 color: #1f2328;
1524 font-weight: 500;
1525 margin: 0 0.15rem;
1526 }
1527 .shithub-label-pick { display: flex; gap: 0.4rem; align-items: center; padding: 0.2rem 0; }
1528 .shithub-assignee-form { display: flex; gap: 0.25rem; flex-wrap: wrap; margin-top: 0.5rem; }
1529 .shithub-assignee-form input[type=text] { padding: 0.3rem 0.5rem; border: 1px solid var(--border-default); border-radius: 6px; }
1530 .shithub-labels-list, .shithub-milestones-list { list-style: none; padding: 0; }
1531 .shithub-labels-row, .shithub-milestones-row {
1532 padding: 0.75rem 0;
1533 border-bottom: 1px solid var(--border-default);
1534 display: flex; gap: 0.75rem; align-items: center; flex-wrap: wrap;
1535 }
1536 .shithub-label-form, .shithub-milestone-form { display: flex; flex-wrap: wrap; gap: 0.4rem; padding: 0.5rem 0; }
1537 .shithub-label-form input, .shithub-milestone-form input, .shithub-milestone-form textarea {
1538 padding: 0.4rem 0.6rem; border: 1px solid var(--border-default); border-radius: 6px; font: inherit;
1539 }
1540 .shithub-button-danger { color: #cf222e; }
1541 .shithub-error { padding: 0.75rem; background: #ffebe9; border: 1px solid #ffcecb; border-radius: 6px; color: #82061e; margin-bottom: 1rem; }
1542 .shithub-muted { color: var(--fg-muted); }
1543
1544 /* ========== Pull Requests (S22) ========== */
1545 .shithub-pulls, .shithub-pull-view {
1546 max-width: 64rem;
1547 margin: 1.5rem auto;
1548 padding: 0 1rem;
1549 }
1550 .shithub-pull-head { margin-bottom: 0.75rem; }
1551 .shithub-pull-merged { background: #8250df22; color: #8250df; }
1552 .shithub-pull-tabs {
1553 display: flex; gap: 1.5rem;
1554 border-bottom: 1px solid var(--border-default);
1555 margin: 0.75rem 0 1rem;
1556 }
1557 .shithub-pull-tab {
1558 color: var(--fg-muted);
1559 padding: 0.4rem 0;
1560 border-bottom: 2px solid transparent;
1561 }
1562 .shithub-pull-tab-active {
1563 color: var(--fg-default);
1564 border-bottom-color: var(--accent-emphasis, #0969da);
1565 font-weight: 600;
1566 }
1567 .shithub-pull-grid { display: grid; grid-template-columns: 1fr 16rem; gap: 1.5rem; }
1568 @media (max-width: 768px) { .shithub-pull-grid { grid-template-columns: 1fr; } }
1569 .shithub-pull-merge { padding: 0.75rem; border: 1px solid var(--border-default); border-radius: 6px; }
1570 .shithub-pull-merge h3 { font-size: 0.85rem; text-transform: uppercase; color: var(--fg-muted); margin: 0 0 0.5rem; }
1571 .shithub-pull-state-clean { color: #1a7f37; font-weight: 600; }
1572 .shithub-pull-state-dirty { color: #cf222e; font-weight: 600; }
1573 .shithub-pull-state-behind { color: #9a6700; }
1574 .shithub-pull-state-unknown { color: var(--fg-muted); }
1575 .shithub-pull-merge-form { display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 0.5rem; }
1576 .shithub-pull-merge-form select { padding: 0.4rem; border: 1px solid var(--border-default); border-radius: 6px; font: inherit; }
1577 .shithub-pull-state-form { margin-top: 0.5rem; }
1578 .shithub-pull-refs { display: flex; gap: 0.4rem; align-items: flex-end; }
1579 .shithub-pull-refs label { flex: 1; }
1580 .shithub-pull-arrow { font-size: 1.4rem; padding: 0 0.4rem; align-self: center; }
1581 .shithub-pull-commits { list-style: none; padding: 0; }
1582 .shithub-pull-commits li {
1583 padding: 0.4rem 0; border-bottom: 1px solid var(--border-default);
1584 display: flex; gap: 0.6rem; align-items: baseline;
1585 }
1586
1587 /* ========== PR Reviews (S23) ========== */
1588 .shithub-pull-reviews, .shithub-pull-reviewers {
1589 border-top: 1px solid var(--border-default);
1590 padding: 0.6rem 0;
1591 }
1592 .shithub-pull-reviews h3, .shithub-pull-reviewers h3 {
1593 font-size: 0.85rem; text-transform: uppercase; color: var(--fg-muted); margin: 0 0 0.4rem;
1594 }
1595 .shithub-pull-reviews-list, .shithub-pull-reviewers-list {
1596 list-style: none; padding: 0; margin: 0; font-size: 0.9rem;
1597 }
1598 .shithub-pull-reviews-list li { padding: 0.2rem 0; display: flex; gap: 0.35rem; flex-wrap: wrap; align-items: baseline; }
1599 .shithub-pull-review-state { font-weight: 600; }
1600 .shithub-pull-review-approve .shithub-pull-review-state { color: #1a7f37; }
1601 .shithub-pull-review-request_changes .shithub-pull-review-state { color: #cf222e; }
1602 .shithub-pull-review-comment .shithub-pull-review-state { color: var(--fg-muted); }
1603 .shithub-pull-review-dismissed { opacity: 0.5; text-decoration: line-through; }
1604 .shithub-pull-request-reviewer summary, .shithub-pull-submit-review summary {
1605 margin: 0.5rem 0 0.25rem;
1606 }
1607 .shithub-pull-review-form { display: flex; flex-direction: column; gap: 0.4rem; padding: 0.4rem 0; }
1608 .shithub-pull-review-form textarea, .shithub-pull-review-form select {
1609 padding: 0.4rem; border: 1px solid var(--border-default); border-radius: 6px; font: inherit;
1610 }
1611 .shithub-pull-threads { margin-top: 1.5rem; padding: 0.75rem; border: 1px solid var(--border-default); border-radius: 6px; }
1612 .shithub-pull-thread-file { padding: 0.4rem 0; border-bottom: 1px solid var(--border-default); }
1613 .shithub-pull-thread-file:last-child { border-bottom: none; }
1614 .shithub-pull-thread-file summary { cursor: pointer; font-weight: 600; }
1615 .shithub-pull-thread { padding: 0.5rem; border-left: 3px solid var(--border-default); margin: 0.5rem 0; }
1616 .shithub-pull-thread-outdated { opacity: 0.6; border-left-color: #9a6700; }
1617 .shithub-pull-thread-resolved { opacity: 0.7; border-left-color: #1a7f37; }
1618 .shithub-pull-thread-actions { display: flex; gap: 0.3rem; margin-top: 0.4rem; flex-wrap: wrap; }
1619 .shithub-pull-thread-actions textarea, .shithub-pull-thread-actions input[type=text] {
1620 padding: 0.3rem; border: 1px solid var(--border-default); border-radius: 6px; font: inherit;
1621 }
1622 .shithub-pull-add-comment summary { margin-top: 0.5rem; }
1623 .shithub-pull-add-comment form { display: flex; flex-direction: column; gap: 0.3rem; padding: 0.4rem 0; }
1624 .shithub-pull-add-comment input, .shithub-pull-add-comment textarea {
1625 padding: 0.3rem 0.5rem; border: 1px solid var(--border-default); border-radius: 6px; font: inherit;
1626 }
1627
1628 /* ========== PR Checks tab (S24) ========== */
1629 .shithub-pull-checks { display: flex; flex-direction: column; gap: 0.75rem; padding: 0.5rem 0; }
1630 .shithub-pull-check-suite {
1631 border: 1px solid var(--border-default);
1632 border-radius: 6px;
1633 padding: 0.75rem;
1634 }
1635 .shithub-pull-check-suite h3 {
1636 display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap;
1637 font-size: 1rem; margin: 0 0 0.5rem;
1638 }
1639 .shithub-pull-check-app { font-family: var(--mono, monospace); font-size: 0.85rem; color: var(--fg-muted); }
1640 .shithub-pull-check-suite-status { font-size: 0.8rem; padding: 0.05rem 0.4rem; border-radius: 999px; background: var(--canvas-subtle); }
1641 .shithub-pull-check-runs { list-style: none; padding: 0; margin: 0; }
1642 .shithub-pull-check-run {
1643 display: flex; gap: 0.5rem; align-items: baseline;
1644 padding: 0.3rem 0; border-bottom: 1px solid var(--border-default);
1645 flex-wrap: wrap;
1646 }
1647 .shithub-pull-check-run:last-child { border-bottom: none; }
1648 .shithub-pull-check-status-completed { color: #1a7f37; }
1649 .shithub-pull-check-status-in_progress { color: #9a6700; }
1650 .shithub-pull-check-status-queued { color: var(--fg-muted); }
1651 .shithub-pull-check-status-pending { color: var(--fg-muted); }
1652 .shithub-pull-check-conclusion {
1653 font-size: 0.75rem; padding: 0.05rem 0.4rem; border-radius: 999px;
1654 text-transform: lowercase;
1655 }
1656 .shithub-pull-check-conclusion-success { background: #1a7f3722; color: #1a7f37; }
1657 .shithub-pull-check-conclusion-failure { background: #cf222e22; color: #cf222e; }
1658 .shithub-pull-check-conclusion-neutral { background: #d0d7de44; color: var(--fg-muted); }
1659 .shithub-pull-check-conclusion-cancelled,
1660 .shithub-pull-check-conclusion-skipped,
1661 .shithub-pull-check-conclusion-stale { color: var(--fg-muted); background: var(--canvas-subtle); }
1662 .shithub-pull-check-conclusion-timed_out { background: #9a670022; color: #9a6700; }
1663 .shithub-pull-check-conclusion-action_required { background: #cf222e22; color: #cf222e; font-weight: 600; }
1664
1665 /* S26 — stars / watchers list pages */
1666 .shithub-social { padding: 1rem 0; }
1667 .shithub-social-list { list-style: none; padding: 0; margin: 1rem 0; }
1668 .shithub-social-list li {
1669 display: flex; gap: 0.6rem; align-items: baseline;
1670 padding: 0.5rem 0; border-bottom: 1px solid var(--border-default);
1671 }
1672 .shithub-social-list li:last-child { border-bottom: none; }
1673 .shithub-social-list small { color: var(--fg-muted); }
1674 .shithub-meta { color: var(--fg-muted); margin: 0.25rem 0 1rem; }
1675 .shithub-empty { color: var(--fg-muted); padding: 1rem; }
1676 .shithub-pagination {
1677 display: flex; gap: 0.5rem; padding: 1rem 0;
1678 }
1679
1680 /* S28 — search */
1681 .shithub-nav-search {
1682 flex: 1;
1683 display: flex;
1684 max-width: 32rem;
1685 margin: 0 1rem;
1686 }
1687 .shithub-nav-search input {
1688 width: 100%;
1689 padding: 0.4rem 0.7rem;
1690 border: 1px solid var(--border-default);
1691 border-radius: 6px;
1692 background: var(--canvas-subtle);
1693 color: var(--fg-default);
1694 font-size: 0.85rem;
1695 }
1696 .shithub-search { padding: 1rem 0; }
1697 .shithub-search-head { padding-bottom: 0.5rem; border-bottom: 1px solid var(--border-default); margin-bottom: 1rem; }
1698 .shithub-search-form { display: flex; gap: 0.5rem; margin: 0.5rem 0; }
1699 .shithub-search-form input[type=text] { flex: 1; padding: 0.5rem 0.7rem; }
1700 .shithub-search-tabs { display: flex; gap: 0.5rem; margin: 0.5rem 0; }
1701 .shithub-search-list { list-style: none; padding: 0; margin: 0.5rem 0; }
1702 .shithub-search-list li {
1703 display: flex; gap: 0.5rem; align-items: baseline;
1704 flex-wrap: wrap;
1705 padding: 0.5rem 0;
1706 border-bottom: 1px solid var(--border-default);
1707 }
1708 .shithub-search-list li:last-child { border-bottom: none; }
1709 .shithub-search-list small { color: var(--fg-muted); }
1710 .shithub-quick-dropdown { padding: 0.5rem; }
1711 .shithub-quick-section { padding: 0.25rem 0; border-bottom: 1px solid var(--border-default); }
1712 .shithub-quick-section:last-of-type { border-bottom: none; }
1713 .shithub-quick-section h3 { font-size: 0.7rem; text-transform: uppercase; color: var(--fg-muted); margin: 0.25rem 0; }
1714 .shithub-quick-section ul { list-style: none; padding: 0; margin: 0; }
1715 .shithub-quick-section li { padding: 0.25rem 0; }
1716 .shithub-quick-footer { padding: 0.5rem 0; border-top: 1px solid var(--border-default); text-align: center; }
1717
1718 /* S34 — admin impersonation banner. Sticky-top, loud red so the
1719 admin can't lose track of "I am viewing as someone else right
1720 now." Position: fixed-on-scroll keeps it visible no matter where
1721 on the page they navigate. */
1722 .shithub-imp-banner {
1723 position: sticky;
1724 top: 0;
1725 z-index: 100;
1726 background: var(--danger-fg);
1727 color: #ffffff;
1728 padding: 0.5rem 1rem;
1729 text-align: center;
1730 font-size: 0.875rem;
1731 }
1732 .shithub-imp-banner .shithub-button {
1733 background: rgba(0, 0, 0, 0.25);
1734 color: #ffffff;
1735 border: 1px solid rgba(255, 255, 255, 0.4);
1736 }
1737 .shithub-imp-write { background: #ffd33d; color: #1a1f24; padding: 0 0.4em; border-radius: 4px; font-weight: 600; }
1738 .shithub-imp-read { background: rgba(255, 255, 255, 0.2); padding: 0 0.4em; border-radius: 4px; }