1d7b7647f31fd6c950b4649f4b650c8161d0e05e
[software/mumi.git] / assets / css / screen.css
1 html, body {
2 background-color: #fff;
3 width: 100%;
4 padding: 0px;
5 margin: 0px;
6 }
7
8 body {
9 height: auto;
10 }
11
12 h1 {
13 clear: both;
14 margin-top: 1.3rem;
15 margin-bottom: 0.5rem;
16 }
17
18 .title {
19 clear: both;
20 font-size: 16px;
21 margin-bottom: 1rem;
22 border-bottom: 1px dashed #ddd;
23 padding: 0px;
24 padding-bottom: 1rem;
25 color: #586069;
26 }
27
28 .comment-box {
29 margin-top: 1rem;
30 margin-bottom: 2rem;
31 border-top: 1px dashed #ddd;
32 padding-top: 1rem;
33 }
34
35 h2 {
36 border-bottom: 1px solid #eee;
37 padding-bottom: 5px;
38 }
39
40 ul.merged li, ul.blockedby li, ul.blocks li {
41 display: inline-block;
42 }
43 ul.merged li + li:before,
44 ul.blockedby li + li:before,
45 ul.blocks li + li:before {
46 content: ", ";
47 }
48
49 p + p {
50 text-indent: 0.5rem;
51 margin-top: 1.0rem;
52 }
53
54 .card-body form {
55 padding-bottom: 1em;
56 }
57
58 tr.heading th {
59 background-color: #f8f9fa;
60 font-weight: bold;
61 }
62
63 tr td:nth-child(1),
64 tr td:nth-child(4) {
65 width: 4rem;
66 }
67
68 tr td:nth-child(3){
69 width: 19rem;
70 }
71
72 tr.serious svg {
73 fill: #ff5a2a;
74 margin-right: .5em;
75 height: 1.2em;
76 vertical-align: text-bottom;
77 }
78 tr.important svg {
79 fill: #000;
80 margin-right: .5em;
81 height: 1.2em;
82 vertical-align: text-bottom;
83 }
84
85 nav {
86 background: #333333;
87 border-color: #1A1A1A1A;
88 border-style: none none solid none;
89 border-width: thin;
90 width: 100%;
91 margin-bottom: 1rem;
92 padding: .5em;
93 color: #fff;
94 border-radius: 0;
95 }
96
97 nav span.navbar-text {
98 display: flex;
99 flex-grow: 1;
100 }
101
102 @media (max-width: 576px) {
103 nav span.navbar-text {
104 display: none;
105 }
106 }
107
108 @media (min-width: 576px) {
109 #search input:focus {
110 width: 400px;
111 }
112 #search #search-hints {
113 width: 400px;
114 }
115 }
116
117 @media (min-width: 768px) {
118 #search input:focus {
119 width: 500px;
120 }
121 #search.form-inline #search-hints {
122 width: 500px;
123 }
124 }
125
126 #search #search-hints {
127 display: none;
128 position: absolute;
129 background: white;
130 top: 2.5rem;
131 border: 1px solid #ced4da;
132 border-top: none;
133 box-shadow: 3px 3px 10px #ddd;
134 padding: 1em;
135 z-index: 2;
136 }
137 #search.form-inline:focus-within #search-hints {
138 display: block;
139 }
140 #search { z-index: 3; }
141
142 footer {
143 border-color: #1A1A1A1A;
144 border-style: dashed none none none;
145 border-width: 2px;
146 width: 100%;
147 align-items: center;
148 text-align: center;
149 margin-top: 3rem;
150 padding: 1rem;
151 color: #586069;
152 background: #fafafa;
153 }
154
155 table {
156 width: 100%;
157 }
158
159 /* messages */
160 .row.event {
161 margin-bottom: 1em;
162 font-size: 1.2em;
163 }
164
165 .info .stat {
166 display: inline-grid;
167 color: #586069;
168 margin-right: 1em;
169 }
170 .info .stat .label {
171 display: block;
172 }
173
174 .conversation .avatar {
175 display: none;
176 }
177
178 .message .from .avatar {
179 width: 1.2em;
180 height: 1.2em;
181 border-radius: 3px;
182 color: #fff;
183 display: inline-flex;
184 justify-content: center;
185 align-items: center;
186 margin-right: 3px;
187 }
188
189 @media (min-width: 768px) {
190 .conversation .avatar {
191 height: 48px;
192 width: 48px;
193 border: 1px solid #ddd;
194 border-radius: 6px;
195 color: #fff;
196 display: flex;
197 justify-content: center;
198 align-items: center;
199 font-size: 32px;
200 position: absolute;
201 }
202 }
203
204 .address + .address:before {
205 content: ", ";
206 }
207
208 @media (min-width: 768px) {
209 .message {
210 margin-left: 65px;
211 }
212 }
213
214 @media (max-width: 768px) {
215 h1 {
216 font-size: 2rem;
217 }
218 }
219
220 details {
221 margin-top: .5em;
222 }
223
224 .message .body pre {
225 background: transparent;
226 border: none;
227 }
228
229 .message .body .multipart {
230 padding-bottom: 1rem;
231 }
232
233 .message .body .multipart + .multipart {
234 padding-top: 1rem;
235 padding-bottom: 1rem;
236 border-top: 1px dashed #ddd;
237 }
238
239 .multipart.application-pgp-signature {
240 display: none;
241 }
242
243 .multipart.text-x-patch {
244 }
245
246 .multipart.scheme {
247 white-space: pre-wrap;
248 font-family: monospace;
249 }
250
251 .attachment:before {
252 background-image: url('/img/file.svg');
253 background-size: 1rem;
254 display: inline-block;
255 height: 1rem;
256 width: 1rem;
257 content: "";
258 }
259
260 .download-part {
261 float: right;
262 font-size: 0.8em;
263 font-style: italic;
264 }
265
266 @media (min-width: 768px) {
267 .message .card-header:before {
268 content: "";
269 border-color: transparent;
270 border-right-color: #ddd;
271 border-style: solid solid outset;
272 border-width: 10px;
273 height: 0;
274 width: 0;
275 margin-left: -40px;
276 top: calc(1rem - 1px);
277 position: absolute;
278 }
279 .message .card:before {
280 content: "";
281 border-color: transparent;
282 border-right-color: #f8f9fa;
283 border-style: solid solid outset;
284 border-width: 9px;
285 height: 0;
286 width: 0;
287 left: -18px;
288 top: 1rem;
289 position: absolute;
290 z-index: 10;
291 }
292 .message .from .avatar {
293 display: none;
294 }
295 }
296
297 .message .from .address {
298 font-weight: bold;
299 }
300
301 .message .details {
302 margin-top: .5em;
303 display: none;
304 }
305
306 .message span.line {
307 white-space: pre-wrap;
308 font-family: monospace;
309 }
310
311 /* diff styles */
312 .message span.line.diff.file {
313 color: #005cc5;
314 }
315 .message span.line.diff.separator {
316 color: #005cc5;
317 }
318 .message span.line.diff.addition {
319 color: #22863a;
320 background-color: #f0fff4;
321 }
322 .message span.line.diff.deletion {
323 color: #b31d28;
324 background-color: #ffeef0;
325 }
326 .message span.line.diff.range {
327 color: #6f42c1;
328 font-weight: bold;
329 }
330
331 /* commit styles */
332 .message span.commit {
333 font-family: monospace;
334 }
335 .message span.commit.attribution {
336 color: #005cc5;
337 }
338 .message span.commit.header {
339 color: #005cc5;
340 }
341 .message span.commit.changelog {
342 color: #005cc5;
343 }
344
345 /* quote styles */
346 .message span.line.quote {
347 color: #3868cc;
348 }
349
350 .message span.line.cut-here {
351 color: #888;
352 }
353
354 .filter {
355 display: inline-block;
356 color: #fff;
357 background: #aaa;
358 text-align: center;
359 padding: 2px;
360 border-radius: 3px;
361 font-family: monospace;
362 margin: 1px;
363 }
364
365 .status-tag {
366 display: inline-block;
367 color: #fff;
368 text-align: center;
369 padding: 4px;
370 border-radius: 3px;
371 margin-right: 8px;
372 }
373
374 .status-tag.done {
375 background: #cb2431;
376 }
377 .status-tag.open {
378 background: #2cbe4e;
379 }
380
381 .error.parse {
382 font-style: italic;
383 font-size: 0.8em;
384 }
385
386 .message .body.card-body {
387 padding: .8rem;
388 }