website

#astro#js#html#css

git clone https://git.pyrossh.dev/website

木 Personal website of pyrossh. Built with astrojs, shiki, vite.


e873056pyrossh 2026-09-04T21:48:37+05:30
Fix markdown table and list rendering in READMEs
Files changed (1) hide show
  1. assets/css/markdown.css +55 -0
assets/css/markdown.css CHANGED
@@ -39,8 +39,32 @@
39
39
  padding-bottom: 1rem;
40
40
  }
41
41
 
42
+ /* shared.css resets ul/ol to list-style: none globally (for nav-style
43
+ lists elsewhere in the site), so markdown content needs its bullets/
44
+ numbering and indentation restored here, plus breathing room between
45
+ items — otherwise a dense list (e.g. one item per stdlib module, each
46
+ packed with inline code) reads as an unbroken wall of text. */
47
+ ul,
48
+ ol {
49
+ padding-left: 1.4rem;
50
+ margin-bottom: 1rem;
51
+ }
52
+
53
+ ul {
54
+ list-style: disc;
55
+ }
56
+
57
+ ol {
58
+ list-style: decimal;
59
+ }
60
+
42
61
  li {
43
62
  font-size: 1.1rem;
63
+ margin-bottom: 0.4rem;
64
+ }
65
+
66
+ li:last-child {
67
+ margin-bottom: 0;
44
68
  }
45
69
 
46
70
  p code,
@@ -65,6 +89,37 @@
65
89
  border-radius: 0.4rem;
66
90
  }
67
91
 
92
+ /* Tables in a README (markdown-it output, no wrapping container) get a
93
+ bordered/striped GitHub-style look instead of the unstyled UA table
94
+ default. display:block + overflow-x:auto lets a wide table scroll
95
+ horizontally on narrow viewports without breaking the page layout,
96
+ since there's no wrapper element to scope the overflow to. */
97
+ table {
98
+ display: block;
99
+ width: max-content;
100
+ max-width: 100%;
101
+ overflow-x: auto;
102
+ border-collapse: collapse;
103
+ margin-bottom: 1rem;
104
+ font-size: 1rem;
105
+ }
106
+
107
+ th,
108
+ td {
109
+ border: 1px solid var(--color-box-bg);
110
+ padding: 0.4rem 0.8rem;
111
+ text-align: left;
112
+ }
113
+
114
+ th {
115
+ font-weight: 700;
116
+ background: var(--color-highlight-bg);
117
+ }
118
+
119
+ tr:nth-child(even) {
120
+ background: var(--color-pre-bg);
121
+ }
122
+
68
123
  blockquote {
69
124
  font-size: 1.2rem;
70
125
  font-weight: 600;