Fossil SCM

The new skin's table styling now applies to docs served via /dir and /file URLs as well.

wyoung 2024-02-18 15:10 trunk
Commit a974210166464b5926f53bdeb0aacc51d9908322bd24131e5076cbc146cc7b13
Parent f19f5369f9a9418…
1 file changed +45 -10
~ skins/default/css.txt
M skins/default/css.txt
+45 -10
--- skins/default/css.txt
+++ skins/default/css.txt
@@ -213,14 +213,22 @@
213213
214214
215215
 /* Markdown and Wiki-formatted pages: /wiki, /doc, /file... */
216216
217217
 .markdown blockquote, p.blockquote, .sidebar {
218
- /* Override default.css version with our accent colors. */
219
- background-color: rgba(65, 131, 196, 0.1);
218
+ /* Override default.css version with our accent colors. Background is
219
+ * the solid version of rgba(65, 131, 196, 0.1) on white, needed to
220
+ * avoid tinting pre block backgrounds going "under" them. */
221
+ background-color: #ebf2f9;
220222
 border-left-color: #4183c4;
221223
 }
224
+div.sidebar {
225
+ /* Add extra whitespace between sidebar and content, both for spacing
226
+ * and to put a gap between it and any <pre> blocks that happen to run
227
+ * up against it. */
228
+ outline: 1em solid white;
229
+}
222230
223231
 /* Mark inline code fragments in the near-universal manner pioneered by
224232
 * Stack Overflow, then picked up by approximately everyone, including
225233
 * us, now.
226234
 *
@@ -243,12 +251,14 @@
243251
 * .artifact, .dir, .doc, .forum, .wiki // the page types we target
244252
 * > .content // hands off header & footer
245253
 * &, > .fossil-doc, > .markdown // wiki, HTML & MD emb docs
246254
 * > p // in top-level paras only
247255
 * > code, > kbd, > samp, > tt, > var // monospaced tag types
248
- * background-color: #eee // pale gray box which…
256
+ * background-color: #f4f4f4 // pale gray box which…
249257
 * padding: 0 4px // …extends around the sides
258
+ *
259
+ * We then need something similar for the block-level pre elements.
250260
 *
251261
 * The CSS below is based on feeding that Sass code through this:
252262
 *
253263
 * $ sassc code.sass | sed -e 's/, /,\n/g'
254264
 *
@@ -323,12 +333,27 @@
323333
 .wiki > .content > .fossil-doc > p > var,
324334
 .wiki > .content > .markdown > p > code,
325335
 .wiki > .content > .markdown > p > kbd,
326336
 .wiki > .content > .markdown > p > samp,
327337
 .wiki > .content > .markdown > p > tt,
328
-.wiki > .content > .markdown > p > var {
329
- background-color: #eee;
338
+.wiki > .content > .markdown > p > var,
339
+.artifact > .content > pre,
340
+.artifact > .content > .fossil-doc > pre,
341
+.artifact > .content > .markdown > pre,
342
+.dir > .content > pre,
343
+.dir > .content > .fossil-doc > pre,
344
+.dir > .content > .markdown > pre,
345
+.doc > .content > pre,
346
+.doc > .content > .fossil-doc > pre,
347
+.doc > .content > .markdown > pre,
348
+.forum > .content > pre,
349
+.forum > .content > .fossil-doc > pre,
350
+.forum > .content > .markdown > pre,
351
+.wiki > .content > pre,
352
+.wiki > .content > .fossil-doc > pre,
353
+.wiki > .content > .markdown > pre {
354
+ background-color: #f4f4f4;
330355
 padding: 0 4px;
331356
 }
332357
 .content pre, table.numbered-lines > tbody > tr {
333358
 hyphens: none;
334359
 line-height: 1.25;
@@ -336,30 +361,40 @@
336361
337362
 .content ul li {
338363
 list-style-type: disc;
339364
 }
340365
341
-.doc > .content table {
366
+.artifact > .content table,
367
+.dir > .content table,
368
+.doc > .content table {
342369
 background-color: #f0f5f9;
343370
 border: 1px solid #a7c2dc;
344371
 border-radius: 0.5em;
345372
 border-spacing: 0;
346373
 padding: 6px;
347374
 }
348
-.doc > .content th {
375
+.artifact > .content th,
376
+.dir > .content th,
377
+.doc > .content th {
349378
 border-bottom: 1px solid #dee8f2;
350379
 padding-bottom: 4px;
351380
 padding-right: 6px;
352381
 text-align: left;
353382
 }
354
-.doc > .content tr > th {
383
+.artifact > .content tr > th,
384
+.dir > .content tr > th,
385
+.doc > .content tr > th {
355386
 background-color: #dee8f0;
356387
 }
357
-.doc > .content tr:nth-child(odd) {
388
+.artifact > .content tr:nth-child(odd),
389
+.dir > .content tr:nth-child(odd),
390
+.doc > .content tr:nth-child(odd) {
358391
 background-color: #e0e8ee;
359392
 }
360
-.doc > .content td {
393
+.artifact > .content td,
394
+.dir > .content td,
395
+.doc > .content td {
361396
 padding-bottom: 4px;
362397
 padding-right: 6px;
363398
 text-align: left;
364399
 }
365400
366401
--- skins/default/css.txt
+++ skins/default/css.txt
@@ -213,14 +213,22 @@
213
214
215 /* Markdown and Wiki-formatted pages: /wiki, /doc, /file... */
216
217 .markdown blockquote, p.blockquote, .sidebar {
218 /* Override default.css version with our accent colors. */
219 background-color: rgba(65, 131, 196, 0.1);
 
 
220 border-left-color: #4183c4;
221 }
 
 
 
 
 
 
222
223 /* Mark inline code fragments in the near-universal manner pioneered by
224 * Stack Overflow, then picked up by approximately everyone, including
225 * us, now.
226 *
@@ -243,12 +251,14 @@
243 * .artifact, .dir, .doc, .forum, .wiki // the page types we target
244 * > .content // hands off header & footer
245 * &, > .fossil-doc, > .markdown // wiki, HTML & MD emb docs
246 * > p // in top-level paras only
247 * > code, > kbd, > samp, > tt, > var // monospaced tag types
248 * background-color: #eee // pale gray box which…
249 * padding: 0 4px // …extends around the sides
 
 
250 *
251 * The CSS below is based on feeding that Sass code through this:
252 *
253 * $ sassc code.sass | sed -e 's/, /,\n/g'
254 *
@@ -323,12 +333,27 @@
323 .wiki > .content > .fossil-doc > p > var,
324 .wiki > .content > .markdown > p > code,
325 .wiki > .content > .markdown > p > kbd,
326 .wiki > .content > .markdown > p > samp,
327 .wiki > .content > .markdown > p > tt,
328 .wiki > .content > .markdown > p > var {
329 background-color: #eee;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
330 padding: 0 4px;
331 }
332 .content pre, table.numbered-lines > tbody > tr {
333 hyphens: none;
334 line-height: 1.25;
@@ -336,30 +361,40 @@
336
337 .content ul li {
338 list-style-type: disc;
339 }
340
341 .doc > .content table {
 
 
342 background-color: #f0f5f9;
343 border: 1px solid #a7c2dc;
344 border-radius: 0.5em;
345 border-spacing: 0;
346 padding: 6px;
347 }
348 .doc > .content th {
 
 
349 border-bottom: 1px solid #dee8f2;
350 padding-bottom: 4px;
351 padding-right: 6px;
352 text-align: left;
353 }
354 .doc > .content tr > th {
 
 
355 background-color: #dee8f0;
356 }
357 .doc > .content tr:nth-child(odd) {
 
 
358 background-color: #e0e8ee;
359 }
360 .doc > .content td {
 
 
361 padding-bottom: 4px;
362 padding-right: 6px;
363 text-align: left;
364 }
365
366
--- skins/default/css.txt
+++ skins/default/css.txt
@@ -213,14 +213,22 @@
213
214
215 /* Markdown and Wiki-formatted pages: /wiki, /doc, /file... */
216
217 .markdown blockquote, p.blockquote, .sidebar {
218 /* Override default.css version with our accent colors. Background is
219 * the solid version of rgba(65, 131, 196, 0.1) on white, needed to
220 * avoid tinting pre block backgrounds going "under" them. */
221 background-color: #ebf2f9;
222 border-left-color: #4183c4;
223 }
224 div.sidebar {
225 /* Add extra whitespace between sidebar and content, both for spacing
226 * and to put a gap between it and any <pre> blocks that happen to run
227 * up against it. */
228 outline: 1em solid white;
229 }
230
231 /* Mark inline code fragments in the near-universal manner pioneered by
232 * Stack Overflow, then picked up by approximately everyone, including
233 * us, now.
234 *
@@ -243,12 +251,14 @@
251 * .artifact, .dir, .doc, .forum, .wiki // the page types we target
252 * > .content // hands off header & footer
253 * &, > .fossil-doc, > .markdown // wiki, HTML & MD emb docs
254 * > p // in top-level paras only
255 * > code, > kbd, > samp, > tt, > var // monospaced tag types
256 * background-color: #f4f4f4 // pale gray box which…
257 * padding: 0 4px // …extends around the sides
258 *
259 * We then need something similar for the block-level pre elements.
260 *
261 * The CSS below is based on feeding that Sass code through this:
262 *
263 * $ sassc code.sass | sed -e 's/, /,\n/g'
264 *
@@ -323,12 +333,27 @@
333 .wiki > .content > .fossil-doc > p > var,
334 .wiki > .content > .markdown > p > code,
335 .wiki > .content > .markdown > p > kbd,
336 .wiki > .content > .markdown > p > samp,
337 .wiki > .content > .markdown > p > tt,
338 .wiki > .content > .markdown > p > var,
339 .artifact > .content > pre,
340 .artifact > .content > .fossil-doc > pre,
341 .artifact > .content > .markdown > pre,
342 .dir > .content > pre,
343 .dir > .content > .fossil-doc > pre,
344 .dir > .content > .markdown > pre,
345 .doc > .content > pre,
346 .doc > .content > .fossil-doc > pre,
347 .doc > .content > .markdown > pre,
348 .forum > .content > pre,
349 .forum > .content > .fossil-doc > pre,
350 .forum > .content > .markdown > pre,
351 .wiki > .content > pre,
352 .wiki > .content > .fossil-doc > pre,
353 .wiki > .content > .markdown > pre {
354 background-color: #f4f4f4;
355 padding: 0 4px;
356 }
357 .content pre, table.numbered-lines > tbody > tr {
358 hyphens: none;
359 line-height: 1.25;
@@ -336,30 +361,40 @@
361
362 .content ul li {
363 list-style-type: disc;
364 }
365
366 .artifact > .content table,
367 .dir > .content table,
368 .doc > .content table {
369 background-color: #f0f5f9;
370 border: 1px solid #a7c2dc;
371 border-radius: 0.5em;
372 border-spacing: 0;
373 padding: 6px;
374 }
375 .artifact > .content th,
376 .dir > .content th,
377 .doc > .content th {
378 border-bottom: 1px solid #dee8f2;
379 padding-bottom: 4px;
380 padding-right: 6px;
381 text-align: left;
382 }
383 .artifact > .content tr > th,
384 .dir > .content tr > th,
385 .doc > .content tr > th {
386 background-color: #dee8f0;
387 }
388 .artifact > .content tr:nth-child(odd),
389 .dir > .content tr:nth-child(odd),
390 .doc > .content tr:nth-child(odd) {
391 background-color: #e0e8ee;
392 }
393 .artifact > .content td,
394 .dir > .content td,
395 .doc > .content td {
396 padding-bottom: 4px;
397 padding-right: 6px;
398 text-align: left;
399 }
400
401

Keyboard Shortcuts

Open search /
Next entry (timeline) j
Previous entry (timeline) k
Open focused entry Enter
Show this help ?
Toggle theme Top nav button