|
1
|
/* Overall page style; vi: filetype=css |
|
2
|
*/ |
|
3
|
|
|
4
|
body { |
|
5
|
margin: 0 auto; |
|
6
|
background-color: white; |
|
7
|
font-family: sans-serif; |
|
8
|
} |
|
9
|
|
|
10
|
a { |
|
11
|
/* Unvisited links are a lightness-adjusted version of this skin's |
|
12
|
* header blue, balancing contrast between the body text and the |
|
13
|
* background in order to meet the goals specified by the WCAG 2 |
|
14
|
* accessbility standard, earning us an "AA" grade according to |
|
15
|
* the calculator result here: |
|
16
|
* |
|
17
|
* https://webaim.org/resources/linkcontrastchecker/?fcolor=2E2E2E&bcolor=FFFFFF&lcolor=3779BF |
|
18
|
* |
|
19
|
* It is for this same reason that our not-quite-black body text |
|
20
|
* color is the shade of dark gray that it is. It can't be any |
|
21
|
* lighter and still allow us to meet both targets. */ |
|
22
|
color: #3779BF; |
|
23
|
text-decoration: none; |
|
24
|
} |
|
25
|
a:hover { |
|
26
|
color: #4183C4; |
|
27
|
text-decoration: underline; |
|
28
|
} |
|
29
|
|
|
30
|
|
|
31
|
/* Page title, above menu bars */ |
|
32
|
|
|
33
|
.title { |
|
34
|
color: #4183C4; |
|
35
|
float: left; |
|
36
|
} |
|
37
|
h1.page-title { |
|
38
|
font-size: 1.60em; /* match content > h1 */ |
|
39
|
margin-bottom: 0; /* div.content top margin suffices */ |
|
40
|
display: none; /* don't use body-area h1 except… */ |
|
41
|
} |
|
42
|
.artifact h1.page-title, |
|
43
|
.dir h1.page-title, |
|
44
|
.doc h1.page-title, |
|
45
|
.wiki h1.page-title { |
|
46
|
display: block; /* …for potentially long doc titles… */ |
|
47
|
color: #444; |
|
48
|
} |
|
49
|
.artifact .title > .page-title, |
|
50
|
.dir .title > .page-title, |
|
51
|
.doc .title > .page-title, |
|
52
|
.wiki .title > .page-title { |
|
53
|
display: none; /* …where we suppress the title area h1 instead */ |
|
54
|
} |
|
55
|
.title h1 { |
|
56
|
display: inline; |
|
57
|
font-size: 2.20em; |
|
58
|
} |
|
59
|
.title h1:after { |
|
60
|
content: " / "; |
|
61
|
color: #777; |
|
62
|
font-weight: normal; |
|
63
|
} |
|
64
|
.artifact .title h1:after, |
|
65
|
.dir .title h1:after, |
|
66
|
.doc .title h1:after, |
|
67
|
.wiki .title h1:after { |
|
68
|
content: ""; /* hide solidus for docs along with title h1 */ |
|
69
|
} |
|
70
|
.status { |
|
71
|
float: right; |
|
72
|
font-size: 0.8em; |
|
73
|
} |
|
74
|
div.logo { |
|
75
|
float: left; |
|
76
|
padding-right: 10px; |
|
77
|
} |
|
78
|
div.logo img { |
|
79
|
max-height: 2em; /* smaller than title to keep it above the baseline */ |
|
80
|
} |
|
81
|
|
|
82
|
|
|
83
|
/* Main menu and optional sub-menu */ |
|
84
|
|
|
85
|
.mainmenu { |
|
86
|
clear: both; |
|
87
|
background: #eaeaea linear-gradient(#fafafa, #eaeaea) repeat-x; |
|
88
|
border: 1px solid #eaeaea; |
|
89
|
border-radius: 5px; |
|
90
|
overflow-x: auto; |
|
91
|
overflow-y: hidden; |
|
92
|
white-space: nowrap; |
|
93
|
z-index: 21; /* just above hbdrop */ |
|
94
|
} |
|
95
|
.mainmenu a { |
|
96
|
text-decoration: none; |
|
97
|
color: #777; |
|
98
|
border-right: 1px solid #eaeaea; |
|
99
|
} |
|
100
|
.mainmenu a.active, |
|
101
|
.mainmenu a:hover { |
|
102
|
color: #000; |
|
103
|
border-bottom: 2px solid #D26911; |
|
104
|
} |
|
105
|
nav#hbdrop { |
|
106
|
background-color: white; |
|
107
|
border: 1px solid black; |
|
108
|
border-top: white; |
|
109
|
border-radius: 0 0 0.5em 0.5em; |
|
110
|
display: none; |
|
111
|
font-size: 80%; |
|
112
|
left: 2em; |
|
113
|
width: 90%; |
|
114
|
padding-right: 1em; |
|
115
|
position: absolute; |
|
116
|
z-index: 20; /* just below mainmenu, but above timeline bubbles */ |
|
117
|
} |
|
118
|
|
|
119
|
.submenu { |
|
120
|
font-size: 0.8em; |
|
121
|
padding: 10px; |
|
122
|
border-bottom: 1px solid #ccc; |
|
123
|
} |
|
124
|
.submenu a, .submenu label { |
|
125
|
padding: 10px 11px; |
|
126
|
text-decoration: none; |
|
127
|
color: #777; |
|
128
|
} |
|
129
|
.submenu label { |
|
130
|
white-space: nowrap; |
|
131
|
} |
|
132
|
.submenu a:hover, .submenu label:hover { |
|
133
|
padding: 6px 10px; |
|
134
|
border: 1px solid #ccc; |
|
135
|
border-radius: 5px; |
|
136
|
color: #000; |
|
137
|
} |
|
138
|
span.submenuctrl, span.submenuctrl input, select.submenuctrl { |
|
139
|
color: #777; |
|
140
|
} |
|
141
|
span.submenuctrl { |
|
142
|
white-space: nowrap; |
|
143
|
} |
|
144
|
|
|
145
|
|
|
146
|
/* Main document area; elements common to most pages. */ |
|
147
|
|
|
148
|
.content { |
|
149
|
padding: 1ex; |
|
150
|
color: #2e2e2e; /* justified above in "WCAG 2" comment */ |
|
151
|
} |
|
152
|
.content h1 { font-size: 1.60em; color: #444; } |
|
153
|
.content h2 { font-size: 1.45em; color: #444; } |
|
154
|
.content h3 { font-size: 1.15em; color: #444; } |
|
155
|
.content h4 { font-size: 1.05em; color: #444; } |
|
156
|
.content h5 { font-size: 1.00em; color: #444; } |
|
157
|
|
|
158
|
.section { |
|
159
|
font-size: 1em; |
|
160
|
font-weight: bold; |
|
161
|
background-color: #f5f5f5; |
|
162
|
border: 1px solid #d8d8d8; |
|
163
|
border-radius: 3px 3px 0 0; |
|
164
|
padding: 9px 10px 10px; |
|
165
|
margin: 10px 0; |
|
166
|
} |
|
167
|
.sectionmenu { |
|
168
|
border: 1px solid #d8d8d8; |
|
169
|
border-radius: 0 0 3px 3px; |
|
170
|
border-top: 0; |
|
171
|
margin-top: -10px; |
|
172
|
margin-bottom: 10px; |
|
173
|
padding: 10px; |
|
174
|
} |
|
175
|
.sectionmenu a { |
|
176
|
display: inline-block; |
|
177
|
margin-right: 1em; |
|
178
|
} |
|
179
|
|
|
180
|
hr { |
|
181
|
color: #eee; |
|
182
|
} |
|
183
|
|
|
184
|
|
|
185
|
/* Page footer */ |
|
186
|
|
|
187
|
footer { |
|
188
|
border-top: 1px solid #ccc; |
|
189
|
padding: 10px; |
|
190
|
font-size: 0.8em; |
|
191
|
margin-top: 10px; |
|
192
|
color: #ccc; |
|
193
|
} |
|
194
|
|
|
195
|
/* Forum */ |
|
196
|
|
|
197
|
.forum a:visited { |
|
198
|
color: #6A7F94; |
|
199
|
} |
|
200
|
|
|
201
|
div.forumSel { |
|
202
|
animation: 1s linear 0s sel-fade; |
|
203
|
background-color: white; /* animation end state */ |
|
204
|
border-left: 4px solid black; /* after-animation selection indicator */ |
|
205
|
} |
|
206
|
@keyframes sel-fade { |
|
207
|
from { background-color: #cef; } |
|
208
|
to { background-color: white; } |
|
209
|
} |
|
210
|
|
|
211
|
.forum form input { |
|
212
|
margin: 0.5em 0; |
|
213
|
} |
|
214
|
|
|
215
|
|
|
216
|
/* Markdown and Wiki-formatted pages: /wiki, /doc, /file... */ |
|
217
|
|
|
218
|
.markdown blockquote, p.blockquote, .sidebar { |
|
219
|
/* Override default.css version with our accent colors. Background is |
|
220
|
* the solid version of rgba(65, 131, 196, 0.1) on white, needed to |
|
221
|
* avoid tinting pre block backgrounds going "under" them. */ |
|
222
|
background-color: #ebf2f9; |
|
223
|
border-left-color: #4183c4; |
|
224
|
} |
|
225
|
div.sidebar { |
|
226
|
/* Add extra whitespace between sidebar and content, both for spacing |
|
227
|
* and to put a gap between it and any <pre> blocks that happen to run |
|
228
|
* up against it. */ |
|
229
|
outline: 1em solid white; |
|
230
|
} |
|
231
|
|
|
232
|
/* Mark inline code fragments in the near-universal manner pioneered by |
|
233
|
* Stack Overflow, then picked up by approximately everyone, including |
|
234
|
* us, now. |
|
235
|
* |
|
236
|
* This combinatorial selector explosion results from a need to apply |
|
237
|
* these stylings inside multiple page container types, multiplied by |
|
238
|
* the surprisingly large number of tags HTML defines for semantically |
|
239
|
* differentiated monospaced inline markup. If we do not target the |
|
240
|
* elements we want to affect carefully, we'll end up overreaching, |
|
241
|
* styling Fossil UI elements that use these tags for local purposes. |
|
242
|
* |
|
243
|
* HTML generated and emitted by Fossil UI does not always fall under |
|
244
|
* the skin's generic rules; we must avoid intruding on its domain. |
|
245
|
* Our limited intent here is to style user content only, where it is |
|
246
|
* unreasonable to expect its author to take the time to hand-craft |
|
247
|
* per-document styling. Contrast Fossil UI, which often does exactly |
|
248
|
* that in order to get particular results. |
|
249
|
* |
|
250
|
* Its rough equivalent in Sass syntax is far more compact, thus clearer: |
|
251
|
* |
|
252
|
* .artifact, .dir, .doc, .forum, .wiki // the page types we target |
|
253
|
* > .content // hands off header & footer |
|
254
|
* &, > .fossil-doc, > .markdown // wiki, HTML & MD emb docs |
|
255
|
* > p // in top-level paras only |
|
256
|
* > code, > kbd, > samp, > tt, > var // monospaced tag types |
|
257
|
* background-color: #f4f4f4 // pale gray box which… |
|
258
|
* padding: 0 4px // …extends around the sides |
|
259
|
* |
|
260
|
* We then need something similar for the block-level pre elements. |
|
261
|
* |
|
262
|
* The CSS below is based on feeding that Sass code through this: |
|
263
|
* |
|
264
|
* $ sassc code.sass | sed -e 's/, /,\n/g' |
|
265
|
* |
|
266
|
* …then hand-cleansing it to make it _somewhat_ more understandable. |
|
267
|
* That largely amounts to whitespace tweaks, but we've also done things |
|
268
|
* like trim back the forum-specific styling to apply to the default MD |
|
269
|
* markup only; direct HTML formatting isn't even an option there, and |
|
270
|
* while wiki markup _is_ supported, MD was the default from day 1. |
|
271
|
* Another quirk of the forum post handling is that the .markdown class |
|
272
|
* gets applied per-post, not up at the top level as with the wiki, |
|
273
|
* embedded docs, etc. |
|
274
|
*/ |
|
275
|
.artifact > .content > p > code, |
|
276
|
.artifact > .content > p > kbd, |
|
277
|
.artifact > .content > p > samp, |
|
278
|
.artifact > .content > p > tt, |
|
279
|
.artifact > .content > p > var, |
|
280
|
.artifact > .content > .fossil-doc > p > code, |
|
281
|
.artifact > .content > .fossil-doc > p > kbd, |
|
282
|
.artifact > .content > .fossil-doc > p > samp, |
|
283
|
.artifact > .content > .fossil-doc > p > tt, |
|
284
|
.artifact > .content > .fossil-doc > p > var, |
|
285
|
.artifact > .content > .markdown > p > code, |
|
286
|
.artifact > .content > .markdown > p > kbd, |
|
287
|
.artifact > .content > .markdown > p > samp, |
|
288
|
.artifact > .content > .markdown > p > tt, |
|
289
|
.artifact > .content > .markdown > p > var, |
|
290
|
.dir > .content > p > code, |
|
291
|
.dir > .content > p > kbd, |
|
292
|
.dir > .content > p > samp, |
|
293
|
.dir > .content > p > tt, |
|
294
|
.dir > .content > p > var, |
|
295
|
.dir > .content > .fossil-doc > p > code, |
|
296
|
.dir > .content > .fossil-doc > p > kbd, |
|
297
|
.dir > .content > .fossil-doc > p > samp, |
|
298
|
.dir > .content > .fossil-doc > p > tt, |
|
299
|
.dir > .content > .fossil-doc > p > var, |
|
300
|
.dir > .content > .markdown > p > code, |
|
301
|
.dir > .content > .markdown > p > kbd, |
|
302
|
.dir > .content > .markdown > p > samp, |
|
303
|
.dir > .content > .markdown > p > tt, |
|
304
|
.dir > .content > .markdown > p > var, |
|
305
|
.doc > .content > p > code, |
|
306
|
.doc > .content > p > kbd, |
|
307
|
.doc > .content > p > samp, |
|
308
|
.doc > .content > p > tt, |
|
309
|
.doc > .content > p > var, |
|
310
|
.doc > .content > .fossil-doc > p > code, |
|
311
|
.doc > .content > .fossil-doc > p > kbd, |
|
312
|
.doc > .content > .fossil-doc > p > samp, |
|
313
|
.doc > .content > .fossil-doc > p > tt, |
|
314
|
.doc > .content > .fossil-doc > p > var, |
|
315
|
.doc > .content > .markdown > p > code, |
|
316
|
.doc > .content > .markdown > p > kbd, |
|
317
|
.doc > .content > .markdown > p > samp, |
|
318
|
.doc > .content > .markdown > p > tt, |
|
319
|
.doc > .content > .markdown > p > var, |
|
320
|
.forum > .content .markdown > p > code, |
|
321
|
.forum > .content .markdown > p > kbd, |
|
322
|
.forum > .content .markdown > p > samp, |
|
323
|
.forum > .content .markdown > p > tt, |
|
324
|
.forum > .content .markdown > p > var, |
|
325
|
.wiki > .content > p > code, |
|
326
|
.wiki > .content > p > kbd, |
|
327
|
.wiki > .content > p > samp, |
|
328
|
.wiki > .content > p > tt, |
|
329
|
.wiki > .content > p > var, |
|
330
|
.wiki > .content > .fossil-doc > p > code, |
|
331
|
.wiki > .content > .fossil-doc > p > kbd, |
|
332
|
.wiki > .content > .fossil-doc > p > samp, |
|
333
|
.wiki > .content > .fossil-doc > p > tt, |
|
334
|
.wiki > .content > .fossil-doc > p > var, |
|
335
|
.wiki > .content > .markdown > p > code, |
|
336
|
.wiki > .content > .markdown > p > kbd, |
|
337
|
.wiki > .content > .markdown > p > samp, |
|
338
|
.wiki > .content > .markdown > p > tt, |
|
339
|
.wiki > .content > .markdown > p > var, |
|
340
|
.artifact > .content > pre, |
|
341
|
.artifact > .content > .fossil-doc > pre, |
|
342
|
.artifact > .content > .markdown > pre, |
|
343
|
.dir > .content > pre, |
|
344
|
.dir > .content > .fossil-doc > pre, |
|
345
|
.dir > .content > .markdown > pre, |
|
346
|
.doc > .content > pre, |
|
347
|
.doc > .content > .fossil-doc > pre, |
|
348
|
.doc > .content > .markdown > pre, |
|
349
|
.forum > .content .markdown > pre, |
|
350
|
.wiki > .content > pre, |
|
351
|
.wiki > .content > .fossil-doc > pre, |
|
352
|
.wiki > .content > .markdown > pre { |
|
353
|
background-color: #f4f4f4; |
|
354
|
padding: 0 4px; |
|
355
|
} |
|
356
|
.content pre, table.numbered-lines > tbody > tr { |
|
357
|
hyphens: none; |
|
358
|
line-height: 1.25; |
|
359
|
} |
|
360
|
|
|
361
|
.content ul:not(.browser) > li { |
|
362
|
list-style-type: disc; |
|
363
|
} |
|
364
|
|
|
365
|
div.filetree ul li.dir, |
|
366
|
div.filetree ul li.subdir, |
|
367
|
div.filetree ul li.file{ |
|
368
|
list-style-type: none; |
|
369
|
} |
|
370
|
|
|
371
|
.artifact > .content table, |
|
372
|
.dir > .content table, |
|
373
|
.doc > .content table, |
|
374
|
.wiki > .content table { |
|
375
|
background-color: #f0f5f9; |
|
376
|
border: 1px solid #a7c2dc; |
|
377
|
border-radius: 0.5em; |
|
378
|
border-spacing: 0; |
|
379
|
padding: 6px; |
|
380
|
} |
|
381
|
.artifact > .content th, |
|
382
|
.dir > .content th, |
|
383
|
.doc > .content th, |
|
384
|
.wiki > .content th { |
|
385
|
border-bottom: 1px solid #dee8f2; |
|
386
|
padding-bottom: 4px; |
|
387
|
padding-right: 6px; |
|
388
|
} |
|
389
|
.artifact > .content tr > th, |
|
390
|
.dir > .content tr > th, |
|
391
|
.doc > .content tr > th, |
|
392
|
.wiki > .content tr > th { |
|
393
|
background-color: #dee8f0; |
|
394
|
} |
|
395
|
.artifact > .content tr:nth-child(odd), |
|
396
|
.dir > .content tr:nth-child(odd), |
|
397
|
.doc > .content tr:nth-child(odd), |
|
398
|
.wiki > .content tr:nth-child(odd) { |
|
399
|
background-color: #e0e8ee; |
|
400
|
} |
|
401
|
.artifact > .content td, |
|
402
|
.dir > .content td, |
|
403
|
.doc > .content td, |
|
404
|
.wiki > .content td { |
|
405
|
padding-bottom: 4px; |
|
406
|
padding-right: 6px; |
|
407
|
} |
|
408
|
th { |
|
409
|
/* Special rule at high level to override default centering of table |
|
410
|
header cell text. If it isn't at this level, it can't be |
|
411
|
overridden in the HTML, as by the MD table generator's handling |
|
412
|
of `:` alignment markers. */ |
|
413
|
text-align: left; |
|
414
|
} |
|
415
|
|
|
416
|
/* Wiki adjustments */ |
|
417
|
pre.verbatim { |
|
418
|
/* keep code examples from crashing into sidebars, etc. */ |
|
419
|
white-space: pre-wrap; |
|
420
|
} |
|
421
|
textarea.wikiedit { |
|
422
|
/* Monospace fonts tend to have smaller x-heights; compensate. |
|
423
|
* Can't do this generally because not all fonts have this problem. |
|
424
|
* A textarea stands alone, whereas inline <code> has to work with |
|
425
|
* the browser's choice of sans-serif proportional font. */ |
|
426
|
font-size: 1.1em; |
|
427
|
} |
|
428
|
|
|
429
|
|
|
430
|
/* Tickets */ |
|
431
|
|
|
432
|
table.report { |
|
433
|
cursor: auto; |
|
434
|
border: 1px solid #ccc; |
|
435
|
border-radius: 0.5em; |
|
436
|
margin: 1em 0; |
|
437
|
} |
|
438
|
.report td, .report th { |
|
439
|
border: 0; |
|
440
|
font-size: .8em; |
|
441
|
padding: 10px; |
|
442
|
} |
|
443
|
.report td:first-child { |
|
444
|
border-top-left-radius: 5px; |
|
445
|
} |
|
446
|
.report tbody tr:last-child td:first-child { |
|
447
|
border-bottom-left-radius: 5px; |
|
448
|
} |
|
449
|
.report td:last-child { |
|
450
|
border-top-right-radius: 5px; |
|
451
|
} |
|
452
|
.report tbody tr:last-child { |
|
453
|
border-bottom-left-radius: 5px; |
|
454
|
border-bottom-right-radius: 5px; |
|
455
|
} |
|
456
|
.report tbody tr:last-child td:last-child { |
|
457
|
border-bottom-right-radius: 5px; |
|
458
|
} |
|
459
|
.report th { |
|
460
|
cursor: pointer; |
|
461
|
} |
|
462
|
.report thead+tbody tr:hover { |
|
463
|
background-color: #f5f9fc !important; |
|
464
|
} |
|
465
|
|
|
466
|
td.tktDspLabel { |
|
467
|
width: 70px; |
|
468
|
text-align: right; |
|
469
|
overflow: hidden; |
|
470
|
} |
|
471
|
td.tktDspValue { |
|
472
|
text-align: left; |
|
473
|
vertical-align: top; |
|
474
|
background-color: #f8f8f8; |
|
475
|
border: 1px solid #ccc; |
|
476
|
} |
|
477
|
td.tktDspValue pre { |
|
478
|
white-space: pre-wrap; |
|
479
|
} |
|
480
|
|
|
481
|
|
|
482
|
/* Timeline */ |
|
483
|
|
|
484
|
span.timelineDetail { |
|
485
|
font-size: 90%; |
|
486
|
} |
|
487
|
div.timelineDate { |
|
488
|
font-weight: bold; |
|
489
|
white-space: nowrap; |
|
490
|
} |
|
491
|
|
|
492
|
/* Extend default.css comment cell rounding to the whole row for the |
|
493
|
* various types of "selected" rows, making them "hang" into the left |
|
494
|
* margin, distinguishing them from the coloring used for branch cells. |
|
495
|
* Care must be taken to avoid having the box-shadow rounded but the |
|
496
|
* background squared-off. */ |
|
497
|
table.timelineTable { |
|
498
|
padding: 0 3px; /* leave space to sides for box shadow; can clip otherwise */ |
|
499
|
} |
|
500
|
table.timelineTable tr { |
|
501
|
border-radius: 1em; |
|
502
|
} |
|
503
|
tr.timelineSelected, tr.timelineSecondary { background-color: unset; } |
|
504
|
tr.timelineSelected td, span.timelineSelected { |
|
505
|
background-color: #fbe8d5; |
|
506
|
} |
|
507
|
tr.timelineSecondary td, span.timelineSecondary { |
|
508
|
background-color: #d5e8fb; |
|
509
|
} |
|
510
|
tr.timelineCurrent td:first-child, |
|
511
|
tr.timelineSecondary td:first-child, |
|
512
|
tr.timelineSelected td:first-child { |
|
513
|
border-top-left-radius: 1em; |
|
514
|
border-bottom-left-radius: 1em; |
|
515
|
} |
|
516
|
tr.timelineCurrent td:last-child, |
|
517
|
tr.timelineSecondary td:last-child, |
|
518
|
tr.timelineSelected td:last-child { |
|
519
|
border-top-right-radius: 1em; |
|
520
|
border-bottom-right-radius: 1em; |
|
521
|
} |
|
522
|
tr.timelineCurrent td { |
|
523
|
border-top: 1px dashed #446979; |
|
524
|
border-bottom: 1px dashed #446979; |
|
525
|
} |
|
526
|
tr.timelineCurrent td:first-child { |
|
527
|
border-left: 1px dashed #446979; |
|
528
|
} |
|
529
|
tr.timelineCurrent td:last-child { |
|
530
|
border-right: 1px dashed #446979; |
|
531
|
} |
|
532
|
|
|
533
|
|
|
534
|
/* Miscellaneous UI elements */ |
|
535
|
|
|
536
|
.fossil-tooltip.help-buttonlet-content { |
|
537
|
background-color: lightyellow; |
|
538
|
} |
|
539
|
|
|
540
|
|
|
541
|
/* Exceptions for specific screen sizes */ |
|
542
|
|
|
543
|
@media screen and (max-width: 600px) { |
|
544
|
/* Spacing for mobile */ |
|
545
|
body { |
|
546
|
padding-left: 4px; |
|
547
|
padding-right: 4px; |
|
548
|
} |
|
549
|
.content { |
|
550
|
font-size: 0.9em; |
|
551
|
} |
|
552
|
.title { |
|
553
|
padding-top: 0px; |
|
554
|
padding-bottom: 0px; |
|
555
|
} |
|
556
|
.title > .page-title { |
|
557
|
display: inline; /* show page titles above menu bar… */ |
|
558
|
} |
|
559
|
.artifact .title > .page-title, |
|
560
|
.dir .title > .page-title, |
|
561
|
.doc .title > .page-title, |
|
562
|
.wiki .title > .page-title { |
|
563
|
display: none; /* …except for docs, where it may force wrapping */ |
|
564
|
} |
|
565
|
.status {padding-top: 0px;} |
|
566
|
.mainmenu a { |
|
567
|
padding: 8px 10px; |
|
568
|
} |
|
569
|
.mainmenu { |
|
570
|
padding: 10px; |
|
571
|
} |
|
572
|
} |
|
573
|
@media screen and (min-width: 600px) { |
|
574
|
/* Spacing for desktop */ |
|
575
|
body { |
|
576
|
padding-left: 20px; |
|
577
|
padding-right: 20px; |
|
578
|
} |
|
579
|
.title { |
|
580
|
padding-top: 10px; |
|
581
|
padding-bottom: 10px; |
|
582
|
} |
|
583
|
span.page-title { |
|
584
|
font-size: 18px; |
|
585
|
} |
|
586
|
div.logo { |
|
587
|
padding-top: 10px; |
|
588
|
} |
|
589
|
.status {padding-top: 30px;} |
|
590
|
.mainmenu a { |
|
591
|
padding: 8px 20px; |
|
592
|
} |
|
593
|
.mainmenu { |
|
594
|
padding: 10px; |
|
595
|
} |
|
596
|
|
|
597
|
/* Wide screens mean long lines. Add extra leading to give the eye a |
|
598
|
* "gutter" to follow from the end of one to the start of the next. */ |
|
599
|
.content dd, |
|
600
|
.content dt, |
|
601
|
.content div, |
|
602
|
.content li, |
|
603
|
.content p, |
|
604
|
.content table { |
|
605
|
line-height: 1.4em; |
|
606
|
} |
|
607
|
|
|
608
|
/* This horror show has the same cause that informed our handling of |
|
609
|
* <code> and friends above; see "combinatorial selector explosion." |
|
610
|
* Without this careful targeting, we'd not only overreach into areas |
|
611
|
* of Fossil UI where our meddling is not wanted, we would mistakenly |
|
612
|
* apply double indents to nested formatting in MD forum posts, p |
|
613
|
* within td tags, and more. |
|
614
|
* |
|
615
|
* Rather than give the equivalent Sass code here, see the SCSS file |
|
616
|
* that the [Inskinerator](https://tangentsoft.com/inskinerator/) |
|
617
|
* project ships as override/modern/media.scss. Rendering that |
|
618
|
* through sassc gives substantially identical output, modulo the |
|
619
|
* hand-polishing we've done here. */ |
|
620
|
.artifact > .content > p, |
|
621
|
.artifact > .content > .markdown > p, |
|
622
|
.artifact > .content > .fossil-doc > p, |
|
623
|
.artifact > .content > ol, .artifact > .content > ul, |
|
624
|
.artifact > .content > .markdown > ol, .artifact > .content > .markdown > ul, |
|
625
|
.artifact > .content > .fossil-doc > ol, .artifact > .content > .fossil-doc > ul, |
|
626
|
.artifact > .content > table, |
|
627
|
.artifact > .content > .markdown > table, |
|
628
|
.artifact > .content > .fossil-doc > table, |
|
629
|
.dir > .content > p, |
|
630
|
.dir > .content > .markdown > p, |
|
631
|
.dir > .content > .fossil-doc > p, |
|
632
|
.dir > .content > ol, .dir > .content > ul, |
|
633
|
.dir > .content > .markdown > ol, .dir > .content > .markdown > ul, |
|
634
|
.dir > .content > .fossil-doc > ol, .dir > .content > .fossil-doc > ul, |
|
635
|
.dir > .content > table, |
|
636
|
.dir > .content > .markdown > table, |
|
637
|
.dir > .content > .fossil-doc > table, |
|
638
|
.doc > .content > p, |
|
639
|
.doc > .content > .markdown > p, |
|
640
|
.doc > .content > .fossil-doc > p, |
|
641
|
.doc > .content > ol, .doc > .content > ul, |
|
642
|
.doc > .content > .markdown > ol, .doc > .content > .markdown > ul, |
|
643
|
.doc > .content > .fossil-doc > ol, .doc > .content > .fossil-doc > ul, |
|
644
|
.doc > .content > table, |
|
645
|
.doc > .content > .markdown > table, |
|
646
|
.doc > .content > .fossil-doc > table, |
|
647
|
.wiki > .content > p, |
|
648
|
.wiki > .content > .markdown > p, |
|
649
|
.wiki > .content > .fossil-doc > p, |
|
650
|
.wiki > .content > ol, .wiki > .content > ul, |
|
651
|
.wiki > .content > .markdown > ol, .wiki > .content > .markdown > ul, |
|
652
|
.wiki > .content > .fossil-doc > ol, .wiki > .content > .fossil-doc > ul, |
|
653
|
.wiki > .content > table, |
|
654
|
.wiki > .content > .markdown > table, |
|
655
|
.wiki > .content > .fossil-doc > table, |
|
656
|
#fileedit-tab-preview-wrapper > p, |
|
657
|
#fileedit-tab-preview-wrapper > ol, |
|
658
|
#fileedit-tab-preview-wrapper > ul, |
|
659
|
#fileedit-tab-preview-wrapper > table, |
|
660
|
#fileedit-tab-preview-wrapper > .markdown > p, |
|
661
|
#fileedit-tab-preview-wrapper > .markdown > ol, |
|
662
|
#fileedit-tab-preview-wrapper > .markdown > ul, |
|
663
|
#fileedit-tab-preview-wrapper > .markdown > table, |
|
664
|
#wikiedit-tab-preview-wrapper > p, |
|
665
|
#wikiedit-tab-preview-wrapper > ol, |
|
666
|
#wikiedit-tab-preview-wrapper > ul, |
|
667
|
#wikiedit-tab-preview-wrapper > table, |
|
668
|
#wikiedit-tab-preview-wrapper > .markdown > p, |
|
669
|
#wikiedit-tab-preview-wrapper > .markdown > ol, |
|
670
|
#wikiedit-tab-preview-wrapper > .markdown > ul, |
|
671
|
#wikiedit-tab-preview-wrapper > .markdown > table { |
|
672
|
margin-left: 50pt; |
|
673
|
margin-right: 50pt; |
|
674
|
} |
|
675
|
|
|
676
|
/* Code blocks get extra indenting. We need a selector explosion |
|
677
|
* equally powerful to the one above for inline <code> fragments and |
|
678
|
* similar elements, for essentially the same reason: Fossil UI also |
|
679
|
* uses <pre>, and we want to affect user content only. |
|
680
|
* |
|
681
|
* The equivalent Sass code is: |
|
682
|
* |
|
683
|
* .artifact, .dir, .doc, .wiki // doc types we target |
|
684
|
* > .content // hands off header & footer |
|
685
|
* @import 'pre-doc-margins.sass' |
|
686
|
* |
|
687
|
* #fileedit-tab-preview-wrapper, // include /fileedit previews |
|
688
|
* #wikiedit-tab-preview-wrapper // ditto /wikiedit |
|
689
|
* @import 'pre-doc-margins.sass' |
|
690
|
* |
|
691
|
* …where pre-doc-margins.sass contains the elements common to both: |
|
692
|
* |
|
693
|
* &, > .fossil-doc, > .markdown // wiki, HTML & MD doc types |
|
694
|
* > pre // direct pre descendants only |
|
695
|
* margin-left: 70pt; |
|
696
|
* margin-right: 50pt; |
|
697
|
* |
|
698
|
* This is a technical overreach since /wiki & /wikiedit lack support |
|
699
|
* for Fossil's HTML embedded doc markup capability, but we prefer to |
|
700
|
* draw the /fileedit parallel in our Sass example over the dubious |
|
701
|
* pleasure of being nit-picky on this point. Instead, we've chosen |
|
702
|
* to back that overreach out by hand below. |
|
703
|
*/ |
|
704
|
.artifact > .content > pre, |
|
705
|
.artifact > .content > .fossil-doc > pre, |
|
706
|
.artifact > .content > .markdown > pre, |
|
707
|
.dir > .content > pre, |
|
708
|
.dir > .content > .fossil-doc > pre, |
|
709
|
.dir > .content > .markdown > pre, |
|
710
|
.doc > .content > pre, |
|
711
|
.doc > .content > .fossil-doc > pre, |
|
712
|
.doc > .content > .markdown > pre, |
|
713
|
.wiki > .content > pre, |
|
714
|
.wiki > .content > .markdown > pre { |
|
715
|
margin-left: 70pt; |
|
716
|
margin-right: 50pt; |
|
717
|
} |
|
718
|
#fileedit-tab-preview-wrapper > pre, |
|
719
|
#wikiedit-tab-preview-wrapper > pre, |
|
720
|
#fileedit-tab-preview-wrapper > .fossil-doc > pre, |
|
721
|
#fileedit-tab-preview-wrapper > .markdown > pre, |
|
722
|
#wikiedit-tab-preview-wrapper > .markdown > pre { |
|
723
|
margin-left: 70pt; |
|
724
|
margin-right: 50pt; |
|
725
|
} |
|
726
|
.forum > .content .markdown > pre { |
|
727
|
margin-left: 20pt; /* special case for MD in forum; need less indent */ |
|
728
|
} |
|
729
|
|
|
730
|
/* Fossil UI uses these, but in sufficiently constrained ways that we |
|
731
|
* don't have to be nearly as careful to avoid an overreach. */ |
|
732
|
.doc > .content h1, .artifact .content h1, .dir .content h1, .fileedit .content h1, .wiki .content h1 { margin-left: 10pt; } |
|
733
|
.doc > .content h2, .artifact .content h2, .dir .content h2, .fileedit .content h2, .wiki .content h2 { margin-left: 20pt; } |
|
734
|
.doc > .content h3, .artifact .content h3, .dir .content h3, .fileedit .content h3, .wiki .content h3 { margin-left: 30pt; } |
|
735
|
.doc > .content h4, .artifact .content h4, .dir .content h4, .fileedit .content h4, .wiki .content h4 { margin-left: 40pt; } |
|
736
|
.doc > .content h5, .artifact .content h5, .dir .content h5, .fileedit .content h5, .wiki .content h5 { margin-left: 50pt; } |
|
737
|
.doc > .content hr, .artifact .content hr, .dir .content hr, .fileedit .content hr, .wiki .content hr { margin-left: 10pt; } |
|
738
|
|
|
739
|
/* Don't need to be nearly as careful with tags Fossil UI doesn't use. */ |
|
740
|
.doc dd, .artifact dd, .dir dd, .fileedit dd, .wikiedit dd { margin-left: 30pt; margin-bottom: 1em; } |
|
741
|
.doc dl, .artifact dl, .dir dl, .fileedit dl, .wikiedit dl { margin-left: 60pt; } |
|
742
|
.doc dt, .artifact dt, .dir dt, .fileedit dt, .wikiedit dt { margin-left: 10pt; } |
|
743
|
|
|
744
|
/* Fossil UI doesn't use Pikchr at all (yet?) so we can be quite loose |
|
745
|
* with these selectors. */ |
|
746
|
.content .pikchr-wrapper { margin-left: 70pt; } |
|
747
|
div.pikchr-wrapper.indent:not(.source) { |
|
748
|
/* Selector naming scheme mismatch is intentional: it must match the |
|
749
|
* way it's given in default.css exactly if it is to override it. */ |
|
750
|
margin-left: 70pt; |
|
751
|
margin-right: 50pt; |
|
752
|
} |
|
753
|
div.pikchr-wrapper.center:not(.source), |
|
754
|
div.pikchr-wrapper.float-right:not(.source) { |
|
755
|
margin-left: 0; |
|
756
|
} |
|
757
|
|
|
758
|
/* Special treatment for backward compatibility. */ |
|
759
|
.indent, /* clean alternative to misusing <blockquote> */ |
|
760
|
.artifact > .content > blockquote:not(.file-content), |
|
761
|
.dir > .content > blockquote, |
|
762
|
.doc > .content > blockquote, |
|
763
|
.fileedit > .content > blockquote, |
|
764
|
.wiki > .content > blockquote { |
|
765
|
/* We must apply extra indent relative to "p" since Fossil's wiki |
|
766
|
* generator misuses the blockquote tag against HTML and MD norms |
|
767
|
* to mean "indented paragraph." Skip it for file content retrieved |
|
768
|
* by /dir URLs. */ |
|
769
|
margin-left: 80pt; |
|
770
|
} |
|
771
|
.artifact > .content > .markdown > blockquote, |
|
772
|
.dir > .content > .markdown > blockquote, |
|
773
|
.doc > .content > .markdown > blockquote, |
|
774
|
.fileedit > .content > .markdown > blockquote, |
|
775
|
.wiki > .content > .markdown > blockquote { |
|
776
|
/* Fossil MD didn't inherit that bug; its HTML generator emits |
|
777
|
* blockquote tags only for _block quotes_! A moderate indent |
|
778
|
* suffices due to the visual styling applied above. */ |
|
779
|
margin-left: 60pt; |
|
780
|
} |
|
781
|
|
|
782
|
/* Alternative to BLOCK.indent when wrapped in something that is |
|
783
|
* itself indented. The value is the delta between p and blockquote |
|
784
|
* above, expressed as padding instead of margin so it adds to the |
|
785
|
* outer margin instead of forcing the browser into picking one. */ |
|
786
|
.local-indent { |
|
787
|
padding-left: 30pt; |
|
788
|
} |
|
789
|
} |
|
790
|
|