website

#astro#js#html#css

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

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

ec165f1 — pyrossh 2026-07-07T19:53:24+05:30 
fix: use proper CSS nesting across all worker CSS and assets worker
Files changed (10) hide show
  1. assets/css/shared.css +52 -56
  2. assets/css/workers/cv.css +1 -1
  3. assets/css/workers/home.css +114 -126
  4. assets/css/workers/issues-detail.css +2 -2
  5. assets/css/workers/issues-index.css +3 -3
  6. assets/css/workers/only-bible-app-privacy.css +1 -1
  7. assets/css/workers/posts-detail.css +10 -10
  8. assets/css/workers/posts-index.css +7 -7
  9. packages/workers/assets/src/index.ts +76 -82
  10. packages/workers/dev-router/src/index.ts +4 -0
assets/css/shared.css CHANGED
@@ -28,20 +28,20 @@ table { border-collapse: collapse; }
28
28
  --color-tag: light-dark(hsl(152, 96%, 35%), hsl(152, 96%, 44%));
29
29
  --btn-light: none;
30
30
  --btn-dark: block;
31
- }
32
31
 
33
- :root .astro-code,
32
+ .astro-code,
34
- :root .astro-code span {
33
+ .astro-code span {
35
- background: var(--color-pre-bg) !important;
34
+ background: var(--color-pre-bg) !important;
35
+ }
36
36
  }
37
37
 
38
38
  [data-theme="dark"] {
39
39
  --btn-light: block;
40
40
  --btn-dark: none;
41
- }
42
41
 
43
- [data-theme="dark"] .expressive-code .frame pre {
42
+ .expressive-code .frame pre {
44
- background: var(--color-pre-bg) !important;
43
+ background: var(--color-pre-bg) !important;
44
+ }
45
45
  }
46
46
 
47
47
  [data-tooltip] {
@@ -85,10 +85,8 @@ body {
85
85
  font-size: 1.25rem;
86
86
  line-height: 1.5;
87
87
  min-height: 100vh;
88
- }
89
88
 
90
- @media (max-width: 720px) {
89
+ @media (max-width: 720px) {
91
- body {
92
90
  font-size: 1.1rem;
93
91
  }
94
92
  }
@@ -119,14 +117,14 @@ header {
119
117
  float: left;
120
118
  color: var(--color-accent);
121
119
  margin-right: 8px;
122
- }
123
120
 
124
- .logo.active,
121
+ &.active,
125
- .logo:hover {
122
+ &:hover {
126
- color: var(--color-accent);
123
+ color: var(--color-accent);
127
- text-decoration: underline;
124
+ text-decoration: underline;
128
- text-decoration-color: var(--color-accent);
125
+ text-decoration-color: var(--color-accent);
129
- text-underline-offset: 8px;
126
+ text-underline-offset: 8px;
127
+ }
130
128
  }
131
129
 
132
130
  .links {
@@ -136,41 +134,41 @@ header {
136
134
  font-size: 1.4rem;
137
135
  line-height: 56px;
138
136
  color: white;
139
- }
140
-
141
- .links #astro-color-scheme-switch {
142
- display: flex;
143
- align-items: center;
144
- font-size: 1.3rem;
145
- }
146
137
 
147
- .links #astro-color-scheme-switch button {
138
+ #astro-color-scheme-switch {
148
- padding-right: 12px;
149
- cursor: pointer;
150
- margin-bottom: -2px;
151
- }
152
-
153
- .links a {
154
- display: inline-block;
139
+ display: flex;
155
- text-decoration: none;
140
+ align-items: center;
156
- font-size: 22px;
141
+ font-size: 1.3rem;
157
- line-height: 56px;
158
- color: white;
159
- font-weight: 400;
160
- padding-left: 12px;
161
- padding-right: 12px;
162
- }
163
142
 
164
- .links a:last-child {
143
+ button {
165
- padding-right: 0px;
144
+ padding-right: 12px;
145
+ cursor: pointer;
146
+ margin-bottom: -2px;
166
- }
147
+ }
148
+ }
167
149
 
