mercurial-template
2f78b9100113
style-hg.css

Find changesets by keywords by author, files, the commit message, revision number or hash, or revset expression.

Software / code / mercurial-template

Comparison

style-hg.css @ 0:2f78b9100113 draft

Init.
author Trần H. Trung <xmpp:trần.h.trung@trung.fun>
date Mon, 10 Jul 2023 23:41:04 +0700
child 11:168c2affd4ab
comparison
equal deleted inserted replaced
-1:000000000000 0:2f78b9100113
1 body {
2 margin: 0;
3 padding: 0;
4 background: var(--color_background);
5 color: var(--color_foreground);
6 font-family: sans-serif;
7 }
8
9 .container {
10 padding-left: 115px;
11 }
12
13 /*
14 .main {
15 top: 20rem;
16 }
17
18 #.main {
19 width: 98%;
20 }
21 */
22
23 .overflow {
24 width: 100%;
25 overflow: auto;
26 }
27
28 /*.main>main { margin-left: 5rem !important; }*/
29
30 .menu {
31 margin-left: auto;
32 /*margin-right: 5rem;*/
33 margin-bottom: auto;
34 text-align: right;
35 padding: 2rem;
36 background: transparent;
37 transition: background 0.5s ease-in-out;
38 position: sticky;
39 top: 17.4rem;
40 flex-shrink: 12;
41 }
42 .menu:hover { background: var(--color_background_main); }
43 .dd-hover.menu { position: sticky; }
44
45 @media (min-width: 960px) { body>.logo { display: none; } }
46 @media not (min-width: 960px) {
47 .menu { padding: 0.5rem; }
48 .menu>.logo { display: none; }
49 .menu>.dd-content { display: block !important; width: 0.25rem; }
50 body>.logo { display: block; }
51 main { margin-left: 1rem !important; }
52 }
53
54 .menu ul {
55 list-style: none;
56 padding: 0;
57 margin: 10px 0 0 0;
58 border-right: 2px solid #999;
59 }
60
61 .menu li {
62 margin-bottom: 3px;
63 padding: 2px 4px;
64 background: var(--color_background);
65 color: var(--color_foreground);
66 font-weight: normal;
67 }
68
69 .menu li.active {
70 font-weight: bold;
71 }
72
73 .menu img {
74 border: 0;
75 }
76
77 div.atom-logo {
78 margin-top: 10px;
79 }
80
81 .atom-logo img, .rss-logo img {
82 width: 14px;
83 height: 14px;
84 border: 0;
85 }
86 img.atom-logo { filter: invert(100%); -webkit-filter: invert(100%); }
87
88 .menu a { color: var(--color_foreground); display: block; }
89
90 .search { text-align: center; }
91
92 form.search div#hint {
93 display: block;
94 position: relative;
95 margin: auto;
96 width: 72%;
97 padding: 1.4rem;
98 background: var(--color_background_border);
99 text-align: center;
100 border: 1px solid var(--color_heading_main);
101 border-radius: 5px;
102 z-index: 15;
103 }
104
105 a { text-decoration:none; }
106 .age { white-space:nowrap; }
107 .date { white-space:nowrap; }
108 .indexlinks { white-space:nowrap; }
109 .parity0,
110 .stripes4 > :nth-child(4n+1),
111 .stripes2 > :nth-child(2n+1) { background-color: var(--color_odd); }
112 .parity1,
113 .stripes4 > :nth-child(4n+3),
114 .stripes2 > :nth-child(2n+2) { background-color: var(--color_even); }
115 .plusline { color: green; }
116 .minusline { color: #dc143c; } /* crimson */
117 .atline { color: var(--color_heading_sub); }
118
119 .diffstat-table {
120 margin-top: 1em;
121 }
122 .diffstat-file {
123 white-space: nowrap;
124 font-size: 90%;
125 }
126 .diffstat-total {
127 white-space: nowrap;
128 font-size: 90%;
129 }
130 .diffstat-graph {
131 width: 100%;
132 }
133 .diffstat-add {
134 background-color: green;
135 float: left;
136 }
137 .diffstat-remove {
138 background-color: red;
139 float: left;
140 }
141
142 .navigate {
143 text-align: right;
144 margin: 1em 0;
145 }
146
147 .phase {
148 color: #999;
149 font-size: 70%;
150 border-bottom: 1px dotted #999;
151 font-weight: normal;
152 margin-left: .5em;
153 vertical-align: baseline;
154 }
155
156 .obsolete {
157 color: #999;
158 font-size: 70%;
159 border-bottom: 1px dashed #999;
160 font-weight: normal;
161 margin-left: .5em;
162 vertical-align: baseline;
163 }
164
165 .instability {
166 color: var(--color_foreground);
167 font-size: 70%;
168 border-bottom: 1px solid #000;
169 font-weight: normal;
170 margin-left: .5em;
171 vertical-align: baseline;
172 }
173
174 .tag {
175 color: #999;
176 font-size: 70%;
177 font-weight: normal;
178 margin-left: .5em;
179 vertical-align: baseline;
180 }
181
182 .branchhead {
183 color: var(--color_foreground);
184 font-size: 80%;
185 font-weight: normal;
186 margin-left: .5em;
187 vertical-align: baseline;
188 }
189
190 ul#graphnodes .branchhead {
191 font-size: 75%;
192 }
193
194 .branchname {
195 color: var(--color_foreground);
196 font-size: 60%;
197 font-weight: normal;
198 margin-left: .5em;
199 vertical-align: baseline;
200 }
201
202 /* Common */
203 pre { font-family: 'FreeMono'; font-weight: bold; }
204 /*
205 pre { margin: 0; }
206
207 h2 { font-size: 120%; border-bottom: 1px solid #999; }
208 h2 a { color: var(--color_foreground); }
209 h3 {
210 margin-top: +.7em;
211 font-size: 100%;
212 }
213 */
214
215 /* log and tags tables */
216 .bigtable {
217 border-bottom: 1px solid #999;
218 border-collapse: collapse;
219 font-size: 90%;
220 width: 100%;
221 font-weight: normal;
222 text-align: left;
223 }
224
225 .bigtable td {
226 padding: 1px 4px;
227 vertical-align: top;
228 }
229
230 .bigtable th {
231 padding: 1px 4px;
232 border-bottom: 1px solid #999;
233 }
234 .bigtable tr { border: none; }
235 tr { background-color: var(--color_background_border); }
236 .bigtable .age { width: 7em; }
237 .bigtable .author { width: 15em; }
238 .bigtable .description { }
239 .bigtable .description .base { font-size: 70%; float: right; line-height: 1.66; }
240 .bigtable .node { width: 5em; font-family: monospace;}
241 .bigtable .permissions { width: 8em; text-align: left;}
242 .bigtable .size { width: 5em; text-align: right; }
243 .bigtable .annotate { text-align: right; }
244 .bigtable td.annotate { font-size: smaller; }
245 .bigtable td.source { font-size: inherit; }
246 tr.thisrev a { color:#999999; text-decoration: none; }
247 tr.thisrev td.source { color:#009900; }
248 td.annotate {
249 white-space: nowrap;
250 }
251 div.annotate-info {
252 z-index: 5;
253 display: none;
254 position: absolute;
255 background-color: var(--color_background);
256 border: 1px solid #999;
257 text-align: left;
258 color: var(--color_foreground);
259 padding: 5px;
260 }
261 div.annotate-info a { color: var(--color_heading_main); }
262 td.annotate:hover div.annotate-info { display: inline; }
263
264 #diffopts-form {
265 font-size: smaller;
266 color: var(--color_foreground);
267 padding-bottom: 10px;
268 display: none;
269 }
270
271 .source, .sourcefirst {
272 font-family: monospace;
273 white-space: pre;
274 padding: 1px 4px;
275 font-size: 90%;
276 }
277 .sourcefirst {
278 border-bottom: 1px solid #999;
279 font-weight: bold;
280 }
281 .source a { color: #999; font-size: smaller; font-family: monospace;}
282
283 .sourcelines {
284 position: relative;
285 counter-reset: lineno;
286 }
287
288 .wrap > span {
289 white-space: pre-wrap;
290 }
291
292 .linewraptoggle {
293 float: right;
294 }
295
296 .diffblocks {
297 counter-reset: lineno;
298 }
299 .diffblocks > div {
300 font-family: 'FreeMono' !important;
301 counter-increment: lineno;
302 border: 1px solid #888;
303 border-radius: 0.3125rem;
304 margin-top: 0.5rem;
305 }
306
307 .sourcelines > span {
308 display: inline-block;
309 box-sizing: border-box;
310 width: 100%;
311 padding: 1px 0px 1px 5em;
312 counter-increment: lineno;
313 }
314
315 .sourcelines > span:before {
316 -moz-user-select: -moz-none;
317 -khtml-user-select: none;
318 -webkit-user-select: none;
319 -ms-user-select: none;
320 user-select: none;
321 display: inline-block;
322 margin-left: -6em;
323 width: 4em;
324 font-size: smaller;
325 /*color: #999;*/
326 text-align: right;
327 content: counters(lineno, ".");
328 float: left;
329 }
330
331 .sourcelines > span:after {
332 content: '';
333 display: inline-block;
334 }
335
336 .sourcelines > span:target, tr:target td {
337 background-color: #bfdfff;
338 }
339
340 /* Followlines */
341 tbody.sourcelines > tr.followlines-selected,
342 pre.sourcelines > span.followlines-selected {
343 background-color: #99C7E9;
344 }
345
346 div#followlines {
347 background-color: var(--color_background);
348 border: 1px solid #999;
349 padding: 5px;
350 position: fixed;
351 }
352
353 div.followlines-cancel {
354 text-align: right;
355 }
356
357 div.followlines-cancel > button {
358 line-height: 80%;
359 padding: 0;
360 border: 0;
361 border-radius: 2px;
362 background-color: inherit;
363 font-weight: bold;
364 }
365
366 div.followlines-cancel > button:hover {
367 color: var(--color_background);
368 background-color: #cc241d;
369 }
370
371 div.followlines-link {
372 margin: 2px;
373 margin-top: 4px;
374 font-family: sans-serif;
375 }
376
377 .btn-followlines {
378 position: absolute;
379 display: none;
380 cursor: pointer;
381 box-sizing: content-box;
382 font-size: 12px;
383 width: 13px;
384 height: 13px;
385 border-radius: 3px;
386 margin: 0px;
387 margin-top: -2px;
388 padding: 0px;
389 background-color: #E5FDE5;
390 border: 1px solid #9BC19B;
391 font-family: monospace;
392 text-align: center;
393 line-height: 5px;
394 }
395
396 span.followlines-select .btn-followlines {
397 margin-left: -1.5em;
398 }
399
400 .btn-followlines:hover {
401 transform: scale(1.2, 1.2);
402 }
403
404 .btn-followlines .followlines-plus {
405 color: #98971a;
406 }
407
408 .btn-followlines .followlines-minus {
409 color: #cc241d;
410 }
411
412 .btn-followlines-end {
413 background-color: #ffdcdc;
414 }
415
416 .sourcelines tr:hover .btn-followlines,
417 .sourcelines span.followlines-select:hover > .btn-followlines {
418 display: inline;
419 }
420
421 .btn-followlines-hidden,
422 .sourcelines tr:hover .btn-followlines-hidden {
423 display: none;
424 }
425
426 .sourcelines > a {
427 display: inline-block;
428 position: absolute;
429 left: 0px;
430 width: 4em;
431 height: 1em;
432 }
433
434 .fileline { font-family: monospace; }
435 .fileline img { border: 0; }
436
437 .tagEntry .closed { color: var(--color_heading_sub); }
438
439 /* Changeset entry */
440 #changesetEntry {
441 border-collapse: collapse;
442 width: 100%;
443 margin-bottom: 1em;
444 }
445
446 #changesetEntry th {
447 padding: 1px 4px;
448 width: 4em;
449 text-align: right;
450 font-weight: normal;
451 vertical-align: top;
452 }
453
454 div.description {
455 border-left: 2px solid #999;
456 margin: 1em 0 1em 0;
457 padding: .3em;
458 white-space: pre;
459 font-family: monospace;
460 }
461
462 /* Graph */
463 div#wrapper {
464 position: relative;
465 border-top: 1px solid black;
466 border-bottom: 1px solid black;
467 margin: 0;
468 padding: 0;
469 }
470
471 canvas {
472 position: absolute;
473 z-index: 5;
474 top: -0.7em;
475 margin: 0;
476 }
477
478 ul#graphnodes {
479 list-style: none inside none;
480 padding: 0;
481 margin: 0;
482 }
483
484 ul#graphnodes li {
485 height: 39px;
486 overflow: visible;
487 }
488
489 ul#graphnodes li .fg {
490 position: absolute;
491 z-index: 10;
492 }
493
494 ul#graphnodes li .info {
495 font-size: 70%;
496 }
497
498 /* Comparison */
499 .legend {
500 padding: 1.5% 0 1.5% 0;
501 }
502
503 .legendinfo {
504 border: 1px solid #999;
505 font-size: 80%;
506 text-align: center;
507 padding: 0.5%;
508 }
509
510 .equal { background-color: var(--color_background_main); }
511
512 .delete {
513 background-color: var(--color_alert);
514 color: var(--color_background);
515 font-weight: bold;
516 }
517
518 .insert {
519 background-color: var(--color_links);
520 color: var(--color_background);
521 font-weight: bold;
522 }
523
524 .replace {
525 background-color: var(--color_heading_main);
526 color: var(--color_background);
527 font-weight: bold;
528 }
529
530 .header {
531 text-align: center;
532 }
533
534 .block {
535 border-top: 1px solid #999;
536 }
537
538 .breadcrumb { color: gray; }
539
540 .scroll-loading {
541 -webkit-animation: change_color 1s linear 0s infinite alternate;
542 -moz-animation: change_color 1s linear 0s infinite alternate;
543 -o-animation: change_color 1s linear 0s infinite alternate;
544 animation: change_color 1s linear 0s infinite alternate;
545 }
546
547 @-webkit-keyframes change_color {
548 from { background-color: #A0CEFF; } to { }
549 }
550 @-moz-keyframes change_color {
551 from { background-color: #A0CEFF; } to { }
552 }
553 @-o-keyframes change_color {
554 from { background-color: #A0CEFF; } to { }
555 }
556 @keyframes change_color {
557 from { background-color: #A0CEFF; } to { }
558 }
559
560 .scroll-loading-error {
561 background-color: #FFCCCC !important;
562 }
563
564 /* Fix main css */
565 img {
566 filter: none;
567 }
568 .main>main {
569 width: auto !important;
570 max-width: 100% !important;
571 margin-top: 2rem !important;
572 }