1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
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
|
/*
* cgit's own stylesheet does the work; this is the rest. The forge's pages
* wrap themselves in div#cgit and use cgit's markup, so both kinds of page are
* the same page. Nothing here may carry meaning of its own: every page still
* has to work with all of it missing.
*/
/* Readability. cgit's 10pt suits a dense table; prose wants more. */
div#cgit { color: #222; }
div#cgit .dim { color: #666; }
div#cgit article { font-size: 11pt; line-height: 1.5; max-width: 46em; }
/* A row of alternating shade, which is what makes a long list scannable. */
div#cgit table.list tr:nth-child(even) { background: #f6f6f6; }
div#cgit table.list tr.nohover { background: #fff; }
/* cgit sizes the header cell and not the image in it, so a large upload drags
* the header, and the page under it, out to its own width. Both axes, or a
* tall one pushes the page down instead. */
div#cgit table#header td.logo img { max-width: 96px; max-height: 96px; }
/* Forms. cgit only styles the two in its own header. */
div#cgit label { display: block; color: #666; margin-bottom: 0.2em; }
div#cgit label.inline, div#cgit label.choice { display: inline-block; color: #222; }
div#cgit label.choice { display: block; margin: 0.3em 0; }
div#cgit label.inline { margin-right: 1em; }
div#cgit fieldset { border: solid 1px #ccc; margin: 1em 0; padding: 0.5em 1em; }
div#cgit legend { color: #666; padding: 0 0.3em; }
div#cgit form p { margin: 0.9em 0; }
div#cgit input, div#cgit textarea, div#cgit select, div#cgit button {
font: inherit;
color: #222;
border: solid 1px #bbb;
padding: 0.3em;
}
div#cgit input[type=checkbox], div#cgit input[type=radio] { width: auto; }
/* cgit's own header and tab controls size themselves, and the forge's must not
* stretch them across the row. */
div#cgit table#header td.form input, div#cgit table#header td.form select,
div#cgit table.tabs td.form input, div#cgit table.tabs td.form select {
width: auto;
max-width: none;
font-size: 90%;
}
/* A control inside a list row sizes itself, or it stretches the column. */
div#cgit table.list td input { width: auto; }
div#cgit input, div#cgit textarea { width: 100%; max-width: 34em; }
div#cgit textarea { max-width: none; min-height: 12em; font-family: monospace; }
div#cgit button { background: #eee; padding: 0.3em 1em; cursor: pointer; }
div#cgit button:hover { background: #ddd; }
/* Sign out is a form because it changes something. Inline, or the button lands
* on its own line away from the name it belongs to. */
div#cgit table#header td.form form { display: inline; }
div#cgit table#header td.form a { padding: 0 0.2em; }
div#cgit button.link {
background: none;
border: none;
padding: 0;
color: blue;
cursor: pointer;
}
div#cgit button.link:hover { text-decoration: underline; }
/* A row of controls that belong together. */
div#cgit .bar {
display: flex;
flex-wrap: wrap;
gap: 1em;
align-items: center;
margin: 1em 0;
padding: 0.5em 0;
border-top: solid 1px #eee;
border-bottom: solid 1px #eee;
}
div#cgit .bar form { display: flex; gap: 0.5em; align-items: center; margin: 0; }
div#cgit .bar input { width: auto; }
div#cgit .bar span { display: flex; gap: 0.8em; }
/* One person's say in a thread. */
div#cgit .comment { border: solid 1px #ddd; margin: 1em 0; }
div#cgit .comment .byline { background: #f6f6f6; border-bottom: solid 1px #ddd; padding: 0.3em 0.6em; }
div#cgit .comment article { margin: 0; padding: 0.2em 0.8em 0.8em 0.8em; }
div#cgit img.avatar { vertical-align: middle; border: solid 1px #ccc; }
div#cgit .label {
background: #eee;
border: solid 1px #ccc;
padding: 0 0.4em;
margin-right: 0.3em;
font-size: 90%;
}
div#cgit .state-open { color: #007700; font-weight: bold; }
div#cgit .state-closed { color: #770000; font-weight: bold; }
div#cgit .notice { color: #007700; font-weight: bold; margin: 1em 0; }
/* Markdown, so that a comment reads as one. */
div#cgit article h1, div#cgit article h2, div#cgit article h3 { font-size: 120%; margin: 1em 0 0.4em 0; }
div#cgit article p, div#cgit article ul, div#cgit article ol { margin: 0.6em 0; }
div#cgit article code { background: #f0f0f0; padding: 0 0.2em; font-size: 95%; }
div#cgit article pre { background: #f6f6f6; border: solid 1px #e0e0e0; padding: 0.6em; overflow-x: auto; }
div#cgit article pre code { background: none; padding: 0; }
div#cgit article blockquote { border-left: solid 3px #ccc; margin: 0.6em 0; padding-left: 0.8em; color: #555; }
/* What cannot be undone is marked, so that it is never a slip. */
div#cgit .danger {
border: solid 1px #770000;
border-left-width: 4px;
background: #fff6f6;
padding: 0.5em 1em;
margin: 2em 0;
}
div#cgit .danger h2, div#cgit .danger h3, div#cgit .danger h4 { color: #770000; }
div#cgit .danger button { background: #ffdddd; border-color: #770000; }
/* highlight's classes, which cgit's stylesheet has nothing to say about. */
.hl.com, .hl.slc { color: #767676; font-style: italic; }
.hl.sng, .hl.str { color: #a11; }
.hl.num, .hl.esc { color: #7a5600; }
.hl.ppc, .hl.pps, .hl.ipl { color: #616100; }
.hl.kwa { color: #000; font-weight: bold; }
.hl.kwb { color: #0057ae; }
.hl.kwc { color: #000; }
.hl.kwd, .hl.kwe, .hl.kwf { color: #010181; }
.hl.lin { color: #555; }
.hl.err, .hl.erm { color: #c00; font-weight: bold; }
|