vimd 0.1.10 → 0.1.12

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.
@@ -1,35 +1,541 @@
1
- /* Minimal Theme - Simple and clean */
1
+ /*
2
+ * Minimal Theme for vimd
3
+ * Clean, understated styling inspired by Buttondown
4
+ * https://gist.github.com/ryangray/1882525
5
+ * MIT License
6
+ */
7
+
8
+ /* ============================================
9
+ Base Styles
10
+ ============================================ */
11
+ html {
12
+ background-color: #fff;
13
+ }
14
+
2
15
  body {
3
- font-family: system-ui, -apple-system, sans-serif;
16
+ font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
17
+ font-size: 16px;
4
18
  line-height: 1.6;
5
- color: #000;
6
- background: #fff;
19
+ color: #222;
20
+ background-color: #fff;
7
21
  max-width: 800px;
8
22
  margin: 0 auto;
9
23
  padding: 2rem;
10
24
  }
11
25
 
12
- h1, h2, h3, h4, h5, h6 {
26
+ /* ============================================
27
+ Typography
28
+ ============================================ */
29
+ body h1,
30
+ body h2,
31
+ body h3,
32
+ body h4,
33
+ body h5,
34
+ body h6 {
13
35
  margin-top: 1.5em;
14
36
  margin-bottom: 0.5em;
15
37
  font-weight: 600;
38
+ line-height: 1.3;
39
+ color: #111;
40
+ }
41
+
42
+ body h1 {
43
+ font-size: 2em;
44
+ margin-top: 0;
45
+ border-bottom: 1px solid #ddd;
46
+ padding-bottom: 0.3em;
47
+ }
48
+
49
+ body h2 {
50
+ font-size: 1.5em;
51
+ border-bottom: 1px solid #eee;
52
+ padding-bottom: 0.2em;
53
+ }
54
+
55
+ body h3 {
56
+ font-size: 1.25em;
57
+ }
58
+
59
+ body h4 {
60
+ font-size: 1em;
61
+ }
62
+
63
+ body h5 {
64
+ font-size: 0.9em;
65
+ }
66
+
67
+ body h6 {
68
+ font-size: 0.85em;
69
+ color: #555;
70
+ }
71
+
72
+ body p {
73
+ margin-top: 0;
74
+ margin-bottom: 1em;
75
+ }
76
+
77
+ /* ============================================
78
+ Links
79
+ ============================================ */
80
+ body a {
81
+ color: #333;
82
+ text-decoration: none;
83
+ border-bottom: 1px solid #ccc;
84
+ }
85
+
86
+ body a:hover {
87
+ color: #000;
88
+ border-bottom-color: #333;
89
+ }
90
+
91
+ body a:visited {
92
+ color: #555;
93
+ }
94
+
95
+ /* ============================================
96
+ Lists
97
+ ============================================ */
98
+ body ul,
99
+ body ol {
100
+ margin-top: 0;
101
+ margin-bottom: 1em;
102
+ padding-left: 2em;
103
+ }
104
+
105
+ body li {
106
+ margin-bottom: 0.25em;
107
+ }
108
+
109
+ body li > p {
110
+ margin-bottom: 0.5em;
111
+ }
112
+
113
+ body ul ul,
114
+ body ol ol,
115
+ body ul ol,
116
+ body ol ul {
117
+ margin-top: 0.25em;
118
+ margin-bottom: 0.25em;
119
+ }
120
+
121
+ /* Definition lists */
122
+ body dl {
123
+ margin-top: 0;
124
+ margin-bottom: 1em;
125
+ }
126
+
127
+ body dt {
128
+ font-weight: 600;
129
+ margin-top: 0.5em;
16
130
  }
17
131
 
18
- code {
19
- background: #f5f5f5;
20
- padding: 0.2em 0.4em;
132
+ body dd {
133
+ margin-left: 2em;
134
+ margin-bottom: 0.5em;
135
+ }
136
+
137
+ /* ============================================
138
+ Blockquotes
139
+ ============================================ */
140
+ body blockquote {
141
+ margin: 1em 0;
142
+ padding: 0 0 0 1em;
143
+ border-left: 3px solid #ddd;
144
+ color: #555;
145
+ font-style: italic;
146
+ }
147
+
148
+ body blockquote p {
149
+ margin-bottom: 0.5em;
150
+ }
151
+
152
+ body blockquote p:last-child {
153
+ margin-bottom: 0;
154
+ }
155
+
156
+ /* ============================================
157
+ Code
158
+ ============================================ */
159
+ body code,
160
+ body tt {
161
+ font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
162
+ font-size: 0.9em;
163
+ background-color: #f5f5f5;
164
+ padding: 0.15em 0.4em;
21
165
  border-radius: 3px;
22
- font-family: monospace;
23
166
  }
24
167
 
25
- pre {
26
- background: #f5f5f5;
168
+ body pre {
169
+ font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
170
+ font-size: 0.85em;
171
+ line-height: 1.5;
172
+ background-color: #f5f5f5;
27
173
  padding: 1em;
28
- border-radius: 5px;
174
+ border-radius: 3px;
29
175
  overflow-x: auto;
176
+ margin: 1em 0;
30
177
  }
31
178
 
32
- pre code {
179
+ body pre code {
33
180
  background: none;
34
181
  padding: 0;
182
+ font-size: inherit;
183
+ }
184
+
185
+ /* ============================================
186
+ Tables
187
+ ============================================ */
188
+ body table {
189
+ border-collapse: collapse;
190
+ width: 100%;
191
+ margin: 1em 0;
192
+ font-size: 0.95em;
193
+ }
194
+
195
+ body th,
196
+ body td {
197
+ padding: 0.5em 0.75em;
198
+ text-align: left;
199
+ }
200
+
201
+ body th {
202
+ font-weight: 600;
203
+ border-bottom: 2px solid #333;
204
+ }
205
+
206
+ body td {
207
+ border-bottom: 1px solid #ddd;
208
+ }
209
+
210
+ body tr:hover {
211
+ background-color: #f9f9f9;
212
+ }
213
+
214
+ /* ============================================
215
+ Horizontal Rules
216
+ ============================================ */
217
+ body hr {
218
+ border: none;
219
+ border-top: 1px solid #ddd;
220
+ margin: 2em 0;
221
+ }
222
+
223
+ /* ============================================
224
+ Images
225
+ ============================================ */
226
+ body img {
227
+ max-width: 100%;
228
+ height: auto;
229
+ display: block;
230
+ margin: 1em auto;
231
+ }
232
+
233
+ body figure {
234
+ margin: 1.5em 0;
235
+ text-align: center;
236
+ }
237
+
238
+ body figure img {
239
+ margin: 0 auto 0.5em;
240
+ }
241
+
242
+ body figcaption {
243
+ font-size: 0.9em;
244
+ color: #555;
245
+ font-style: italic;
246
+ }
247
+
248
+ /* ============================================
249
+ Table of Contents (Pandoc)
250
+ ============================================ */
251
+ nav#TOC {
252
+ background-color: #f9f9f9;
253
+ border: 1px solid #ddd;
254
+ padding: 1em 1.5em;
255
+ margin-bottom: 1.5em;
256
+ }
257
+
258
+ nav#TOC > ul {
259
+ margin: 0;
260
+ padding-left: 0;
261
+ list-style: none;
262
+ }
263
+
264
+ nav#TOC ul {
265
+ padding-left: 1.5em;
266
+ }
267
+
268
+ nav#TOC li {
269
+ margin: 0.3em 0;
270
+ }
271
+
272
+ nav#TOC a {
273
+ color: #333;
274
+ border-bottom: none;
275
+ }
276
+
277
+ nav#TOC a:hover {
278
+ color: #000;
279
+ border-bottom: 1px solid #333;
280
+ }
281
+
282
+ /* ============================================
283
+ Footnotes (Pandoc)
284
+ ============================================ */
285
+ .footnotes {
286
+ margin-top: 2em;
287
+ padding-top: 1em;
288
+ border-top: 1px solid #ddd;
289
+ font-size: 0.9em;
290
+ }
291
+
292
+ .footnotes hr {
293
+ display: none;
294
+ }
295
+
296
+ .footnotes ol {
297
+ padding-left: 1.5em;
298
+ }
299
+
300
+ .footnotes li {
301
+ margin-bottom: 0.5em;
302
+ }
303
+
304
+ .footnote-ref {
305
+ font-size: 0.75em;
306
+ vertical-align: super;
307
+ text-decoration: none;
308
+ border-bottom: none;
309
+ }
310
+
311
+ .footnote-back {
312
+ border-bottom: none;
313
+ margin-left: 0.3em;
314
+ }
315
+
316
+ /* ============================================
317
+ Pandoc Syntax Highlighting - Monochrome
318
+ ============================================ */
319
+ div.sourceCode {
320
+ background-color: #f5f5f5;
321
+ border-radius: 3px;
322
+ overflow: auto;
323
+ }
324
+
325
+ pre.sourceCode {
326
+ margin: 0;
327
+ padding: 1em;
328
+ }
329
+
330
+ code.sourceCode {
331
+ background: transparent;
332
+ color: #222;
333
+ }
334
+
335
+ /* Comments - gray italic */
336
+ code.sourceCode span.co,
337
+ .sourceCode .co {
338
+ color: #777;
339
+ font-style: italic;
340
+ }
341
+
342
+ /* Strings - slightly darker */
343
+ code.sourceCode span.st,
344
+ code.sourceCode span.ch,
345
+ code.sourceCode span.vs,
346
+ .sourceCode .st,
347
+ .sourceCode .ch,
348
+ .sourceCode .vs {
349
+ color: #444;
350
+ }
351
+
352
+ /* Keywords - bold */
353
+ code.sourceCode span.kw,
354
+ code.sourceCode span.cf,
355
+ .sourceCode .kw,
356
+ .sourceCode .cf {
357
+ color: #222;
358
+ font-weight: bold;
359
+ }
360
+
361
+ /* Numbers */
362
+ code.sourceCode span.dv,
363
+ code.sourceCode span.bn,
364
+ code.sourceCode span.fl,
365
+ code.sourceCode span.cn,
366
+ .sourceCode .dv,
367
+ .sourceCode .bn,
368
+ .sourceCode .fl,
369
+ .sourceCode .cn {
370
+ color: #333;
371
+ }
372
+
373
+ /* Functions */
374
+ code.sourceCode span.fu,
375
+ code.sourceCode span.bu,
376
+ .sourceCode .fu,
377
+ .sourceCode .bu {
378
+ color: #222;
379
+ }
380
+
381
+ /* Variables */
382
+ code.sourceCode span.va,
383
+ .sourceCode .va {
384
+ color: #333;
385
+ }
386
+
387
+ /* Data types */
388
+ code.sourceCode span.dt,
389
+ .sourceCode .dt {
390
+ color: #222;
391
+ font-weight: bold;
392
+ }
393
+
394
+ /* Operators */
395
+ code.sourceCode span.op,
396
+ .sourceCode .op {
397
+ color: #222;
398
+ }
399
+
400
+ /* Attributes */
401
+ code.sourceCode span.at,
402
+ .sourceCode .at {
403
+ color: #333;
404
+ }
405
+
406
+ /* Preprocessor */
407
+ code.sourceCode span.pp,
408
+ code.sourceCode span.im,
409
+ .sourceCode .pp,
410
+ .sourceCode .im {
411
+ color: #222;
412
+ font-weight: bold;
413
+ }
414
+
415
+ /* Annotations */
416
+ code.sourceCode span.an,
417
+ code.sourceCode span.do,
418
+ .sourceCode .an,
419
+ .sourceCode .do {
420
+ color: #777;
421
+ font-style: italic;
422
+ }
423
+
424
+ /* Errors */
425
+ code.sourceCode span.er,
426
+ code.sourceCode span.al,
427
+ .sourceCode .er,
428
+ .sourceCode .al {
429
+ color: #222;
430
+ font-weight: bold;
431
+ text-decoration: underline;
432
+ }
433
+
434
+ /* ============================================
435
+ Keyboard and Mark
436
+ ============================================ */
437
+ body kbd {
438
+ font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
439
+ font-size: 0.85em;
440
+ padding: 0.15em 0.4em;
441
+ border: 1px solid #ccc;
442
+ border-radius: 3px;
443
+ background-color: #f5f5f5;
444
+ box-shadow: inset 0 -1px 0 #bbb;
445
+ }
446
+
447
+ body mark {
448
+ background-color: #ff9;
449
+ padding: 0.1em 0.2em;
450
+ }
451
+
452
+ /* ============================================
453
+ Strong and Emphasis
454
+ ============================================ */
455
+ body strong,
456
+ body b {
457
+ font-weight: 600;
458
+ }
459
+
460
+ body em,
461
+ body i {
462
+ font-style: italic;
463
+ }
464
+
465
+ /* ============================================
466
+ Selection
467
+ ============================================ */
468
+ ::selection {
469
+ background-color: #b3d4fc;
470
+ color: #000;
471
+ }
472
+
473
+ /* ============================================
474
+ Print Styles
475
+ ============================================ */
476
+ @media print {
477
+ body {
478
+ max-width: 100%;
479
+ padding: 0;
480
+ font-size: 12pt;
481
+ color: #000;
482
+ }
483
+
484
+ body a {
485
+ color: #000;
486
+ border-bottom: none;
487
+ text-decoration: underline;
488
+ }
489
+
490
+ body a[href^="http"]::after {
491
+ content: " (" attr(href) ")";
492
+ font-size: 0.8em;
493
+ color: #555;
494
+ }
495
+
496
+ nav#TOC {
497
+ page-break-after: always;
498
+ }
499
+
500
+ body h2,
501
+ body h3 {
502
+ page-break-after: avoid;
503
+ }
504
+
505
+ body pre,
506
+ body blockquote,
507
+ body table {
508
+ page-break-inside: avoid;
509
+ }
510
+
511
+ .footnote-back {
512
+ display: none;
513
+ }
514
+ }
515
+
516
+ /* ============================================
517
+ Responsive
518
+ ============================================ */
519
+ @media (max-width: 600px) {
520
+ body {
521
+ padding: 1rem;
522
+ font-size: 15px;
523
+ }
524
+
525
+ body h1 {
526
+ font-size: 1.75em;
527
+ }
528
+
529
+ body h2 {
530
+ font-size: 1.35em;
531
+ }
532
+
533
+ body blockquote {
534
+ margin-left: 0;
535
+ margin-right: 0;
536
+ }
537
+
538
+ body table {
539
+ font-size: 0.9em;
540
+ }
35
541
  }
