refactor extract syntax highlighting CSS into separate file

Move all syntax highlighting colour rules from styles.css into a dedicated syntax-theme.css file. This separates the colour theme from structural styles, making it easy to swap themes without touching the main stylesheet. The new file is served as a separate <link> tag via the static handler.

Commit
768d1e8d5c8547f18d88becae4ff00be0facdcbf
Author
Marius Peter <dev@marius-peter.com>
Author date
Committer
Marius Peter <dev@marius-peter.com>
Committer date
Changed files
lib/static/styles.css
index 052e6496..ef46379e 100644..100644
@@ -1261,122 +1261,3 @@
1261 1261 .error-nav {
1262 1262 margin-top: 2em;
1263 1263 }
1264 Removed:
1265 Removed: /* ==========================================================================
1266 Removed: Syntax highlighting (server-rendered via hilite + TextMate grammars)
1267 Removed: ========================================================================== */
1268 Removed:
1269 Removed: /* Keywords: control flow, storage, operators */
1270 Removed: [class*="-keyword"] {
1271 Removed: color: #ff7b72;
1272 Removed: }
1273 Removed:
1274 Removed: [class*="-storage-type"],
1275 Removed: [class*="-storage-modifier"] {
1276 Removed: color: #ff7b72;
1277 Removed: }
1278 Removed:
1279 Removed: /* Strings */
1280 Removed: [class*="-string"] {
1281 Removed: color: #a5d6ff;
1282 Removed: }
1283 Removed:
1284 Removed: /* Comments */
1285 Removed: [class*="-comment"] {
1286 Removed: color: #8b949e;
1287 Removed: font-style: italic;
1288 Removed: }
1289 Removed:
1290 Removed: /* Constants: numbers, booleans, language constants */
1291 Removed: [class*="-constant-numeric"],
1292 Removed: [class*="-constant-language"] {
1293 Removed: color: #79c0ff;
1294 Removed: }
1295 Removed:
1296 Removed: [class*="-constant-character"] {
1297 Removed: color: #a5d6ff;
1298 Removed: }
1299 Removed:
1300 Removed: /* Entity names: functions, classes, types, tags */
1301 Removed: [class*="-entity-name-function"],
1302 Removed: [class*="-entity-name-type"] {
1303 Removed: color: #d2a8ff;
1304 Removed: }
1305 Removed:
1306 Removed: [class*="-entity-name-tag"] {
1307 Removed: color: #7ee787;
1308 Removed: }
1309 Removed:
1310 Removed: [class*="-entity-other-attribute-name"] {
1311 Removed: color: #79c0ff;
1312 Removed: }
1313 Removed:
1314 Removed: /* Support: built-in functions, types */
1315 Removed: [class*="-support-function"],
1316 Removed: [class*="-support-type"] {
1317 Removed: color: #79c0ff;
1318 Removed: }
1319 Removed:
1320 Removed: [class*="-support-class"] {
1321 Removed: color: #d2a8ff;
1322 Removed: }
1323 Removed:
1324 Removed: /* Variables */
1325 Removed: [class*="-variable-language"],
1326 Removed: [class*="-variable-other-constant"] {
1327 Removed: color: #ffa657;
1328 Removed: }
1329 Removed:
1330 Removed: [class*="-variable-parameter"] {
1331 Removed: color: #ffa657;
1332 Removed: }
1333 Removed:
1334 Removed: /* Punctuation — keep subdued */
1335 Removed: [class*="-punctuation"] {
1336 Removed: color: #c9d1d9;
1337 Removed: }
1338 Removed:
1339 Removed: /* Meta — structural, usually inherits */
1340 Removed: [class*="-meta"] {
1341 Removed: /* no color override — inherits from parent or children */
1342 Removed: }
1343 Removed:
1344 Removed: /* Markup (markdown, HTML) */
1345 Removed: [class*="-markup-heading"] {
1346 Removed: color: #79c0ff;
1347 Removed: font-weight: bold;
1348 Removed: }
1349 Removed:
1350 Removed: [class*="-markup-bold"] {
1351 Removed: font-weight: bold;
1352 Removed: }
1353 Removed:
1354 Removed: [class*="-markup-italic"] {
1355 Removed: font-style: italic;
1356 Removed: }
1357 Removed:
1358 Removed: [class*="-markup-inline-raw"],
1359 Removed: [class*="-markup-fenced-code"] {
1360 Removed: color: #a5d6ff;
1361 Removed: }
1362 Removed:
1363 Removed: [class*="-markup-deleted"] {
1364 Removed: color: #ffa198;
1365 Removed: background-color: rgba(255, 129, 130, 0.1);
1366 Removed: }
1367 Removed:
1368 Removed: [class*="-markup-inserted"] {
1369 Removed: color: #7ee787;
1370 Removed: background-color: rgba(63, 185, 80, 0.1);
1371 Removed: }
1372 Removed:
1373 Removed: /* Diff specific */
1374 Removed: [class*="-punctuation-definition-inserted"],
1375 Removed: [class*="-markup-inserted"] {
1376 Removed: color: #7ee787;
1377 Removed: }
1378 Removed:
1379 Removed: [class*="-punctuation-definition-deleted"],
1380 Removed: [class*="-markup-deleted"] {
1381 Removed: color: #ffa198;
1382 Removed: }
lib/static/syntax-theme.css
index 00000000..af563174 000000..100644
@@ -0,0 +1,122 @@
1 Added: /* ==========================================================================
2 Added: Syntax highlighting theme (server-rendered via hilite + TextMate grammars)
3 Added:
4 Added: Colour palette for source code tokens. Selectors use attribute-contains
5 Added: (class*=) to match hilite's hierarchical scope-based class names in a
6 Added: language-agnostic way.
7 Added: ========================================================================== */
8 Added:
9 Added: /* Keywords: control flow, storage, operators */
10 Added: [class*="-keyword"] {
11 Added: color: #ff7b72;
12 Added: }
13 Added:
14 Added: [class*="-storage-type"],
15 Added: [class*="-storage-modifier"] {
16 Added: color: #ff7b72;
17 Added: }
18 Added:
19 Added: /* Strings */
20 Added: [class*="-string"] {
21 Added: color: #a5d6ff;
22 Added: }
23 Added:
24 Added: /* Comments */
25 Added: [class*="-comment"] {
26 Added: color: #8b949e;
27 Added: font-style: italic;
28 Added: }
29 Added:
30 Added: /* Constants: numbers, booleans, language constants */
31 Added: [class*="-constant-numeric"],
32 Added: [class*="-constant-language"] {
33 Added: color: #79c0ff;
34 Added: }
35 Added:
36 Added: [class*="-constant-character"] {
37 Added: color: #a5d6ff;
38 Added: }
39 Added:
40 Added: /* Entity names: functions, classes, types, tags */
41 Added: [class*="-entity-name-function"],
42 Added: [class*="-entity-name-type"] {
43 Added: color: #d2a8ff;
44 Added: }
45 Added:
46 Added: [class*="-entity-name-tag"] {
47 Added: color: #7ee787;
48 Added: }
49 Added:
50 Added: [class*="-entity-other-attribute-name"] {
51 Added: color: #79c0ff;
52 Added: }
53 Added:
54 Added: /* Support: built-in functions, types */
55 Added: [class*="-support-function"],
56 Added: [class*="-support-type"] {
57 Added: color: #79c0ff;
58 Added: }
59 Added:
60 Added: [class*="-support-class"] {
61 Added: color: #d2a8ff;
62 Added: }
63 Added:
64 Added: /* Variables */
65 Added: [class*="-variable-language"],
66 Added: [class*="-variable-other-constant"] {
67 Added: color: #ffa657;
68 Added: }
69 Added:
70 Added: [class*="-variable-parameter"] {
71 Added: color: #ffa657;
72 Added: }
73 Added:
74 Added: /* Punctuation — keep subdued */
75 Added: [class*="-punctuation"] {
76 Added: color: #c9d1d9;
77 Added: }
78 Added:
79 Added: /* Meta — structural, usually inherits */
80 Added: [class*="-meta"] {
81 Added: /* no color override — inherits from parent or children */
82 Added: }
83 Added:
84 Added: /* Markup (markdown, HTML) */
85 Added: [class*="-markup-heading"] {
86 Added: color: #79c0ff;
87 Added: font-weight: bold;
88 Added: }
89 Added:
90 Added: [class*="-markup-bold"] {
91 Added: font-weight: bold;
92 Added: }
93 Added:
94 Added: [class*="-markup-italic"] {
95 Added: font-style: italic;
96 Added: }
97 Added:
98 Added: [class*="-markup-inline-raw"],
99 Added: [class*="-markup-fenced-code"] {
100 Added: color: #a5d6ff;
101 Added: }
102 Added:
103 Added: [class*="-markup-deleted"] {
104 Added: color: #ffa198;
105 Added: background-color: rgba(255, 129, 130, 0.1);
106 Added: }
107 Added:
108 Added: [class*="-markup-inserted"] {
109 Added: color: #7ee787;
110 Added: background-color: rgba(63, 185, 80, 0.1);
111 Added: }
112 Added:
113 Added: /* Diff specific */
114 Added: [class*="-punctuation-definition-inserted"],
115 Added: [class*="-markup-inserted"] {
116 Added: color: #7ee787;
117 Added: }
118 Added:
119 Added: [class*="-punctuation-definition-deleted"],
120 Added: [class*="-markup-deleted"] {
121 Added: color: #ffa198;
122 Added: }
lib/views/layout.ml
index 3ce12367..5f670983 100644..100644
@@ -40,6 +40,7 @@
40 40 let stylesheets =
41 41 [
42 42 "/static/styles.css";
43 Added: "/static/syntax-theme.css";
43 44 ]
44 45
45 46 let head page_title =