[CI] pgitBot
·
2026-02-26
main.css
CSS
1pre {
2 border: 1px solid var(--border);
3 padding: var(--grid-height);
4}
5
6body {
7 max-width: 900px;
8}
9
10.border-b {
11 border-bottom: 1px solid var(--border);
12}
13
14.border-b:last-child {
15 border-bottom: 0;
16}
17
18.box {
19 margin: 1rem 0;
20 padding: var(--grid-height);
21 border: 1px solid var(--border);
22}
23
24.tree-size {
25 width: 60px;
26 text-align: right;
27}
28
29.tree-path {
30 text-wrap: wrap;
31}
32
33.diff-file {
34 align-items: center;
35 height: 62px;
36 position: sticky;
37 top: 0;
38 left: 0;
39 background-color: var(--bg-color);
40}
41
42.white-space-bs {
43 white-space: break-spaces;
44}
45
46.mb-0 {
47 margin-bottom: 0;
48}
49
50.md {
51 line-height: 1.6;
52}
53
54.md h1, .md h2, .md h3 {
55 margin-top: 1.5em;
56 margin-bottom: 0.5em;
57 border-bottom: 1px solid var(--border);
58 padding-bottom: 0.3em;
59}
60
61.md a {
62 text-decoration: underline;
63}
64
65.md code {
66 background-color: var(--pre);
67}
68
69.md pre > code {
70 background-color: inherit;
71}
72
73.md blockquote {
74 border-left: 4px solid var(--border);
75 padding-left: 1em;
76 color: var(--grey-light);
77 margin-left: 0;
78}
79
80.md table {
81 border-collapse: collapse;
82 width: 100%;
83 margin: 1em 0;
84}
85
86.md th, .md td {
87 border: 1px solid var(--border);
88 padding: 8px;
89}
90
91.md th {
92 background-color: var(--pre);
93}
94
95.language {
96 float: right;
97 font-style: italic;
98 color: var(--grey-light);
99 margin-top: -1.5rem;
100 margin-bottom: 1rem;
101}
102
103.language-stats {
104 margin-top: 2rem;
105}
106
107.language-bar {
108 display: flex;
109 height: 10px;
110 border-radius: 5px;
111 overflow: hidden;
112 margin-bottom: 1rem;
113 border: 1px solid var(--border);
114}
115
116.language-segment {
117 height: 100%;
118 transition: width 0.3s ease-in-out;
119}
120
121.language-legend {
122 list-style: none;
123 padding: 0;
124 margin: 0;
125 display: flex;
126 flex-wrap: wrap;
127 gap: 1rem;
128}
129
130.language-legend li {
131 display: flex;
132 align-items: center;
133}
134
135.legend-color {
136 display: inline-block;
137 width: 12px;
138 height: 12px;
139 border-radius: 50%;
140 margin-right: 0.5rem;
141}
142
143.legend-name {
144 font-weight: bold;
145}
146
147.legend-percentage {
148 margin-left: 0.5rem;
149 color: var(--grey-light);
150}
151
152#search-form {
153 display: flex;
154 width: 250px;
155}
156
157#search-input {
158 width: 100%;
159 padding: 8px;
160 border: 1px solid var(--border);
161 background-color: var(--bg-color);
162 color: var(--text-color);
163 border-radius: 4px 0 0 4px;
164 border-right: none;
165}
166
167#search-button {
168 background: var(--bg-color);
169 border: 1px solid var(--border);
170 color: var(--text-color);
171 padding: 0 12px;
172 cursor: pointer;
173 border-radius: 0 4px 4px 0;
174}
175
176#search-results-container ul {
177 list-style: none;
178 padding: 0;
179}
180.search-result-item {
181 padding: 8px 0;
182 border-bottom: 1px solid var(--border);
183 display: flex;
184 justify-content: space-between;
185}
186.search-result-item a {
187 text-decoration: none;
188}
189.search-result-item a:hover {
190 text-decoration: underline;
191}
192.search-result-item span {
193 color: var(--grey-light);
194 font-size: 0.9em;
195}
196.search-result-item mark {
197 background-color: var(--hover);
198 color: var(--bg-color);
199 padding: 2px;
200 border-radius: 2px;
201}
202
203
204@media only screen and (max-width: 900px) {
205 .tree-commit {
206 display: none;
207 }
208}
209
210@media only screen and (max-width: 600px) {
211 #search-form {
212 width: 100%;
213 margin-top: 1rem;
214 }
215 header .flex.justify-between {
216 flex-direction: column;
217 align-items: flex-start;
218 }
219}
220
221/* Issue Tracker Styles */
222.issue-container {
223 padding: 0 1rem 1rem 1rem;
224}
225
226/* This removes the padding from the box on the issues list page to fix the layout gap. */
227.box:has(.issues-list-header) {
228 padding: 0;
229}
230
231.issue-header {
232 border-bottom: 1px solid var(--border);
233 padding-bottom: 1rem;
234 margin-bottom: 1.5rem;
235}
236
237.issue-header h1 {
238 margin-top: 0;
239}
240
241.issue-meta {
242 display: flex;
243 align-items: center;
244 justify-content: space-between;
245 flex-wrap: wrap;
246 gap: 1rem;
247 margin-top: 0.5rem;
248}
249
250.issue-meta-actions {
251 display: flex;
252 align-items: center;
253 gap: 1rem;
254}
255
256.issue-meta address {
257 font-style: normal;
258}
259
260.issue-list-item {
261 padding: var(--grid-height);
262 border-bottom: 1px solid var(--border);
263}
264.issue-list-item:last-child {
265 border-bottom: none;
266}
267
268.issue-status {
269 padding: 4px 8px;
270 border-radius: 2em;
271 font-size: 0.9em;
272 font-weight: bold;
273 display: inline-flex;
274 align-items: center;
275 gap: 4px;
276}
277
278.issue-status .icon {
279 width: 16px;
280 height: 16px;
281}
282
283.issue-status-open, .issue-status-in-progress {
284 color: #3fb950;
285 border: 1px solid #3fb950;
286}
287.issue-status-open .icon, .issue-status-in-progress .icon {
288 fill: #3fb950;
289 stroke: #3fb950;
290}
291
292.issue-status-resolved, .issue-status-closed, .issue-status-not-planned, .issue-status-duplicate {
293 color: #a371f7;
294 border: 1px solid #a371f7;
295}
296.issue-status-resolved .icon, .issue-status-closed .icon, .issue-status-not-planned .icon, .issue-status-duplicate .icon {
297 fill: #a371f7;
298 stroke: #a371f7;
299}
300
301.timeline {
302 display: flex;
303 flex-direction: column;
304 gap: 1.5rem;
305}
306
307.timeline-item {
308 position: relative;
309}
310
311.comment-box {
312 border: 1px solid var(--border);
313 border-radius: 6px;
314 overflow: hidden;
315}
316
317.comment-box footer {
318 margin-bottom: 0.1rem;
319}
320
321.comment-header, .issues-list-header {
322 margin: 0;
323 background-color: var(--pre);
324 padding: 0.4rem 0.8rem;
325 border-bottom: 1px solid var(--border);
326 display: flex;
327 justify-content: space-between;
328 align-items: center;
329 font-size: 0.8em;
330 color: var(--grey-light);
331}
332
333.comment-header address {
334 font-style: normal;
335}
336
337.comment-actions {
338 display: flex;
339 align-items: center;
340 gap: 0.5rem;
341}
342
343.comment-actions .action-btn {
344 background: none;
345 border: none;
346 color: var(--grey-light);
347 cursor: pointer;
348 padding: 2px 6px;
349 font-size: 1.2em;
350 border-radius: 4px;
351}
352.comment-actions .action-btn:hover {
353 background-color: var(--grey);
354 color: var(--text-color);
355}
356
357.comment-body {
358 padding: 1rem;
359}
360
361.comment-edit-controls {
362 padding: 0.5rem 1rem;
363 border-top: 1px solid var(--border);
364 display: flex;
365 justify-content: flex-end;
366 gap: 0.5rem;
367 background-color: var(--pre);
368}
369
370.comment-history {
371 font-size: 0.9em;
372 padding: 0 1rem 0.5rem;
373 border-top: 1px solid var(--border);
374}
375.comment-history summary {
376 cursor: pointer;
377 padding: 0.5rem 0;
378 color: var(--grey-light);
379}
380.comment-history ul {
381 list-style: none;
382 padding-left: 0;
383 margin: 0;
384}
385.comment-history li {
386 padding: 0.5rem 0;
387 border-top: 1px dashed var(--border);
388}
389.comment-history time {
390 display: block;
391 color: var(--grey-light);
392 margin-bottom: 0.5rem;
393}
394.comment-history pre {
395 margin: 0;
396 padding: 0.5rem;
397 font-size: 0.9em;
398}
399
400
401.comment-reactions {
402 padding: 0.5rem 1rem;
403 display: flex;
404 gap: 0.5rem;
405 flex-wrap: wrap;
406 border-top: 1px solid var(--border);
407}
408
409.reaction-badge {
410 display: inline-flex;
411 align-items: center;
412 gap: 4px;
413 background-color: var(--bg-color);
414 border: 1px solid var(--border);
415 border-radius: 1em;
416 padding: 2px 8px;
417 font-size: 0.9em;
418 cursor: pointer;
419}
420.reaction-badge:hover {
421 border-color: var(--link-color);
422}
423.reaction-badge .count {
424 font-weight: bold;
425 color: var(--text-color);
426}
427
428#composer-container {
429 padding: 1rem;
430}
431
432#reply-textarea, .comment-editor {
433 width: 100%;
434 min-height: 100px;
435 padding: var(--grid-height);
436 background-color: var(--bg-color);
437 color: var(--text-color);
438 border: 1px solid var(--border);
439 border-radius: 4px;
440 resize: vertical;
441}
442
443.comment-editor {
444 border-radius: 0;
445 border: none;
446 border-top: 1px solid var(--border);
447 min-height: 120px;
448}
449.comment-editor:focus {
450 outline: none;
451}
452
453
454.btn {
455 border: 1px solid var(--border);
456 background-color: var(--pre);
457 color: var(--text-color);
458 padding: 8px 16px;
459 font-weight: bold;
460 display: inline-block;
461 text-decoration: none;
462 border-radius: 6px;
463 cursor: pointer;
464}
465.btn:hover {
466 border-color: var(--grey-light);
467 text-decoration: none;
468}
469.btn-secondary {
470 background-color: var(--bg-color);
471 border: 1px solid var(--border);
472 font-weight: normal;
473}
474.btn-secondary:hover {
475 border: 1px solid var(--grey-light);
476}
477
478
479/* Modal Styles */
480.modal {
481 display: none;
482 position: fixed;
483 z-index: 1000;
484 left: 0;
485 top: 0;
486 width: 100%;
487 height: 100%;
488 overflow: auto;
489 background-color: rgba(0,0,0,0.5);
490}
491
492.modal-content {
493 background-color: var(--bg-color);
494 margin: 15% auto;
495 padding: var(--line-height);
496 border: 1px solid var(--border);
497 width: 80%;
498 max-width: 500px;
499 border-radius: 6px;
500 position: relative;
501}
502
503.modal-content input[type="text"],
504.modal-content textarea {
505 width: 100%;
506 padding: 8px;
507 background-color: var(--bg-color);
508 color: var(--text-color);
509 border: 1px solid var(--border);
510 border-radius: 4px;
511 margin-bottom: var(--grid-height);
512}
513
514.modal-content textarea {
515 min-height: 150px;
516 resize: vertical;
517}
518
519.modal-content .flex.justify-end {
520 gap: 0.5rem;
521}
522
523.close-btn {
524 color: var(--grey-light);
525 position: absolute;
526 top: 10px;
527 right: 20px;
528 font-size: 28px;
529 font-weight: bold;
530 cursor: pointer;
531}
532.close-btn:hover, .close-btn:focus {
533 color: var(--text-color);
534}
535#alias-input {
536 width: 100%;
537 padding: 8px;
538 background-color: var(--bg-color);
539 color: var(--text-color);
540 border: 1px solid var(--border);
541}
542
543#reaction-picker {
544 background-color: var(--bg-color);
545 border: 1px solid var(--border);
546 border-radius: 6px;
547 padding: 4px;
548 box-shadow: 0 4px 12px rgba(0,0,0,0.15);
549 z-index: 10;
550}
551.reaction-picker-emoji {
552 background: none;
553 border: none;
554 font-size: 1.5em;
555 padding: 4px;
556 border-radius: 4px;
557 cursor: pointer;
558}
559.reaction-picker-emoji:hover {
560 background-color: var(--pre);
561}
562
563#issue-filter-input {
564 padding: 8px 12px;
565 border: 1px solid var(--border);
566 background-color: var(--bg-color);
567 color: var(--text-color);
568 border-radius: 6px;
569 min-width: 300px;
570}
571
572.issues-list-header {
573 background-color: var(--pre);
574 padding: 8px 12px;
575}
576.issues-list-header strong {
577 font-weight: bold;
578}
579
580.dropdown {
581 position: relative;
582 display: inline-block;
583}
584
585.dropdown-menu {
586 display: none;
587 position: absolute;
588 right: 0;
589 background-color: var(--bg-color);
590 border: 1px solid var(--border);
591 border-radius: 6px;
592 box-shadow: 0 4px 12px rgba(0,0,0,0.15);
593 z-index: 100;
594 min-width: 160px;
595 padding: 4px 0;
596}
597
598.dropdown-item {
599 display: block;
600 width: 100%;
601 padding: 8px 12px;
602 color: var(--text-color);
603 text-decoration: none;
604 background: none;
605 border: none;
606 text-align: left;
607}
608.dropdown-item:hover {
609 background-color: var(--pre);
610 text-decoration: none;
611}