@@ -1,84 +1,669 @@
1
- /* Technical Theme - API documentation style */
2
- body {
3
- font-family: 'SF Mono', 'Roboto Mono', monospace;
4
- line-height: 1.6;
5
- color: #2c3e50;
6
- background: #fafafa;
7
- margin: 0;
8
- padding: 0;
1
+ /*
2
+ * Technical Theme for vimd
3
+ * API documentation style inspired by modern technical docs
4
+ * https://github.com/floriannicolas/API-Documentation-HTML-Template
5
+ * MIT License
6
+ */
7
+
8
+ /* ============================================
9
+ CSS Variables
10
+ ============================================ */
11
+ :root {
12
+ --tech-text-color: #2c3e50;
13
+ --tech-bg-color: #fafafa;
14
+ --tech-accent-color: #3498db;
15
+ --tech-accent-dark: #2980b9;
16
+ --tech-heading-color: #34495e;
17
+ --tech-code-color: #e74c3c;
18
+ --tech-code-bg: #f4f4f4;
19
+ --tech-border-color: #ecf0f1;
20
+ --tech-table-header: #34495e;
21
+ --tech-muted-color: #7f8c8d;
22
+ }
23
+
24
+ /* ============================================
25
+ Base Styles
26
+ ============================================ */
27
+ html {
28
+ background-color: var(--tech-bg-color);
9
29
  }
10
30
 
11
- .markdown-body {
12
- max-width: 1200px;
31
+ body {
32
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
33
+ font-size: 16px;
34
+ line-height: 1.6;
35
+ color: var(--tech-text-color);
36
+ background-color: var(--tech-bg-color);
37
+ max-width: 1000px;
13
38
  margin: 0 auto;
14
39
  padding: 2rem;
15
40
  }
16
41
 
17
- h1 {
18
- font-size: 2.5em;
19
- color: #34495e;
20
- border-bottom: 3px solid #3498db;
42
+ /* ============================================
43
+ Typography
44
+ ============================================ */
45
+ body h1,
46
+ body h2,
47
+ body h3,
48
+ body h4,
49
+ body h5,
50
+ body h6 {
51
+ font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
52
+ color: var(--tech-heading-color);
53
+ margin-top: 2em;
54
+ margin-bottom: 0.75em;
55
+ font-weight: 600;
56
+ line-height: 1.3;
57
+ }
58
+
59
+ body h1 {
60
+ font-size: 2.2em;
61
+ margin-top: 0;
21
62
  padding-bottom: 0.5em;
63
+ border-bottom: 3px solid var(--tech-accent-color);
22
64
  }
23
65
 
24
- h2 {
25
- font-size: 1.8em;
26
- color: #34495e;
27
- margin-top: 2em;
28
- border-bottom: 2px solid #ecf0f1;
66
+ body h2 {
67
+ font-size: 1.7em;
29
68
  padding-bottom: 0.3em;
69
+ border-bottom: 2px solid var(--tech-border-color);
30
70
  }
31
71
 
32
- h3 {
72
+ body h3 {
33
73
  font-size: 1.3em;
34
- color: #34495e;
35
74
  }
36
75
 
37
- code {
38
- background: #f4f4f4;
39
- color: #e74c3c;
76
+ body h4 {
77
+ font-size: 1.1em;
78
+ }
79
+
80
+ body h5 {
81
+ font-size: 1em;
82
+ }
83
+
84
+ body h6 {
85
+ font-size: 0.95em;
86
+ color: var(--tech-muted-color);
87
+ }
88
+
89
+ body p {
90
+ margin-top: 0;
91
+ margin-bottom: 1em;
92
+ }
93
+
94
+ /* ============================================
95
+ Links
96
+ ============================================ */
97
+ body a {
98
+ color: var(--tech-accent-color);
99
+ text-decoration: none;
100
+ }
101
+
102
+ body a:hover {
103
+ color: var(--tech-accent-dark);
104
+ text-decoration: underline;
105
+ }
106
+
107
+ body a:visited {
108
+ color: #8e44ad;
109
+ }
110
+
111
+ /* ============================================
112
+ Lists
113
+ ============================================ */
114
+ body ul,
115
+ body ol {
116
+ margin-top: 0;
117
+ margin-bottom: 1em;
118
+ padding-left: 2em;
119
+ }
120
+
121
+ body li {
122
+ margin-bottom: 0.4em;
123
+ }
124
+
125
+ body li > p {
126
+ margin-bottom: 0.5em;
127
+ }
128
+
129
+ body ul ul,
130
+ body ol ol,
131
+ body ul ol,
132
+ body ol ul {
133
+ margin-top: 0.3em;
134
+ margin-bottom: 0.3em;
135
+ }
136
+
137
+ /* Definition lists */
138
+ body dl {
139
+ margin-top: 0;
140
+ margin-bottom: 1em;
141
+ }
142
+
143
+ body dt {
144
+ font-weight: 600;
145
+ font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;
146
+ margin-top: 1em;
147
+ color: var(--tech-heading-color);
148
+ }
149
+
150
+ body dd {
151
+ margin-left: 2em;
152
+ margin-bottom: 0.5em;
153
+ }
154
+
155
+ /* ============================================
156
+ Blockquotes - Note/Warning style
157
+ ============================================ */
158
+ body blockquote {
159
+ margin: 1.5em 0;
160
+ padding: 1em 1.5em;
161
+ background-color: #e8f4fd;
162
+ border-left: 4px solid var(--tech-accent-color);
163
+ border-radius: 0 4px 4px 0;
164
+ }
165
+
166
+ body blockquote p {
167
+ margin-bottom: 0.5em;
168
+ }
169
+
170
+ body blockquote p:last-child {
171
+ margin-bottom: 0;
172
+ }
173
+
174
+ body blockquote code {
175
+ background-color: rgba(255, 255, 255, 0.7);
176
+ }
177
+
178
+ /* ============================================
179
+ Code
180
+ ============================================ */
181
+ body code,
182
+ body tt {
183
+ font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
184
+ font-size: 0.9em;
185
+ background-color: var(--tech-code-bg);
186
+ color: var(--tech-code-color);
40
187
  padding: 0.2em 0.5em;
41
188
  border-radius: 3px;
42
- font-family: 'SF Mono', monospace;
43
- font-size: 0.95em;
44
189
  }
45
190
 
46
- pre {
47
- background: #f4f4f4;
48
- padding: 1.5em;
49
- border-radius: 5px;
191
+ body pre {
192
+ font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
193
+ font-size: 0.85em;
194
+ line-height: 1.5;
195
+ background-color: var(--tech-code-bg);
196
+ padding: 1.25em;
197
+ border-radius: 0 4px 4px 0;
198
+ border-left: 4px solid var(--tech-accent-color);
50
199
  overflow-x: auto;
51
- border-left: 4px solid #3498db;
200
+ margin: 1.5em 0;
52
201
  }
53
202
 
54
- pre code {
203
+ body pre code {
55
204
  background: none;
56
- color: #2c3e50;
205
+ color: var(--tech-text-color);
57
206
  padding: 0;
207
+ font-size: inherit;
208
+ }
209
+
210
+ /* ============================================
211
+ Tables
212
+ ============================================ */
213
+ body table {
214
+ border-collapse: collapse;
215
+ width: 100%;
216
+ margin: 1.5em 0;
217
+ font-size: 0.95em;
218
+ }
219
+
220
+ body th,
221
+ body td {
222
+ padding: 0.75em 1em;
223
+ text-align: left;
224
+ border: 1px solid #ddd;
225
+ }
226
+
227
+ body th {
228
+ font-weight: 600;
229
+ background-color: var(--tech-table-header);
230
+ color: #fff;
231
+ }
232
+
233
+ body td {
234
+ background-color: #fff;
235
+ }
236
+
237
+ body tr:nth-child(even) td {
238
+ background-color: #f9f9f9;
239
+ }
240
+
241
+ body tr:hover td {
242
+ background-color: #f0f7fc;
243
+ }
244
+
245
+ /* ============================================
246
+ Horizontal Rules
247
+ ============================================ */
248
+ body hr {
249
+ border: none;
250
+ border-top: 2px solid var(--tech-border-color);
251
+ margin: 2.5em 0;
252
+ }
253
+
254
+ /* ============================================
255
+ Images
256
+ ============================================ */
257
+ body img {
258
+ max-width: 100%;
259
+ height: auto;
260
+ display: block;
261
+ margin: 1.5em auto;
262
+ border-radius: 4px;
263
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
264
+ }
265
+
266
+ body figure {
267
+ margin: 2em 0;
268
+ text-align: center;
269
+ }
270
+
271
+ body figure img {
272
+ margin: 0 auto 0.75em;
273
+ }
274
+
275
+ body figcaption {
276
+ font-size: 0.9em;
277
+ color: var(--tech-muted-color);
278
+ font-style: italic;
279
+ }
280
+
281
+ /* ============================================
282
+ Table of Contents (Pandoc)
283
+ ============================================ */
284
+ nav#TOC {
285
+ background-color: #fff;
286
+ border: 1px solid var(--tech-border-color);
287
+ border-left: 4px solid var(--tech-accent-color);
288
+ border-radius: 0 4px 4px 0;
289
+ padding: 1.25em 1.5em;
290
+ margin-bottom: 2em;
291
+ }
292
+
293
+ nav#TOC::before {
294
+ content: "Table of Contents";
295
+ display: block;
296
+ font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;
297
+ font-weight: 600;
298
+ font-size: 0.9em;
299
+ color: var(--tech-heading-color);
300
+ margin-bottom: 0.75em;
301
+ text-transform: uppercase;
302
+ letter-spacing: 0.05em;
303
+ }
304
+
305
+ nav#TOC > ul {
306
+ margin: 0;
307
+ padding-left: 0;
308
+ list-style: none;
309
+ }
310
+
311
+ nav#TOC ul {
312
+ padding-left: 1.5em;
313
+ }
314
+
315
+ nav#TOC li {
316
+ margin: 0.4em 0;
317
+ font-size: 0.95em;
58
318
  }
59
319
 
60
- a {
61
- color: #3498db;
320
+ nav#TOC a {
321
+ color: var(--tech-text-color);
62
322
  text-decoration: none;
323
+ border-bottom: 1px dashed transparent;
63
324
  }
64
325
 
65
- a:hover {
326
+ nav#TOC a:hover {
327
+ color: var(--tech-accent-color);
328
+ border-bottom-color: var(--tech-accent-color);
329
+ }
330
+
331
+ /* ============================================
332
+ Footnotes (Pandoc)
333
+ ============================================ */
334
+ .footnotes {
335
+ margin-top: 3em;
336
+ padding-top: 1.5em;
337
+ border-top: 2px solid var(--tech-border-color);
338
+ font-size: 0.9em;
339
+ }
340
+
341
+ .footnotes hr {
342
+ display: none;
343
+ }
344
+
345
+ .footnotes ol {
346
+ padding-left: 1.5em;
347
+ }
348
+
349
+ .footnotes li {
350
+ margin-bottom: 0.75em;
351
+ }
352
+
353
+ .footnote-ref {
354
+ font-size: 0.75em;
355
+ vertical-align: super;
356
+ text-decoration: none;
357
+ color: var(--tech-accent-color);
358
+ font-weight: 600;
359
+ }
360
+
361
+ .footnote-back {
362
+ margin-left: 0.3em;
363
+ text-decoration: none;
364
+ }
365
+
366
+ /* ============================================
367
+ Pandoc Syntax Highlighting - Technical Style
368
+ ============================================ */
369
+ div.sourceCode {
370
+ background-color: var(--tech-code-bg);
371
+ border-left: 4px solid var(--tech-accent-color);
372
+ border-radius: 0 4px 4px 0;
373
+ overflow: auto;
374
+ }
375
+
376
+ pre.sourceCode {
377
+ margin: 0;
378
+ padding: 1.25em;
379
+ }
380
+
381
+ code.sourceCode {
382
+ background: transparent;
383
+ color: var(--tech-text-color);
384
+ }
385
+
386
+ /* Comments - gray italic */
387
+ code.sourceCode span.co,
388
+ .sourceCode .co {
389
+ color: #7f8c8d;
390
+ font-style: italic;
391
+ }
392
+
393
+ /* Strings - green */
394
+ code.sourceCode span.st,
395
+ code.sourceCode span.ch,
396
+ code.sourceCode span.vs,
397
+ .sourceCode .st,
398
+ .sourceCode .ch,
399
+ .sourceCode .vs {
400
+ color: #27ae60;
401
+ }
402
+
403
+ /* Keywords - purple/magenta */
404
+ code.sourceCode span.kw,
405
+ code.sourceCode span.cf,
406
+ .sourceCode .kw,
407
+ .sourceCode .cf {
408
+ color: #8e44ad;
409
+ font-weight: 600;
410
+ }
411
+
412
+ /* Numbers - orange */
413
+ code.sourceCode span.dv,
414
+ code.sourceCode span.bn,
415
+ code.sourceCode span.fl,
416
+ code.sourceCode span.cn,
417
+ .sourceCode .dv,
418
+ .sourceCode .bn,
419
+ .sourceCode .fl,
420
+ .sourceCode .cn {
421
+ color: #e67e22;
422
+ }
423
+
424
+ /* Functions - blue */
425
+ code.sourceCode span.fu,
426
+ code.sourceCode span.bu,
427
+ .sourceCode .fu,
428
+ .sourceCode .bu {
429
+ color: var(--tech-accent-color);
430
+ }
431
+
432
+ /* Variables - red/coral */
433
+ code.sourceCode span.va,
434
+ .sourceCode .va {
435
+ color: #e74c3c;
436
+ }
437
+
438
+ /* Data types - teal */
439
+ code.sourceCode span.dt,
440
+ .sourceCode .dt {
441
+ color: #16a085;
442
+ font-weight: 600;
443
+ }
444
+
445
+ /* Operators */
446
+ code.sourceCode span.op,
447
+ .sourceCode .op {
448
+ color: var(--tech-text-color);
449
+ }
450
+
451
+ /* Attributes - green */
452
+ code.sourceCode span.at,
453
+ .sourceCode .at {
454
+ color: #27ae60;
455
+ }
456
+
457
+ /* Preprocessor - purple */
458
+ code.sourceCode span.pp,
459
+ code.sourceCode span.im,
460
+ .sourceCode .pp,
461
+ .sourceCode .im {
462
+ color: #8e44ad;
463
+ font-weight: 600;
464
+ }
465
+
466
+ /* Special characters */
467
+ code.sourceCode span.sc,
468
+ code.sourceCode span.ss,
469
+ .sourceCode .sc,
470
+ .sourceCode .ss {
471
+ color: #27ae60;
472
+ }
473
+
474
+ /* Annotations */
475
+ code.sourceCode span.an,
476
+ code.sourceCode span.do,
477
+ .sourceCode .an,
478
+ .sourceCode .do {
479
+ color: #7f8c8d;
480
+ font-style: italic;
481
+ }
482
+
483
+ /* Errors */
484
+ code.sourceCode span.er,
485
+ code.sourceCode span.al,
486
+ .sourceCode .er,
487
+ .sourceCode .al {
488
+ color: #c0392b;
489
+ font-weight: 600;
66
490
  text-decoration: underline;
67
491
  }
68
492
 
69
- table {
70
- border-collapse: collapse;
71
- width: 100%;
72
- margin: 1em 0;
493
+ /* Warnings */
494
+ code.sourceCode span.wa,
495
+ .sourceCode .wa {
496
+ color: #f39c12;
73
497
  }
74
498
 
75
- th, td {
76
- border: 1px solid #ddd;
77
- padding: 0.8em;
78
- text-align: left;
499
+ /* Information */
500
+ code.sourceCode span.in,
501
+ .sourceCode .in {
502
+ color: #7f8c8d;
503
+ font-style: italic;
79
504
  }
80
505
 
81
- th {
82
- background: #34495e;
83
- color: #fff;
506
+ /* ============================================
507
+ Keyboard and Mark
508
+ ============================================ */
509
+ body kbd {
510
+ font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
511
+ font-size: 0.85em;
512
+ padding: 0.2em 0.5em;
513
+ border: 1px solid #bdc3c7;
514
+ border-radius: 3px;
515
+ background-color: #ecf0f1;
516
+ box-shadow: inset 0 -2px 0 #bdc3c7;
517
+ }
518
+
519
+ body mark {
520
+ background-color: #f1c40f;
521
+ padding: 0.1em 0.3em;
522
+ border-radius: 2px;
523
+ }
524
+
525
+ /* ============================================
526
+ Strong and Emphasis
527
+ ============================================ */
528
+ body strong,
529
+ body b {
530
+ font-weight: 600;
531
+ }
532
+
533
+ body em,
534
+ body i {
535
+ font-style: italic;
536
+ }
537
+
538
+ /* ============================================
539
+ Selection
540
+ ============================================ */
541
+ ::selection {
542
+ background-color: rgba(52, 152, 219, 0.3);
543
+ color: var(--tech-text-color);
544
+ }
545
+
546
+ /* ============================================
547
+ Scrollbar (WebKit)
548
+ ============================================ */
549
+ ::-webkit-scrollbar {
550
+ width: 8px;
551
+ height: 8px;
552
+ }
553
+
554
+ ::-webkit-scrollbar-track {
555
+ background: var(--tech-border-color);
556
+ }
557
+
558
+ ::-webkit-scrollbar-thumb {
559
+ background: #bdc3c7;
560
+ border-radius: 4px;
561
+ }
562
+
563
+ ::-webkit-scrollbar-thumb:hover {
564
+ background: #95a5a6;
565
+ }
566
+
567
+ /* ============================================
568
+ Print Styles
569
+ ============================================ */
570
+ @media print {
571
+ body {
572
+ max-width: 100%;
573
+ padding: 0;
574
+ font-size: 11pt;
575
+ background: #fff;
576
+ color: #000;
577
+ }
578
+
579
+ body a {
580
+ color: #000;
581
+ text-decoration: underline;
582
+ }
583
+
584
+ body a[href^="http"]::after {
585
+ content: " (" attr(href) ")";
586
+ font-size: 0.8em;
587
+ color: #666;
588
+ }
589
+
590
+ body pre,
591
+ body blockquote {
592
+ border-left-color: #333;
593
+ background-color: #f5f5f5;
594
+ page-break-inside: avoid;
595
+ }
596
+
597
+ body th {
598
+ background-color: #333;
599
+ }
600
+
601
+ nav#TOC {
602
+ border-left-color: #333;
603
+ page-break-after: always;
604
+ }
605
+
606
+ body h2,
607
+ body h3 {
608
+ page-break-after: avoid;
609
+ }
610
+
611
+ body table {
612
+ page-break-inside: avoid;
613
+ }
614
+ }
615
+
616
+ /* ============================================
617
+ Responsive
618
+ ============================================ */
619
+ @media (max-width: 768px) {
620
+ body {
621
+ padding: 1.5rem 1rem;
622
+ font-size: 15px;
623
+ }
624
+
625
+ body h1 {
626
+ font-size: 1.8em;
627
+ }
628
+
629
+ body h2 {
630
+ font-size: 1.4em;
631
+ }
632
+
633
+ body pre {
634
+ padding: 1em;
635
+ font-size: 0.8em;
636
+ }
637
+
638
+ body table {
639
+ font-size: 0.85em;
640
+ }
641
+
642
+ body th,
643
+ body td {
644
+ padding: 0.5em;
645
+ }
646
+
647
+ nav#TOC {
648
+ padding: 1em;
649
+ }
650
+ }
651
+
652
+ @media (max-width: 480px) {
653
+ body {
654
+ padding: 1rem;
655
+ }
656
+
657
+ body h1 {
658
+ font-size: 1.5em;
659
+ }
660
+
661
+ body pre {
662
+ border-left-width: 3px;
663
+ padding: 0.75em;
664
+ }
665
+
666
+ body blockquote {
667
+ padding: 0.75em 1em;
668
+ }
84
669
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "vimd",
3
- "version": "0.1.10",
3
+ "version": "0.1.12",
4
4
  "description": "Real-time Markdown preview tool with pandoc (view markdown)",
5
5
  "type": "module",
6
6
  "keywords": [