@udx/md2html 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +219 -0
- package/index.js +738 -0
- package/package.json +48 -0
- package/static/chapter-navigation.css +213 -0
- package/static/scripts.js +410 -0
- package/static/styles.css +484 -0
- package/static/view.hbs +341 -0
|
@@ -0,0 +1,484 @@
|
|
|
1
|
+
@media print {
|
|
2
|
+
pre, pre code {
|
|
3
|
+
white-space: pre-wrap !important;
|
|
4
|
+
overflow-x: hidden !important;
|
|
5
|
+
page-break-inside: avoid;
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
body {
|
|
9
|
+
font-size: 18px !important;
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
img {
|
|
13
|
+
max-width: 100% !important;
|
|
14
|
+
height: auto !important;
|
|
15
|
+
page-break-inside: avoid;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
h1, h2, h3, h4, h5, h6 {
|
|
19
|
+
page-break-after: avoid;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
p, h2, h3 {
|
|
23
|
+
orphans: 3;
|
|
24
|
+
widows: 3;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
.content-container {
|
|
28
|
+
max-width: 100% !important;
|
|
29
|
+
width: 100% !important;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
article {
|
|
33
|
+
width: 100% !important;
|
|
34
|
+
max-width: 100% !important;
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
/* Base document styles */
|
|
39
|
+
body {
|
|
40
|
+
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
41
|
+
line-height: 1.6;
|
|
42
|
+
color: #333;
|
|
43
|
+
background-color: white;
|
|
44
|
+
margin: 0;
|
|
45
|
+
padding: 0;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
.content-container {
|
|
49
|
+
width: 100%;
|
|
50
|
+
max-width: 768px;
|
|
51
|
+
margin: 0 auto;
|
|
52
|
+
padding: 2rem;
|
|
53
|
+
font-size: 18px !important;
|
|
54
|
+
/* Magazine-style container */
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
/* Fix for Safari which doesn't support :has */
|
|
58
|
+
html:not(:has(details[open])) {
|
|
59
|
+
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
/* Core typography fixes that tailwind sometimes doesn't handle well */
|
|
63
|
+
.prose p {
|
|
64
|
+
margin-top: 0 !important;
|
|
65
|
+
margin-bottom: 0 !important;
|
|
66
|
+
font-size: 18px !important;
|
|
67
|
+
line-height: 1.6 !important;
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
.prose p + p {
|
|
71
|
+
margin-top: 1.2em !important;
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
.prose h1 + p, .prose h2 + p, .prose h3 + p, .prose h4 + p, .prose h5 + p, .prose h6 + p {
|
|
75
|
+
margin-top: 1em !important;
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
/* List styling */
|
|
79
|
+
.prose ul, .prose ol {
|
|
80
|
+
padding-left: 2rem !important;
|
|
81
|
+
margin-top: 1.2em !important;
|
|
82
|
+
margin-bottom: 2.2em !important;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
.prose ul ul, .prose ol ol, .prose ul ol, .prose ol ul {
|
|
86
|
+
margin-top: 0.5em !important;
|
|
87
|
+
margin-bottom: 0.5em !important;
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
.prose li {
|
|
91
|
+
font-size: 18px !important;
|
|
92
|
+
margin-bottom: 0.5em !important;
|
|
93
|
+
line-height: 1.6 !important;
|
|
94
|
+
position: relative !important;
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
.prose li::marker {
|
|
98
|
+
color: #666 !important;
|
|
99
|
+
font-weight: 600 !important;
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
/* Ensure nested lists under a numbered list have proper spacing */
|
|
103
|
+
.prose ol > li > ul, .prose ol > li > ol {
|
|
104
|
+
margin-top: 0.5em !important;
|
|
105
|
+
margin-bottom: 0.5em !important;
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
/* Give some extra padding after a list */
|
|
109
|
+
.prose ul + p, .prose ol + p, .prose ul + pre, .prose ol + pre {
|
|
110
|
+
margin-top: 2em !important;
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
/* Heading sizes with strong important overrides */
|
|
114
|
+
.prose h1 {
|
|
115
|
+
font-size: 64px !important;
|
|
116
|
+
margin-top: 3rem !important;
|
|
117
|
+
margin-bottom: 2rem !important;
|
|
118
|
+
font-weight: 700 !important;
|
|
119
|
+
line-height: 1.2 !important;
|
|
120
|
+
}
|
|
121
|
+
|
|
122
|
+
.prose h2 {
|
|
123
|
+
font-size: 48px !important;
|
|
124
|
+
margin-top: 2.5rem !important;
|
|
125
|
+
margin-bottom: 1.5rem !important;
|
|
126
|
+
font-weight: 600 !important;
|
|
127
|
+
line-height: 1.3 !important;
|
|
128
|
+
}
|
|
129
|
+
|
|
130
|
+
.prose h3 {
|
|
131
|
+
font-size: 36px !important;
|
|
132
|
+
margin-top: 2.2rem !important;
|
|
133
|
+
margin-bottom: 1.2rem !important;
|
|
134
|
+
font-weight: 600 !important;
|
|
135
|
+
line-height: 1.4 !important;
|
|
136
|
+
}
|
|
137
|
+
|
|
138
|
+
.prose h4 {
|
|
139
|
+
font-size: 28px !important;
|
|
140
|
+
margin-top: 2rem !important;
|
|
141
|
+
margin-bottom: 1rem !important;
|
|
142
|
+
font-weight: 600 !important;
|
|
143
|
+
line-height: 1.4 !important;
|
|
144
|
+
}
|
|
145
|
+
|
|
146
|
+
.prose h5 {
|
|
147
|
+
font-size: 22px !important;
|
|
148
|
+
margin-top: 2rem !important;
|
|
149
|
+
margin-bottom: 1rem !important;
|
|
150
|
+
font-weight: 600 !important;
|
|
151
|
+
line-height: 1.4 !important;
|
|
152
|
+
}
|
|
153
|
+
|
|
154
|
+
.prose h6 {
|
|
155
|
+
font-size: 18px !important;
|
|
156
|
+
margin-top: 1.8rem !important;
|
|
157
|
+
margin-bottom: 0.8rem !important;
|
|
158
|
+
font-weight: 600 !important;
|
|
159
|
+
line-height: 1.4 !important;
|
|
160
|
+
}
|
|
161
|
+
|
|
162
|
+
|
|
163
|
+
/* Code elements get 16px */
|
|
164
|
+
code[style*="font-size"], pre[style*="font-size"], .language-bash[style*="font-size"] {
|
|
165
|
+
font-size: 16px !important;
|
|
166
|
+
}
|
|
167
|
+
|
|
168
|
+
/* Blockquotes */
|
|
169
|
+
blockquote {
|
|
170
|
+
margin: 2em 0;
|
|
171
|
+
padding: 1em 1.5em;
|
|
172
|
+
border-left: 4px solid #e2e8f0;
|
|
173
|
+
background-color: #f8fafc;
|
|
174
|
+
font-style: italic;
|
|
175
|
+
}
|
|
176
|
+
|
|
177
|
+
blockquote p {
|
|
178
|
+
margin: 0.5em 0;
|
|
179
|
+
}
|
|
180
|
+
|
|
181
|
+
blockquote + p {
|
|
182
|
+
margin-top: 2em;
|
|
183
|
+
}
|
|
184
|
+
|
|
185
|
+
/* Enhanced table styling with true full width enforcement */
|
|
186
|
+
.prose table,
|
|
187
|
+
table.w-full,
|
|
188
|
+
article table,
|
|
189
|
+
div table,
|
|
190
|
+
.table-responsive table {
|
|
191
|
+
width: 100% !important;
|
|
192
|
+
min-width: 100% !important;
|
|
193
|
+
max-width: 100% !important;
|
|
194
|
+
margin: 2em 0 !important;
|
|
195
|
+
border-collapse: collapse !important;
|
|
196
|
+
table-layout: fixed !important;
|
|
197
|
+
display: table !important;
|
|
198
|
+
}
|
|
199
|
+
|
|
200
|
+
/* Table wrapper to handle overflow properly */
|
|
201
|
+
.table-responsive,
|
|
202
|
+
div.overflow-x-auto {
|
|
203
|
+
width: 100% !important;
|
|
204
|
+
min-width: 100% !important;
|
|
205
|
+
max-width: 100% !important;
|
|
206
|
+
overflow-x: auto !important;
|
|
207
|
+
margin: 2em 0 !important;
|
|
208
|
+
display: block !important;
|
|
209
|
+
}
|
|
210
|
+
|
|
211
|
+
.prose table th, .prose table td {
|
|
212
|
+
padding: 0.75em 1em !important;
|
|
213
|
+
border: 1px solid rgba(0, 0, 0, 0.1) !important;
|
|
214
|
+
text-align: left !important;
|
|
215
|
+
vertical-align: top !important;
|
|
216
|
+
}
|
|
217
|
+
|
|
218
|
+
.prose table th {
|
|
219
|
+
font-weight: 600 !important;
|
|
220
|
+
background-color: rgba(0, 0, 0, 0.05) !important;
|
|
221
|
+
}
|
|
222
|
+
|
|
223
|
+
/* Grid-based tables for special formatting needs */
|
|
224
|
+
.grid-table {
|
|
225
|
+
display: grid;
|
|
226
|
+
grid-template-columns: auto 1fr 1fr 1fr;
|
|
227
|
+
gap: 0.5em 1em;
|
|
228
|
+
width: 100%;
|
|
229
|
+
margin: 2em 0;
|
|
230
|
+
}
|
|
231
|
+
|
|
232
|
+
.grid-table-cell {
|
|
233
|
+
padding: 0.5em;
|
|
234
|
+
align-self: start;
|
|
235
|
+
}
|
|
236
|
+
|
|
237
|
+
.grid-table-header {
|
|
238
|
+
font-weight: 600;
|
|
239
|
+
}
|
|
240
|
+
|
|
241
|
+
/* Specific formatting for scaling operations tables */
|
|
242
|
+
.scaling-table {
|
|
243
|
+
display: grid;
|
|
244
|
+
grid-template-columns: auto 1fr 1fr 1fr;
|
|
245
|
+
width: 100%;
|
|
246
|
+
margin: 2em 0;
|
|
247
|
+
gap: 0.75em;
|
|
248
|
+
}
|
|
249
|
+
|
|
250
|
+
.scaling-table > div {
|
|
251
|
+
padding: 0.5em;
|
|
252
|
+
}
|
|
253
|
+
|
|
254
|
+
.scaling-item {
|
|
255
|
+
font-weight: 600;
|
|
256
|
+
}
|
|
257
|
+
|
|
258
|
+
.scaling-compare {
|
|
259
|
+
color: rgba(0, 0, 0, 0.7);
|
|
260
|
+
}
|
|
261
|
+
|
|
262
|
+
/* Code blocks with proper contrast */
|
|
263
|
+
.prose pre {
|
|
264
|
+
background-color: rgba(0, 0, 0, 0.8) !important;
|
|
265
|
+
margin: 2em 0 !important;
|
|
266
|
+
padding: 1.5em !important;
|
|
267
|
+
border-radius: 0.5em !important;
|
|
268
|
+
overflow-x: auto !important;
|
|
269
|
+
position: relative !important;
|
|
270
|
+
}
|
|
271
|
+
|
|
272
|
+
/* Fix for inline code blocks to ensure visibility with proper contrast */
|
|
273
|
+
.prose :not(pre) > code {
|
|
274
|
+
font-family: Monaco, Consolas, "Courier New", monospace !important;
|
|
275
|
+
font-size: 16px !important;
|
|
276
|
+
background-color: rgba(0, 0, 0, 0.05) !important;
|
|
277
|
+
color: #333 !important;
|
|
278
|
+
padding: 0.2em 0.4em !important;
|
|
279
|
+
border-radius: 0.25em !important;
|
|
280
|
+
font-weight: 500 !important;
|
|
281
|
+
white-space: nowrap !important;
|
|
282
|
+
}
|
|
283
|
+
|
|
284
|
+
/* Code within pre blocks should have proper contrast */
|
|
285
|
+
.prose pre code {
|
|
286
|
+
font-family: Monaco, Consolas, "Courier New", monospace !important;
|
|
287
|
+
font-size: 16px !important;
|
|
288
|
+
color: #f8f8f2 !important;
|
|
289
|
+
background-color: transparent !important;
|
|
290
|
+
padding: 0 !important;
|
|
291
|
+
border-radius: 0 !important;
|
|
292
|
+
white-space: pre !important;
|
|
293
|
+
}
|
|
294
|
+
|
|
295
|
+
/* Code block copy button */
|
|
296
|
+
.copy-button {
|
|
297
|
+
position: absolute;
|
|
298
|
+
top: 0.5em;
|
|
299
|
+
right: 0.5em;
|
|
300
|
+
padding: 0.25em 0.5em;
|
|
301
|
+
background-color: rgba(255, 255, 255, 0.1);
|
|
302
|
+
color: white;
|
|
303
|
+
border: none;
|
|
304
|
+
border-radius: 0.25em;
|
|
305
|
+
cursor: pointer;
|
|
306
|
+
font-size: 0.8em;
|
|
307
|
+
transition: background-color 0.2s;
|
|
308
|
+
opacity: 0;
|
|
309
|
+
}
|
|
310
|
+
|
|
311
|
+
.copy-button:hover {
|
|
312
|
+
background-color: rgba(255, 255, 255, 0.2);
|
|
313
|
+
}
|
|
314
|
+
|
|
315
|
+
pre:hover .copy-button {
|
|
316
|
+
opacity: 1;
|
|
317
|
+
}
|
|
318
|
+
|
|
319
|
+
/* File type badge */
|
|
320
|
+
.file-type-badge {
|
|
321
|
+
position: absolute;
|
|
322
|
+
top: 0.5em;
|
|
323
|
+
right: 0.5em;
|
|
324
|
+
padding: 0.25em 0.5em;
|
|
325
|
+
background-color: rgba(0, 0, 0, 0.5);
|
|
326
|
+
color: white;
|
|
327
|
+
border-radius: 0.25em;
|
|
328
|
+
font-size: 0.8em;
|
|
329
|
+
font-weight: bold;
|
|
330
|
+
}
|
|
331
|
+
|
|
332
|
+
pre:has(.file-type-badge) .copy-button {
|
|
333
|
+
top: 2.5em;
|
|
334
|
+
}
|
|
335
|
+
|
|
336
|
+
/* Hide "code" label when no specific language is set */
|
|
337
|
+
.file-type-badge.code {
|
|
338
|
+
display: none;
|
|
339
|
+
}
|
|
340
|
+
|
|
341
|
+
/* Image handling */
|
|
342
|
+
figure {
|
|
343
|
+
margin-top: 2em;
|
|
344
|
+
margin-bottom: 2em;
|
|
345
|
+
text-align: center;
|
|
346
|
+
}
|
|
347
|
+
|
|
348
|
+
img {
|
|
349
|
+
max-width: 100%;
|
|
350
|
+
height: auto;
|
|
351
|
+
border-radius: 0.25em;
|
|
352
|
+
margin-top: 2em;
|
|
353
|
+
margin-bottom: 0.5em;
|
|
354
|
+
}
|
|
355
|
+
|
|
356
|
+
figcaption {
|
|
357
|
+
margin-top: 0.5em;
|
|
358
|
+
font-size: 0.9em;
|
|
359
|
+
color: #64748b;
|
|
360
|
+
font-style: italic;
|
|
361
|
+
}
|
|
362
|
+
|
|
363
|
+
/* Alt text is visually hidden but accessible for screen readers */
|
|
364
|
+
.visually-hidden {
|
|
365
|
+
position: absolute;
|
|
366
|
+
width: 1px;
|
|
367
|
+
height: 1px;
|
|
368
|
+
margin: -1px;
|
|
369
|
+
padding: 0;
|
|
370
|
+
overflow: hidden;
|
|
371
|
+
clip: rect(0, 0, 0, 0);
|
|
372
|
+
border: 0;
|
|
373
|
+
}
|
|
374
|
+
|
|
375
|
+
/* Imgix handling */
|
|
376
|
+
img[src*="imgix.net"] {
|
|
377
|
+
max-width: 100%;
|
|
378
|
+
height: auto;
|
|
379
|
+
}
|
|
380
|
+
|
|
381
|
+
/* Links */
|
|
382
|
+
a {
|
|
383
|
+
color: #3182ce;
|
|
384
|
+
text-decoration: none;
|
|
385
|
+
}
|
|
386
|
+
|
|
387
|
+
a:hover {
|
|
388
|
+
text-decoration: underline;
|
|
389
|
+
}
|
|
390
|
+
|
|
391
|
+
/* Footer style */
|
|
392
|
+
.mt-16 {
|
|
393
|
+
margin-top: 4rem;
|
|
394
|
+
}
|
|
395
|
+
|
|
396
|
+
.pt-8 {
|
|
397
|
+
padding-top: 2rem;
|
|
398
|
+
}
|
|
399
|
+
|
|
400
|
+
/* Ultra-specific heading overrides that will take precedence over any inheritance */
|
|
401
|
+
.prose h1, h1, article h1, body h1, div h1, *:not(.not-prose) h1, * h1 {
|
|
402
|
+
font-size: 56px !important;
|
|
403
|
+
margin-top: 3rem !important;
|
|
404
|
+
margin-bottom: 2rem !important;
|
|
405
|
+
font-weight: 800 !important;
|
|
406
|
+
line-height: 1.1 !important;
|
|
407
|
+
color: #000 !important;
|
|
408
|
+
}
|
|
409
|
+
|
|
410
|
+
.prose h2, h2, article h2, body h2, div h2 {
|
|
411
|
+
font-size: 36px !important;
|
|
412
|
+
margin-top: 2.5rem !important;
|
|
413
|
+
margin-bottom: 1.5rem !important;
|
|
414
|
+
font-weight: 600 !important;
|
|
415
|
+
line-height: 1.3 !important;
|
|
416
|
+
}
|
|
417
|
+
|
|
418
|
+
.prose h3, h3, article h3, body h3, div h3 {
|
|
419
|
+
font-size: 32px !important;
|
|
420
|
+
margin-top: 2.2rem !important;
|
|
421
|
+
margin-bottom: 1.2rem !important;
|
|
422
|
+
font-weight: 600 !important;
|
|
423
|
+
line-height: 1.4 !important;
|
|
424
|
+
}
|
|
425
|
+
|
|
426
|
+
.prose h4, h4, article h4, body h4, div h4, *:not(.not-prose) h4, * h4 {
|
|
427
|
+
font-size: 24px !important;
|
|
428
|
+
margin-top: 2rem !important;
|
|
429
|
+
margin-bottom: 1rem !important;
|
|
430
|
+
font-weight: 600 !important;
|
|
431
|
+
line-height: 1.4 !important;
|
|
432
|
+
color: #333 !important;
|
|
433
|
+
}
|
|
434
|
+
|
|
435
|
+
.prose h5, h5, article h5, body h5, div h5 {
|
|
436
|
+
font-size: 22px !important;
|
|
437
|
+
margin-top: 2rem !important;
|
|
438
|
+
margin-bottom: 1rem !important;
|
|
439
|
+
font-weight: 600 !important;
|
|
440
|
+
line-height: 1.4 !important;
|
|
441
|
+
}
|
|
442
|
+
|
|
443
|
+
.prose h6, h6, article h6, body h6, div h6 {
|
|
444
|
+
font-size: 18px !important;
|
|
445
|
+
margin-top: 1.8rem !important;
|
|
446
|
+
margin-bottom: 0.8rem !important;
|
|
447
|
+
font-weight: 600 !important;
|
|
448
|
+
line-height: 1.4 !important;
|
|
449
|
+
}
|
|
450
|
+
|
|
451
|
+
.border-t {
|
|
452
|
+
border-top: 1px solid #E2E8F0;
|
|
453
|
+
}
|
|
454
|
+
|
|
455
|
+
.border-gray-200 {
|
|
456
|
+
border-color: #E2E8F0;
|
|
457
|
+
}
|
|
458
|
+
|
|
459
|
+
.text-sm {
|
|
460
|
+
font-size: 0.875rem;
|
|
461
|
+
}
|
|
462
|
+
|
|
463
|
+
.text-gray-500 {
|
|
464
|
+
color: #718096;
|
|
465
|
+
}
|
|
466
|
+
|
|
467
|
+
/* Math styles */
|
|
468
|
+
.math-block {
|
|
469
|
+
margin: 2em 0;
|
|
470
|
+
overflow-x: auto;
|
|
471
|
+
padding: 1em;
|
|
472
|
+
background-color: rgba(247, 250, 252, 0.8);
|
|
473
|
+
border-radius: 0.5rem;
|
|
474
|
+
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
|
|
475
|
+
}
|
|
476
|
+
|
|
477
|
+
.math-inline {
|
|
478
|
+
padding: 0 0.2em;
|
|
479
|
+
}
|
|
480
|
+
|
|
481
|
+
/* Increase specificity for MathJax elements */
|
|
482
|
+
.MathJax {
|
|
483
|
+
font-size: 1.1em !important;
|
|
484
|
+
}
|