Fossil SCM
Moved most of the sidebar implementation up into default.css in a generic form so all skins share it, including Étienne. What remains behind in the new default skin are the accent colors for the background and the left border. The generic form simply applies a tint darkening to whatever background it finds itself on, which works for most of the stock skins.
Commit
bcbd1c1e90483716e29e9919837e4c13f38c55842b0c1a9b05a9ded29881c6cd
Parent
89ceba160c8faed…
2 files changed
+5
-28
+32
+5
-28
| --- skins/default/css.txt | ||
| +++ skins/default/css.txt | ||
| @@ -182,39 +182,16 @@ | ||
| 182 | 182 | .forum form input { |
| 183 | 183 | margin: 0.5em 0; |
| 184 | 184 | } |
| 185 | 185 | |
| 186 | 186 | |
| 187 | -/* Markdown and Wiki-formatted pages: /wiki, /doc, /file... | |
| 188 | - * | |
| 189 | - * The frequent use of the immediate-child selector (>) is done on | |
| 190 | - * purpose to prevent these rules from affecting MD in forum posts, | |
| 191 | - * ticket comments, etc. Without this, we'd need a bunch of inverse | |
| 192 | - * rules to back out the margins everywhere we don't want them. | |
| 193 | - * | |
| 194 | - * BEWARE: Fossil's MD and wiki to HTML processors wrap the content bodies | |
| 195 | - * differently, and /doc on *.html files works yet a third way. These | |
| 196 | - * rules are carefully written to capture these docs and no other use of | |
| 197 | - * MD/wiki/HTML. Adjust with care! | |
| 198 | - */ | |
| 199 | - | |
| 200 | -.markdown blockquote, .sidebar, p.blockquote { | |
| 201 | - /* Style it as a proper blockquote for MD only. Unlike the indent | |
| 202 | - * rule, this applies everywhere, including the forum, tickets… */ | |
| 187 | +/* Markdown and Wiki-formatted pages: /wiki, /doc, /file... */ | |
| 188 | + | |
| 189 | +.markdown blockquote, p.blockquote, .sidebar { | |
| 190 | + /* Override default.css version with our accent colors. */ | |
| 203 | 191 | background-color: rgba(65, 131, 196, 0.1); |
| 204 | - border-left: 3px solid #4183c4; | |
| 205 | - padding: 0.1em 1em; | |
| 206 | -} | |
| 207 | -.sidebar { | |
| 208 | - font-size: 0.9em; | |
| 209 | -} | |
| 210 | -div.sidebar { | |
| 211 | - padding: 1em; /* no p wrapper inside to get extra padding from */ | |
| 212 | -} | |
| 213 | -div.sidebar:not(.no-label):before { | |
| 214 | - content: "Sidebar: "; | |
| 215 | - font-weight: bold; | |
| 192 | + border-left-color: #4183c4; | |
| 216 | 193 | } |
| 217 | 194 | |
| 218 | 195 | /* Mark inline code fragments in the near-universal manner pioneered by |
| 219 | 196 | * Stack Overflow, then picked up by approximately everyone, including |
| 220 | 197 | * us, now. |
| 221 | 198 |
| --- skins/default/css.txt | |
| +++ skins/default/css.txt | |
| @@ -182,39 +182,16 @@ | |
| 182 | .forum form input { |
| 183 | margin: 0.5em 0; |
| 184 | } |
| 185 | |
| 186 | |
| 187 | /* Markdown and Wiki-formatted pages: /wiki, /doc, /file... |
| 188 | * |
| 189 | * The frequent use of the immediate-child selector (>) is done on |
| 190 | * purpose to prevent these rules from affecting MD in forum posts, |
| 191 | * ticket comments, etc. Without this, we'd need a bunch of inverse |
| 192 | * rules to back out the margins everywhere we don't want them. |
| 193 | * |
| 194 | * BEWARE: Fossil's MD and wiki to HTML processors wrap the content bodies |
| 195 | * differently, and /doc on *.html files works yet a third way. These |
| 196 | * rules are carefully written to capture these docs and no other use of |
| 197 | * MD/wiki/HTML. Adjust with care! |
| 198 | */ |
| 199 | |
| 200 | .markdown blockquote, .sidebar, p.blockquote { |
| 201 | /* Style it as a proper blockquote for MD only. Unlike the indent |
| 202 | * rule, this applies everywhere, including the forum, tickets… */ |
| 203 | background-color: rgba(65, 131, 196, 0.1); |
| 204 | border-left: 3px solid #4183c4; |
| 205 | padding: 0.1em 1em; |
| 206 | } |
| 207 | .sidebar { |
| 208 | font-size: 0.9em; |
| 209 | } |
| 210 | div.sidebar { |
| 211 | padding: 1em; /* no p wrapper inside to get extra padding from */ |
| 212 | } |
| 213 | div.sidebar:not(.no-label):before { |
| 214 | content: "Sidebar: "; |
| 215 | font-weight: bold; |
| 216 | } |
| 217 | |
| 218 | /* Mark inline code fragments in the near-universal manner pioneered by |
| 219 | * Stack Overflow, then picked up by approximately everyone, including |
| 220 | * us, now. |
| 221 |
| --- skins/default/css.txt | |
| +++ skins/default/css.txt | |
| @@ -182,39 +182,16 @@ | |
| 182 | .forum form input { |
| 183 | margin: 0.5em 0; |
| 184 | } |
| 185 | |
| 186 | |
| 187 | /* Markdown and Wiki-formatted pages: /wiki, /doc, /file... */ |
| 188 | |
| 189 | .markdown blockquote, p.blockquote, .sidebar { |
| 190 | /* Override default.css version with our accent colors. */ |
| 191 | background-color: rgba(65, 131, 196, 0.1); |
| 192 | border-left-color: #4183c4; |
| 193 | } |
| 194 | |
| 195 | /* Mark inline code fragments in the near-universal manner pioneered by |
| 196 | * Stack Overflow, then picked up by approximately everyone, including |
| 197 | * us, now. |
| 198 |
+32
| --- src/default.css | ||
| +++ src/default.css | ||
| @@ -1532,10 +1532,34 @@ | ||
| 1532 | 1532 | blockquote.file-content { |
| 1533 | 1533 | /* file content block in the /file page */ |
| 1534 | 1534 | margin: 0 1em; |
| 1535 | 1535 | } |
| 1536 | 1536 | |
| 1537 | +/* Generic sidebar styling inherited by skins that don't make their own | |
| 1538 | + * arrangements. */ | |
| 1539 | +.markdown blockquote, p.blockquote, .sidebar { | |
| 1540 | + background-color: rgba(0, 0, 0, 0.05); | |
| 1541 | + border-left: 3px solid #777; | |
| 1542 | + padding: 0.1em 1em; | |
| 1543 | +} | |
| 1544 | +.sidebar { | |
| 1545 | + font-size: 90%; | |
| 1546 | +} | |
| 1547 | +.sidebar { | |
| 1548 | + /* Generic form that can be applied to any block element. */ | |
| 1549 | + font-size: 0.9em; | |
| 1550 | +} | |
| 1551 | +div.sidebar { | |
| 1552 | + /* Special exception for div-type sidebars, where there is no p | |
| 1553 | + * wrapper inside to give us the extra padding we want. */ | |
| 1554 | + padding: 1em; | |
| 1555 | +} | |
| 1556 | +div.sidebar:not(.no-label):before { | |
| 1557 | + content: "Sidebar: "; | |
| 1558 | + font-weight: bold; | |
| 1559 | +} | |
| 1560 | + | |
| 1537 | 1561 | |
| 1538 | 1562 | /** |
| 1539 | 1563 | Circular "help" buttons intended to be placed to the right of |
| 1540 | 1564 | another element and hold text text for it. These typically get |
| 1541 | 1565 | initialized automatically at page startup via |
| @@ -1852,12 +1876,20 @@ | ||
| 1852 | 1876 | /* Objects in the "desktoponly" class are invisible on mobile */ |
| 1853 | 1877 | @media screen and (max-width: 600px) { |
| 1854 | 1878 | .desktoponly { |
| 1855 | 1879 | display: none; |
| 1856 | 1880 | } |
| 1881 | +} | |
| 1882 | +/* Float sidebars to the right of the main content only if there's room. */ | |
| 1883 | +@media screen and (min-width: 600px) { | |
| 1884 | + .sidebar { | |
| 1885 | + float: right; | |
| 1886 | + max-width: 33%; | |
| 1887 | + margin-left: 1em; | |
| 1888 | + } | |
| 1857 | 1889 | } |
| 1858 | 1890 | /* Objects in the "wideonly" class are invisible only on wide-screen desktops */ |
| 1859 | 1891 | @media screen and (max-width: 1200px) { |
| 1860 | 1892 | .wideonly { |
| 1861 | 1893 | display: none; |
| 1862 | 1894 | } |
| 1863 | 1895 | } |
| 1864 | 1896 |
| --- src/default.css | |
| +++ src/default.css | |
| @@ -1532,10 +1532,34 @@ | |
| 1532 | blockquote.file-content { |
| 1533 | /* file content block in the /file page */ |
| 1534 | margin: 0 1em; |
| 1535 | } |
| 1536 | |
| 1537 | |
| 1538 | /** |
| 1539 | Circular "help" buttons intended to be placed to the right of |
| 1540 | another element and hold text text for it. These typically get |
| 1541 | initialized automatically at page startup via |
| @@ -1852,12 +1876,20 @@ | |
| 1852 | /* Objects in the "desktoponly" class are invisible on mobile */ |
| 1853 | @media screen and (max-width: 600px) { |
| 1854 | .desktoponly { |
| 1855 | display: none; |
| 1856 | } |
| 1857 | } |
| 1858 | /* Objects in the "wideonly" class are invisible only on wide-screen desktops */ |
| 1859 | @media screen and (max-width: 1200px) { |
| 1860 | .wideonly { |
| 1861 | display: none; |
| 1862 | } |
| 1863 | } |
| 1864 |
| --- src/default.css | |
| +++ src/default.css | |
| @@ -1532,10 +1532,34 @@ | |
| 1532 | blockquote.file-content { |
| 1533 | /* file content block in the /file page */ |
| 1534 | margin: 0 1em; |
| 1535 | } |
| 1536 | |
| 1537 | /* Generic sidebar styling inherited by skins that don't make their own |
| 1538 | * arrangements. */ |
| 1539 | .markdown blockquote, p.blockquote, .sidebar { |
| 1540 | background-color: rgba(0, 0, 0, 0.05); |
| 1541 | border-left: 3px solid #777; |
| 1542 | padding: 0.1em 1em; |
| 1543 | } |
| 1544 | .sidebar { |
| 1545 | font-size: 90%; |
| 1546 | } |
| 1547 | .sidebar { |
| 1548 | /* Generic form that can be applied to any block element. */ |
| 1549 | font-size: 0.9em; |
| 1550 | } |
| 1551 | div.sidebar { |
| 1552 | /* Special exception for div-type sidebars, where there is no p |
| 1553 | * wrapper inside to give us the extra padding we want. */ |
| 1554 | padding: 1em; |
| 1555 | } |
| 1556 | div.sidebar:not(.no-label):before { |
| 1557 | content: "Sidebar: "; |
| 1558 | font-weight: bold; |
| 1559 | } |
| 1560 | |
| 1561 | |
| 1562 | /** |
| 1563 | Circular "help" buttons intended to be placed to the right of |
| 1564 | another element and hold text text for it. These typically get |
| 1565 | initialized automatically at page startup via |
| @@ -1852,12 +1876,20 @@ | |
| 1876 | /* Objects in the "desktoponly" class are invisible on mobile */ |
| 1877 | @media screen and (max-width: 600px) { |
| 1878 | .desktoponly { |
| 1879 | display: none; |
| 1880 | } |
| 1881 | } |
| 1882 | /* Float sidebars to the right of the main content only if there's room. */ |
| 1883 | @media screen and (min-width: 600px) { |
| 1884 | .sidebar { |
| 1885 | float: right; |
| 1886 | max-width: 33%; |
| 1887 | margin-left: 1em; |
| 1888 | } |
| 1889 | } |
| 1890 | /* Objects in the "wideonly" class are invisible only on wide-screen desktops */ |
| 1891 | @media screen and (max-width: 1200px) { |
| 1892 | .wideonly { |
| 1893 | display: none; |
| 1894 | } |
| 1895 | } |
| 1896 |