this repo has no description
Add background to [data-para-flag--bg-*] to improve legibility, add some margins, give links custom semantic colours, improve heading legibility on tables by changing bc colour, add --[*-]typo-visited property
+41
-1
+2
src/config.ts
+2
src/config.ts
···
78
78
heading: "#4c4f69", // text
79
79
subheading: "#5c5f77", // subtext 1
80
80
url: "#1e66f5", // blue
81
+
visited: "#8839ef", // mauve
81
82
selection: "#7c7f9333", // overlay 2 (.2/.3 opacity)
82
83
},
83
84
rainbow: [
···
100
101
heading: "#c6d0f5", // text
101
102
subheading: "#b5bfe2", // subtext 1
102
103
url: "#8caaee", // blue
104
+
visited: "#ca9ee6", // mauve
103
105
selection: "#949cbb33", // overlay 2 (.2/.3 opacity)
104
106
},
105
107
rainbow: [
+39
-1
src/pages/blog/[id].astro
+39
-1
src/pages/blog/[id].astro
···
122
122
123
123
& p,
124
124
& div:has(> p) {
125
+
&[data-para-flag--bg-red],
126
+
&[data-para-flag--bg-orange],
127
+
&[data-para-flag--bg-yellow],
128
+
&[data-para-flag--bg-green],
129
+
&[data-para-flag--bg-blue],
130
+
&[data-para-flag--bg-purple] {
131
+
& p {
132
+
background-color: var(--bg-secondary);
133
+
padding: 2rem;
134
+
border-radius: 1rem;
135
+
}
136
+
}
137
+
125
138
&[data-para-flag--bg-red] {
126
139
background-color: var(--rainbow-0);
127
140
}
···
201
214
margin-block: 2rem;
202
215
}
203
216
217
+
& div:has(> p) {
218
+
margin-block: 1rem;
219
+
}
220
+
204
221
/* Images */
205
222
& img {
206
223
height: auto; /* fix height issues ?? */
207
224
margin: 1rem;
208
225
}
209
226
227
+
& a {
228
+
&:link {
229
+
color: var(--typo-url);
230
+
}
231
+
&:visited {
232
+
color: var(--typo-visited);
233
+
}
234
+
&:hover {
235
+
color: var(--rainbow-2);
236
+
}
237
+
&:active {
238
+
color: var(--rainbow-3);
239
+
}
240
+
}
241
+
210
242
/* Standard Lists */
211
243
& ul,
212
244
& ol {
···
302
334
}
303
335
304
336
& thead th {
305
-
background-color: var(--rainbow-2);
337
+
background-color: var(--bg-secondary);
306
338
}
307
339
308
340
& tbody tr:nth-child(2n) {
···
342
374
);
343
375
344
376
--typo-url: light-dark(var(--_latte-typo-url), var(--_frappe-typo-url));
377
+
--typo-visited: light-dark(
378
+
var(--_latte-typo-visited),
379
+
var(--_frappe-typo-visited)
380
+
);
345
381
346
382
--typo-selection: light-dark(
347
383
var(--_latte-typo-selection),
···
449
485
--_latte-typo-heading: ${latte.typography.heading};
450
486
--_latte-typo-subheading: ${latte.typography.subheading};
451
487
--_latte-typo-url: ${latte.typography.url};
488
+
--_latte-typo-visited: ${latte.typography.visited};
452
489
--_latte-typo-selection: ${latte.typography.selection};
453
490
--_latte-rainbow-0: ${latte.rainbow[0]};
454
491
--_latte-rainbow-1: ${latte.rainbow[1]};
···
463
500
--_frappe-typo-heading: ${frappe.typography.heading};
464
501
--_frappe-typo-subheading: ${frappe.typography.subheading};
465
502
--_frappe-typo-url: ${frappe.typography.url};
503
+
--_frappe-typo-visited: ${frappe.typography.visited};
466
504
--_frappe-typo-selection: ${frappe.typography.selection};
467
505
--_frappe-rainbow-0: ${frappe.rainbow[0]};
468
506
--_frappe-rainbow-1: ${frappe.rainbow[1]};