150
+ a {
151
+ display: inline-block;
152
+ text-decoration: none;
153
+ font-size: 22px;
154
+ line-height: 56px;
155
+ color: white;
156
+ font-weight: 400;
157
+ padding-left: 12px;
158
+ padding-right: 12px;
159
+
160
+ &:last-child {
161
+ padding-right: 0px;
162
+ }
163
+
168
- .links a.active,
164
+ &.active,
169
- .links a:hover {
165
+ &:hover {
170
- color: var(--color-gray-200);
166
+ color: var(--color-gray-200);
171
- text-decoration: underline;
167
+ text-decoration: underline;
172
- text-decoration-color: var(--color-accent);
168
+ text-decoration-color: var(--color-accent);
173
- text-underline-offset: 8px;
169
+ text-underline-offset: 8px;
170
+ }
171
+ }
174
172
  }
175
173
 
176
174
  footer {
@@ -215,11 +213,11 @@ footer {
215
213
  text-decoration-thickness: 2px;
216
214
  text-decoration-line: underline;
217
215
  text-decoration-color: white;
218
- }
219
216
 
220
- .link:hover {
217
+ &:hover {
221
- color: var(--color-gray-200);
218
+ color: var(--color-gray-200);
222
- text-decoration-color: var(--color-gray-200);
219
+ text-decoration-color: var(--color-gray-200);
220
+ }
223
221
  }
224
222
 
225
223
  @media (prefers-color-scheme: dark) { :root { color-scheme: dark; } }
@@ -247,10 +245,8 @@ footer {
247
245
  margin-left: auto;
248
246
  padding-left: 1em;
249
247
  padding-right: 1em;
250
- }
251
248
 
252
- @media (max-width: 720px) {
249
+ @media (max-width: 720px) {
253
- .wrapper {
254
250
  width: 100%;
255
251
  }
256
252
  }
assets/css/workers/cv.css CHANGED
@@ -5,7 +5,7 @@
5
5
  font-size: 2rem;
6
6
  margin-bottom: 1rem;
7
7
 
8
- h1 a {
8
+ a {
9
9
  margin-left: 0.4rem;
10
10
  margin-top: 0.8rem;
11
11
  color: var(--color-link);
assets/css/workers/home.css CHANGED
@@ -1,9 +1,7 @@
1
1
  .description {
2
2
  font-size: 1.1rem;
3
- }
4
3
 
5
- @media (max-width: 720px) {
4
+ @media (max-width: 720px) {
6
- .description {
7
5
  font-size: 1rem;
8
6
  }
9
7
  }
@@ -11,10 +9,8 @@
11
9
  h2 {
12
10
  font-size: 1.4rem;
13
11
  font-weight: 600;
14
- }
15
12
 
16
- @media (max-width: 720px) {
13
+ @media (max-width: 720px) {
17
- h2 {
18
14
  font-size: 1.15rem;
19
15
  }
20
16
  }
@@ -24,10 +20,8 @@ section {
24
20
  flex-direction: column;
25
21
  margin-top: 1.5rem;
26
22
  margin-bottom: 1rem;
27
- }
28
23
 
29
- @media (max-width: 720px) {
24
+ @media (max-width: 720px) {
30
- section {
31
25
  margin-top: 1.5rem;
32
26
  margin-bottom: 0rem;
33
27
  }
@@ -42,10 +36,8 @@ section {
42
36
  grid-template-columns: auto auto;
43
37
  gap: 1rem;
44
38
  margin-top: 0.5rem;
45
- }
46
39
 
47
- @media (max-width: 720px) {
40
+ @media (max-width: 720px) {
48
- .repos {
49
41
  gap: 1rem;
50
42
  grid-template-columns: auto;
51
43
  }
@@ -62,10 +54,8 @@ section {
62
54
  line-height: 2.25rem;
63
55
  font-weight: 700;
64
56
  margin-bottom: 1rem;
65
- }
66
57
 
67
- @media (max-width: 720px) {
58
+ @media (max-width: 720px) {
68
- .title {
69
59
  font-size: 1.6rem;
70
60
  }
71
61
  }
@@ -88,16 +78,12 @@ section {
88
78
  display: grid;
89
79
  grid-template-columns: repeat(1, minmax(0, 1fr));
90
80
  gap: 1rem;
91
- }
92
81
 
93
- @media (max-width: 720px) {
82
+ @media (max-width: 720px) {
94
- .gridContainer {
95
83
  gap: 0rem;
96
84
  }
97
- }
98
85
 
99
- @media (min-width: 640px) {
86
+ @media (min-width: 640px) {
100
- .gridContainer {
101
87
  grid-template-columns: repeat(2, minmax(0, 1fr));
102
88
  gap: 2rem;
103
89
  }
@@ -110,123 +96,125 @@ section {
110
96
  background: var(--color-box-bg);
111
97
  color: var(--color-text);
112
98
  font-size: 0.95rem;
113
- }
114
-
115
- .repo a {
116
- color: var(--color-link);
117
- }
118
-
119
- .repo h4 {
120
- font-size: 1.05rem;
121
- font-weight: 500;
122
- line-height: 1.2;
123
- border-bottom: 1px solid #495057;
124
- text-overflow: ellipsis;
125
- white-space: nowrap;
126
- overflow: hidden;
127
- margin-bottom: 0;
128
- padding: 0;
129
- }
130
-
131
- .repo .tags {
132
- margin-top: 0.5rem;
133
- display: flex;
134
- flex-wrap: wrap;
135
- gap: 0.25rem;
136
- }
137
-
138
- .repo .tag {
139
- color: var(--color-tag);
140
- padding: 0.15rem 0.5rem 0.5rem 0rem;
141
- border-radius: 0.25rem;
142
- font-size: 0.95rem;
143
- font-weight: 500;
144
- }
145
-
146
- .interests ul {
147
- display: grid;
148
- gap: 0.5rem;
149
- grid-template-columns: auto auto auto;
150
- text-align: center;
151
- margin-top: 0.5rem;
152
- font-size: 1.1rem;
153
- }
154
-
155
- .interests ul li {
156
- background-color: var(--color-box-bg);
157
- padding: 0.25rem;
158
- }
159
99
 
160
- .contact ul {
100
+ a {
161
- display: grid;
162
- gap: 0.5rem;
163
- grid-template-columns: auto;
164
- margin-top: 0.5rem;
165
- }
166
-
167
- .contact ul li {
168
- display: flex;
169
- flex-direction: row;
170
- align-items: baseline;
171
- padding: 0.25rem;
172
- background-color: var(--color-box-bg);
101
+ color: var(--color-link);
173
- font-size: 1.1rem;
174
- }
175
-
176
- @media (max-width: 720px) {
177
- .contact ul li {
178
- font-size: 1rem;
179
- flex-direction: column;
180
102
  }
181
- }
182
103
 
104
+ h4 {
105
+ font-size: 1.05rem;
183
- .contact ul a {
106
+ font-weight: 500;
107
+ line-height: 1.2;
108
+ border-bottom: 1px solid #495057;
184
- color: var(--color-link);
109
+ text-overflow: ellipsis;
110
+ white-space: nowrap;
111
+ overflow: hidden;
112
+ margin-bottom: 0;
113
+ padding: 0;
185
- }
114
+ }
186
-
187
- .contact ul strong {
188
- font-weight: 500;
189
- margin-left: 0.25rem;
190
- margin-right: 0.5rem;
191
- }
192
115
 
193
- .tools img {
116
+ .tags {
117
+ margin-top: 0.5rem;
194
- width: 36px;
118
+ display: flex;
195
- height: 36px;
119
+ flex-wrap: wrap;
120
+ gap: 0.25rem;
196
- }
121
+ }
197
122
 
198
- .tools ul {
123
+ .tag {
199
- display: grid;
124
+ color: var(--color-tag);
200
- gap: 0.5rem;
201
- grid-template-columns: auto auto auto auto;
125
+ padding: 0.15rem 0.5rem 0.5rem 0rem;
202
- text-align: center;
203
- margin-top: 0.5rem;
126
+ border-radius: 0.25rem;
127
+ font-size: 0.95rem;
128
+ font-weight: 500;
129
+ }
204
130
  }
205
131
 
206
- @media (max-width: 720px) {
207
- .tools ul {
132
+ .interests {
133
+ ul {
134
+ display: grid;
135
+ gap: 0.5rem;
208
136
  grid-template-columns: auto auto auto;
137
+ text-align: center;
138
+ margin-top: 0.5rem;
139
+ font-size: 1.1rem;
140
+
141
+ li {
142
+ background-color: var(--color-box-bg);
143
+ padding: 0.25rem;
144
+ }
209
145
  }
210
146
  }
211
147
 
212
- .tools ul li {
148
+ .contact {
149
+ ul {
150
+ display: grid;
151
+ gap: 0.5rem;
152
+ grid-template-columns: auto;
153
+ margin-top: 0.5rem;
154
+
155
+ li {
213
- display: flex;
156
+ display: flex;
157
+ flex-direction: row;
214
- align-items: center;
158
+ align-items: baseline;
159
+ padding: 0.25rem;
215
- background-color: var(--color-box-bg);
160
+ background-color: var(--color-box-bg);
216
- padding: 0.25rem;
161
+ font-size: 1.1rem;
162
+
163
+ @media (max-width: 720px) {
217
- font-size: 1rem;
164
+ font-size: 1rem;
165
+ flex-direction: column;
166
+ }
167
+ }
168
+
169
+ a {
170
+ color: var(--color-link);
171
+ }
172
+
173
+ strong {
174
+ font-weight: 500;
175
+ margin-left: 0.25rem;
176
+ margin-right: 0.5rem;
177
+ }
178
+ }
218
179
  }
219
180
 
220
- .tools ul li a {
181
+ .tools {
182
+ img {
221
- display: flex;
183
+ width: 36px;
222
- flex: 1;
223
- flex-direction: row;
224
- align-items: center;
225
- text-align: left;
184
+ height: 36px;
226
- margin-left: 0.25rem;
227
- margin-right: 0.25rem;
228
- }
185
+ }
229
186
 
187
+ ul {
188
+ display: grid;
189
+ gap: 0.5rem;
190
+ grid-template-columns: auto auto auto auto;
230
- .tools ul li a div {
191
+ text-align: center;
192
+ margin-top: 0.5rem;
193
+
194
+ @media (max-width: 720px) {
195
+ grid-template-columns: auto auto auto;
196
+ }
197
+
198
+ li {
199
+ display: flex;
200
+ align-items: center;
201
+ background-color: var(--color-box-bg);
202
+ padding: 0.25rem;
203
+ font-size: 1rem;
204
+
205
+ a {
206
+ display: flex;
231
- flex: 1;
207
+ flex: 1;
208
+ flex-direction: row;
209
+ align-items: center;
210
+ text-align: left;
211
+ margin-left: 0.25rem;
212
+ margin-right: 0.25rem;
213
+
214
+ div {
215
+ flex: 1;
216
+ }
217
+ }
218
+ }
219
+ }
232
220
  }
assets/css/workers/issues-detail.css CHANGED
@@ -56,7 +56,7 @@
56
56
  background: var(--color-box-bg);
57
57
 
58
58
  textarea,
59
- .comment-form input {
59
+ input {
60
60
  width: 100%;
61
61
  border: 1px solid var(--color-text);
62
62
  background: var(--color-body-bg);
@@ -65,7 +65,7 @@
65
65
  font: inherit;
66
66
  }
67
67
 
68
- .comment-form textarea {
68
+ textarea {
69
69
  min-height: 6rem;
70
70
  resize: vertical;
71
71
  }
assets/css/workers/issues-index.css CHANGED
@@ -28,7 +28,7 @@
28
28
  background: var(--color-box-bg);
29
29
 
30
30
  input,
31
- .new-issue textarea {
31
+ textarea {
32
32
  width: 100%;
33
33
  border: 1px solid var(--color-text);
34
34
  background: var(--color-body-bg);
@@ -37,12 +37,12 @@
37
37
  font: inherit;
38
38
  }
39
39
 
40
- .new-issue textarea {
40
+ textarea {
41
41
  min-height: 6rem;
42
42
  resize: vertical;
43
43
  }
44
44
 
45
- .new-issue button {
45
+ button {
46
46
  border: 1px solid var(--color-text);
47
47
  background: var(--color-box-bg);
48
48
  color: var(--color-link);
assets/css/workers/only-bible-app-privacy.css CHANGED
@@ -37,7 +37,7 @@
37
37
  font-weight: 600;
38
38
  margin-top: 0.5rem;
39
39
 
40
- h6 span {
40
+ span {
41
41
  font-family: sans-serif;
42
42
  font-weight: 400;
43
43
  font-size: 0.95rem;
assets/css/workers/posts-detail.css CHANGED
@@ -1,5 +1,5 @@
1
1
  article {
2
- article h1 {
2
+ h1 {
3
3
  text-align: left;
4
4
  font-size: 1.8rem;
5
5
  font-weight: bold;
@@ -8,7 +8,7 @@ article h1 {
8
8
  margin-bottom: 0.1rem;
9
9
  }
10
10
 
11
- article time {
11
+ time {
12
12
  font-size: 1.1rem;
13
13
  text-align: left;
14
14
  color: light-dark(
@@ -17,32 +17,32 @@ article time {
17
17
  );
18
18
  }
19
19
 
20
- article hr {
20
+ hr {
21
21
  margin: 0.5rem 0;
22
22
  border-color: hsl(var(--color-text));
23
23
  }
24
24
 
25
- article h2 {
25
+ h2 {
26
26
  font-size: 1.1rem;
27
27
  font-weight: 500;
28
28
  }
29
29
 
30
- article h3 {
30
+ h3 {
31
31
  font-size: 1.25rem;
32
32
  font-weight: 700;
33
33
  margin-top: 0.5rem;
34
34
  margin-bottom: 0.1rem;
35
35
  }
36
36
 
37
- article p {
37
+ p {
38
38
  font-size: 1.1rem;
39
39
  padding-bottom: 1rem;
40
40
  }
41
41
 
42
42
  p,
43
- article li {
43
+ li {
44
44
  font-size: 1.1rem;
45
- article li code {
45
+ code {
46
46
  color: var(--color-code-fg) !important;
47
47
  background: var(--color-code-bg) !important;
48
48
  word-wrap: break-word;
@@ -54,14 +54,14 @@ article li code {
54
54
  }
55
55
  }
56
56
 
57
- article blockquote {
57
+ blockquote {
58
58
  font-size: 1.2rem;
59
59
  font-weight: 600;
60
60
  background: var(--color-highlight-bg);
61
61
  padding: 0.4rem;
62
62
  margin: 16px 0px;
63
63
 
64
- article blockquote p {
64
+ p {
65
65
  padding: 0;
66
66
  }
67
67
  }
assets/css/workers/posts-index.css CHANGED
@@ -14,7 +14,7 @@
14
14
  display: flex;
15
15
  flex-direction: column;
16
16
 
17
- ul li {
17
+ li {
18
18
  display: grid;
19
19
  grid-template-columns: repeat(1, minmax(0, 1fr));
20
20
  gap: 0.4rem;
@@ -28,31 +28,31 @@ ul li {
28
28
  gap: 0.75rem;
29
29
  }
30
30
 
31
- ul li a {
31
+ a {
32
32
  font-size: 1.1rem;
33
33
  color: var(--color-post-link);
34
34
  text-decoration-line: underline;
35
35
  text-underline-offset: 4px;
36
36
  }
37
37
 
38
- ul li time {
38
+ time {
39
39
  font-size: 1.1rem;
40
40
  }
41
41
 
42
- ul li .content {
42
+ .content {
43
43
  display: flex;
44
44
  flex-direction: column;
45
45
  }
46
46
 
47
- ul li .description {
47
+ .description {
48
48
  font-size: 13pt;
49
49
 
50
- ul li .description:hover {
50
+ &:hover {
51
51
  cursor: default;
52
52
  }
53
53
  }
54
54
 
55
- ul li .date-wrapper {
55
+ .date-wrapper {
56
56
  display: flex;
57
57
  flex: 1;
58
58
  justify-content: flex-end;
packages/workers/assets/src/index.ts CHANGED
@@ -12,7 +12,7 @@ table { border-collapse: collapse; }
12
12
  @view-transition {
13
13
  navigation: auto; /* enabled! */
14
14
  }
15
- :root {
15
+ :root {
16
16
  --color-black: light-dark(hsl(0, 0%, 0%), hsl(0, 0%, 0%));
17
17
  --color-white: light-dark(hsl(0, 0%, 100%), hsl(0, 0%, 100%));
18
18
  --color-accent: hsl(57.25deg 100% 70%);
@@ -28,20 +28,20 @@ table { border-collapse: collapse; }
28
28
  --color-tag: light-dark(hsl(152, 96%, 35%), hsl(152, 96%, 44%));
29
29
  --btn-light: none;
30
30
  --btn-dark: block;
31
- }
32
31
 
33
- :root .astro-code,
32
+ .astro-code,
34
- :root .astro-code span {
33
+ .astro-code span {
35
- background: var(--color-pre-bg) !important;
34
+ background: var(--color-pre-bg) !important;
35
+ }
36
36
  }
37
37
 
38
38
  [data-theme="dark"] {
39
39
  --btn-light: block;
40
40
  --btn-dark: none;
41
- }
42
41
 
43
- [data-theme="dark"] .expressive-code .frame pre {
42
+ .expressive-code .frame pre {
44
- background: var(--color-pre-bg) !important;
43
+ background: var(--color-pre-bg) !important;
44
+ }
45
45
  }
46
46
 
47
47
  [data-tooltip] {
@@ -85,10 +85,8 @@ body {
85
85
  font-size: 1.25rem;
86
86
  line-height: 1.5;
87
87
  min-height: 100vh;
88
- }
89
88
 
90
- @media (max-width: 720px) {
89
+ @media (max-width: 720px) {
91
- body {
92
90
  font-size: 1.1rem;
93
91
  }
94
92
  }
@@ -119,14 +117,14 @@ header {
119
117
  float: left;
120
118
  color: var(--color-accent);
121
119
  margin-right: 8px;
122
- }
123
120
 
124
- .logo.active,
121
+ &.active,
125
- .logo:hover {
122
+ &:hover {
126
- color: var(--color-accent);
123
+ color: var(--color-accent);
127
- text-decoration: underline;
124
+ text-decoration: underline;
128
- text-decoration-color: var(--color-accent);
125
+ text-decoration-color: var(--color-accent);
129
- text-underline-offset: 8px;
126
+ text-underline-offset: 8px;
127
+ }
130
128
  }
131
129
 
132
130
  .links {
@@ -136,41 +134,41 @@ header {
136
134
  font-size: 1.4rem;
137
135
  line-height: 56px;
138
136
  color: white;
139
- }
140
137
 
141
- .links #astro-color-scheme-switch {
138
+ #astro-color-scheme-switch {
142
- display: flex;
139
+ display: flex;
143
- align-items: center;
140
+ align-items: center;
144
- font-size: 1.3rem;
141
+ font-size: 1.3rem;
145
- }
146
142
 
147
- .links #astro-color-scheme-switch button {
143
+ button {
148
- padding-right: 12px;
144
+ padding-right: 12px;
149
- cursor: pointer;
145
+ cursor: pointer;
150
- margin-bottom: -2px;
146
+ margin-bottom: -2px;
151
- }
147
+ }
148
+ }
152
149
 
153
- .links a {
150
+ a {
154
- display: inline-block;
151
+ display: inline-block;
155
- text-decoration: none;
152
+ text-decoration: none;
156
- font-size: 22px;
153
+ font-size: 22px;
157
- line-height: 56px;
154
+ line-height: 56px;
158
- color: white;
155
+ color: white;
159
- font-weight: 400;
156
+ font-weight: 400;
160
- padding-left: 12px;
157
+ padding-left: 12px;
161
- padding-right: 12px;
158
+ padding-right: 12px;
162
- }
163
159
 
164
- .links a:last-child {
160
+ &:last-child {
165
- padding-right: 0px;
161
+ padding-right: 0px;
166
- }
162
+ }
167
163
 
168
- .links a.active,
164
+ &.active,
169
- .links a:hover {
165
+ &:hover {
170
- color: var(--color-gray-200);
166
+ color: var(--color-gray-200);
171
- text-decoration: underline;
167
+ text-decoration: underline;
172
- text-decoration-color: var(--color-accent);
168
+ text-decoration-color: var(--color-accent);
173
- text-underline-offset: 8px;
169
+ text-underline-offset: 8px;
170
+ }
171
+ }
174
172
  }
175
173
 
176
174
  footer {
@@ -215,11 +213,11 @@ footer {
215
213
  text-decoration-thickness: 2px;
216
214
  text-decoration-line: underline;
217
215
  text-decoration-color: white;
218
- }
219
216
 
220
- .link:hover {
217
+ &:hover {
221
- color: var(--color-gray-200);
218
+ color: var(--color-gray-200);
222
- text-decoration-color: var(--color-gray-200);
219
+ text-decoration-color: var(--color-gray-200);
220
+ }
223
221
  }
224
222
 
225
223
  @media (prefers-color-scheme: dark) { :root { color-scheme: dark; } }
@@ -345,16 +343,12 @@ section {
345
343
  display: grid;
346
344
  grid-template-columns: repeat(1, minmax(0, 1fr));
347
345
  gap: 1rem;
348
- }
349
346
 
350
- @media (max-width: 720px) {
347
+ @media (max-width: 720px) {
351
- .gridContainer {
352
348
  gap: 0rem;
353
349
  }
354
- }
355
350
 
356
- @media (min-width: 640px) {
351
+ @media (min-width: 640px) {
357
- .gridContainer {
358
352
  grid-template-columns: repeat(2, minmax(0, 1fr));
359
353
  gap: 2rem;
360
354
  }
@@ -495,7 +489,7 @@ section {
495
489
  font-size: 2rem;
496
490
  margin-bottom: 1rem;
497
491
 
498
- h1 a {
492
+ a {
499
493
  margin-left: 0.4rem;
500
494
  margin-top: 0.8rem;
501
495
  color: var(--color-link);
@@ -521,7 +515,7 @@ h1 a {
521
515
  display: flex;
522
516
  flex-direction: column;
523
517
 
524
- ul li {
518
+ li {
525
519
  display: grid;
526
520
  grid-template-columns: repeat(1, minmax(0, 1fr));
527
521
  gap: 0.4rem;
@@ -535,31 +529,31 @@ ul li {
535
529
  gap: 0.75rem;
536
530
  }
537
531
 
538
- ul li a {
532
+ a {
539
533
  font-size: 1.1rem;
540
534
  color: var(--color-post-link);
541
535
  text-decoration-line: underline;
542
536
  text-underline-offset: 4px;
543
537
  }
544
538
 
545
- ul li time {
539
+ time {
546
540
  font-size: 1.1rem;
547
541
  }
548
542
 
549
- ul li .content {
543
+ .content {
550
544
  display: flex;
551
545
  flex-direction: column;
552
546
  }
553
547
 
554
- ul li .description {
548
+ .description {
555
549
  font-size: 13pt;
556
550
 
557
- ul li .description:hover {
551
+ &:hover {
558
552
  cursor: default;
559
553
  }
560
554
  }
561
555
 
562
- ul li .date-wrapper {
556
+ .date-wrapper {
563
557
  display: flex;
564
558
  flex: 1;
565
559
  justify-content: flex-end;
@@ -572,7 +566,7 @@ ul li .date-wrapper {
572
566
  }
573
567
  }`, type: "text/css" },
574
568
  "css/workers/posts-detail.css": { data: ` article {
575
- article h1 {
569
+ h1 {
576
570
  text-align: left;
577
571
  font-size: 1.8rem;
578
572
  font-weight: bold;
@@ -581,7 +575,7 @@ article h1 {
581
575
  margin-bottom: 0.1rem;
582
576
  }
583
577
 
584
- article time {
578
+ time {
585
579
  font-size: 1.1rem;
586
580
  text-align: left;
587
581
  color: light-dark(
@@ -590,32 +584,32 @@ article time {
590
584
  );
591
585
  }
592
586
 
593
- article hr {
587
+ hr {
594
588
  margin: 0.5rem 0;
595
589
  border-color: hsl(var(--color-text));
596
590
  }
597
591
 
598
- article h2 {
592
+ h2 {
599
593
  font-size: 1.1rem;
600
594
  font-weight: 500;
601
595
  }
602
596
 
603
- article h3 {
597
+ h3 {
604
598
  font-size: 1.25rem;
605
599
  font-weight: 700;
606
600
  margin-top: 0.5rem;
607
601
  margin-bottom: 0.1rem;
608
602
  }
609
603
 
610
- article p {
604
+ p {
611
605
  font-size: 1.1rem;
612
606
  padding-bottom: 1rem;
613
607
  }
614
608
 
615
609
  p,
616
- article li {
610
+ li {
617
611
  font-size: 1.1rem;
618
- article li code {
612
+ code {
619
613
  color: var(--color-code-fg) !important;
620
614
  background: var(--color-code-bg) !important;
621
615
  word-wrap: break-word;
@@ -627,14 +621,14 @@ article li code {
627
621
  }
628
622
  }
629
623
 
630
- article blockquote {
624
+ blockquote {
631
625
  font-size: 1.2rem;
632
626
  font-weight: 600;
633
627
  background: var(--color-highlight-bg);
634
628
  padding: 0.4rem;
635
629
  margin: 16px 0px;
636
630
 
637
- article blockquote p {
631
+ p {
638
632
  padding: 0;
639
633
  }
640
634
  }
@@ -683,7 +677,7 @@ article blockquote p {
683
677
  background: var(--color-box-bg);
684
678
 
685
679
  input,
686
- .new-issue textarea {
680
+ textarea {
687
681
  width: 100%;
688
682
  border: 1px solid var(--color-text);
689
683
  background: var(--color-body-bg);
@@ -692,12 +686,12 @@ article blockquote p {
692
686
  font: inherit;
693
687
  }
694
688
 
695
- .new-issue textarea {
689
+ textarea {
696
690
  min-height: 6rem;
697
691
  resize: vertical;
698
692
  }
699
693
 
700
- .new-issue button {
694
+ button {
701
695
  border: 1px solid var(--color-text);
702
696
  background: var(--color-box-bg);
703
697
  color: var(--color-link);
@@ -774,7 +768,7 @@ article blockquote p {
774
768
  background: var(--color-box-bg);
775
769
 
776
770
  textarea,
777
- .comment-form input {
771
+ input {
778
772
  width: 100%;
779
773
  border: 1px solid var(--color-text);
780
774
  background: var(--color-body-bg);
@@ -783,7 +777,7 @@ article blockquote p {
783
777
  font: inherit;
784
778
  }
785
779
 
786
- .comment-form textarea {
780
+ textarea {
787
781
  min-height: 6rem;
788
782
  resize: vertical;
789
783
  }
@@ -952,7 +946,7 @@ article blockquote p {
952
946
  font-weight: 600;
953
947
  margin-top: 0.5rem;
954
948
 
955
- h6 span {
949
+ span {
956
950
  font-family: sans-serif;
957
951
  font-weight: 400;
958
952
  font-size: 0.95rem;
packages/workers/dev-router/src/index.ts CHANGED
@@ -54,6 +54,10 @@ export default {
54
54
  async fetch(request: Request, env: any, ctx: ExecutionContext): Promise<Response> {
55
55
  const url = new URL(request.url);
56
56
 
57
+ if (/^\/assets\//.test(url.pathname)) {
58
+ return await assetsWorker.fetch(request);
59
+ }
60
+
57
61
  for (const route of routes) {
58
62
  if (route.pattern.test(url.pathname)) {
59
63
  try {