fruno.win
My personal website
Improve inline code visibility
+12
-7
+9
-5
assets/style.css
+9
-5
assets/style.css
···
5
5
--color-bg: light-dark(#f2ecbc, #1f1f28);
6
6
7
7
--color-fg-muted: light-dark(#363646, #bab28a);
8
-
/* lighter in dark mode, darker in light mode */
9
-
--color-bg-variant: light-dark(#363646, #bab28a);
10
8
11
9
--color-primary: light-dark(#b35b79, #938aa9);
12
10
--color-primary-variant: light-dark(#938aa9, #957fb8);
···
96
94
}
97
95
98
96
code { font-family: var(--font-mono) }
99
-
pre { margin: 0 auto }
97
+
98
+
code:not(pre code) {
99
+
padding: 0 var(--s-3);
100
+
border: var(--s-6) solid color-mix(in srgb, var(--color-primary) 80%, transparent);
101
+
border-radius: var(--s-3);
102
+
}
103
+
100
104
.code pre {
101
-
padding: 1em;
105
+
padding: var(--s0);
102
106
103
107
border: var(--s-6) solid var(--color-primary);
104
108
border-radius: var(--s-3);
105
109
106
-
box-shadow: var(--s-4) var(--s-4) var(--color-primary);
110
+
box-shadow: var(--s-4) var(--s-4) color-mix(in srgb, var(--color-primary) 80%, transparent);
107
111
}
108
112
109
113
.heading {
+3
-2
posts/2026-01-03-initial-commit.djot
+3
-2
posts/2026-01-03-initial-commit.djot
···
3
3
listed = false
4
4
---
5
5
6
-
# this is an exampe for a draft!
6
+
# this is an example for a draft!
7
7
8
8
This post is gonna detail how I made this site, but for now it's just a placeholder.
9
-
Here's some `inline code` for ya.
9
+
Here's some `inline code` for ya. I will now write some more text to see it with
10
+
text above as well as below!
10
11
11
12
```css
12
13
main {