diff --git a/site/_includes/base.njk b/site/_includes/base.njk
index 26906d8..af14676 100644
--- a/site/_includes/base.njk
+++ b/site/_includes/base.njk
@@ -9,6 +9,12 @@ title: Joshua's Homepage
+
+
+
+
+
+
{{ computedTitle }} - {{ site.title }}
@@ -24,8 +30,6 @@ title: Joshua's Homepage
{% endif %}
-
-
{% include "-header.njk" %}
diff --git a/site/_includes/css/prism.css b/site/_includes/css/prism.css
index 8d751ef..7ce453a 100644
--- a/site/_includes/css/prism.css
+++ b/site/_includes/css/prism.css
@@ -1,4 +1,4 @@
-/* Prism Material */
+/* Prism Material with some adjustments */
code[class*="language-"],
pre[class*="language-"] {
text-align: left;
@@ -45,48 +45,45 @@ p:has(>code) + pre[class*="language-"] {
}
.token.id { font-weight: bold; }
.token.important { font-weight: bold; }
-/* Prism Material Light */
-.language-css > code,
-.language-sass > code,
-.language-scss > code {
- color: #f76d47;
-}
-.token.atrule { color: #7c4dff; }
-.token.attr-name { color: #39adb5; }
-.token.attr-value { color: #f6a434; }
-.token.attribute { color: #f6a434; }
-.token.boolean { color: #7c4dff; }
-.token.builtin { color: #39adb5; }
-.token.cdata { color: #39adb5; }
-.token.char { color: #39adb5; }
-.token.class { color: #39adb5; }
-.token.class-name { color: #6182b8; }
-.token.comment { color: #aabfc9; }
-.token.constant { color: #7c4dff; }
-.token.deleted { color: #e53935; }
-.token.doctype { color: #aabfc9; }
-.token.entity { color: #e53935; }
-.token.function { color: #7c4dff; }
-.token.hexcode { color: #f76d47; }
-.token.id { color: #7c4dff; }
-.token.important { color: #7c4dff; }
-.token.inserted { color: #39adb5; }
-.token.keyword { color: #7c4dff; }
-.token.number { color: #f76d47; }
-.token.operator { color: #39adb5; }
-.token.prolog { color: #aabfc9; }
-.token.property { color: #39adb5; }
-.token.pseudo-class { color: #f6a434; }
-.token.pseudo-element { color: #f6a434; }
-.token.punctuation { color: #39adb5; }
-.token.regex { color: #6182b8; }
-.token.selector { color: #e53935; }
-.token.string { color: #f6a434; }
-.token.symbol { color: #7c4dff; }
-.token.tag { color: #e53935; }
-.token.unit { color: #f76d47; }
-.token.url { color: #e53935; }
-.token.variable { color: #e53935; }
+/* Prism Material Light, darkened in LCH by 50% */
+.language-scss > code { color: oklch(0.349 0.178 36.3); }
+.token.atrule { color: oklch(0.29 0.247 288.2); }
+.token.attr-name { color: oklch(0.344 0.101 201.7); }
+.token.attr-value { color: oklch(0.391 0.153 69.5); }
+.token.attribute { color: oklch(0.391 0.153 69.5); }
+.token.boolean { color: oklch(0.29 0.247 288.2); }
+.token.builtin { color: oklch(0.344 0.101 201.7); }
+.token.cdata { color: oklch(0.344 0.101 201.7); }
+.token.char { color: oklch(0.344 0.101 201.7); }
+.token.class { color: oklch(0.344 0.101 201.7); }
+.token.class-name { color: oklch(0.302 0.091 260); }
+.token.comment { color: oklch(0.396 0.027 228); }
+.token.constant { color: oklch(0.29 0.247 288.2); }
+.token.deleted { color: oklch(0.304 0.209 27); }
+.token.doctype { color: oklch(0.396 0.027 228); }
+.token.entity { color: oklch(0.304 0.209 27); }
+.token.function { color: oklch(0.29 0.247 288.2); }
+.token.hexcode { color: oklch(0.349 0.178 36.3); }
+.token.id { color: oklch(0.29 0.247 288.2); }
+.token.important { color: oklch(0.29 0.247 288.2); }
+.token.inserted { color: oklch(0.344 0.101 201.7); }
+.token.keyword { color: oklch(0.29 0.247 288.2); }
+.token.number { color: oklch(0.349 0.178 36.3); }
+.token.operator { color: oklch(0.344 0.101 201.7); }
+.token.prolog { color: oklch(0.396 0.027 228); }
+.token.property { color: oklch(0.344 0.101 201.7); }
+.token.pseudo-class { color: oklch(0.391 0.153 69.5); }
+.token.pseudo-element { color: oklch(0.391 0.153 69.5); }
+.token.punctuation { color: oklch(0.344 0.101 201.7); }
+.token.regex { color: oklch(0.302 0.091 260); }
+.token.selector { color: oklch(0.304 0.209 27); }
+.token.string { color: oklch(0.391 0.153 69.5); }
+.token.symbol { color: oklch(0.29 0.247 288.2); }
+.token.tag { color: oklch(0.304 0.209 27); }
+.token.unit { color: oklch(0.349 0.178 36.3); }
+.token.url { color: oklch(0.304 0.209 27); }
+.token.variable { color: oklch(0.304 0.209 27); }
+
/* Prism Material Dark */
[data-theme="dark"] {
.language-css > code,
diff --git a/site/_includes/css/site.css b/site/_includes/css/site.css
index 5f8bce8..37f6c25 100644
--- a/site/_includes/css/site.css
+++ b/site/_includes/css/site.css
@@ -8,15 +8,16 @@
flex-grow: 1;
padding: 0;
line-height: 1.5;
+ font-display: swap;
}
body {
--c-highlight: oklch(100% 0 0 / 0.875);
--c-accent: white;
--c-dark: oklch(32.1% 0.022 259.9);
- --c-body-background: oklch(85% 0 338);
- --c-bg1: oklch(85% 0.04 285);
- --c-bg2: oklch(85% 0.04 160);
+ --c-body-background: oklch(87.5% 0 338);
+ --c-bg1: oklch(87.5% 0.04 285);
+ --c-bg2: oklch(87.5% 0.04 160);
--c-text-background-light: oklch(96.2% 0 0 / 0.6);
--c-text-light: var(--c-highlight);
@@ -44,11 +45,11 @@ body {
--inset: calc(50vw - var(--content-width) / 2);
background-image:
url(/noise.png),
- radial-gradient(circle at -20% 20vmin, var(--c-bg1), transparent 60%),
+ radial-gradient(circle at -20% 20vmin, var(--c-bg1), transparent 150vmin),
radial-gradient(
circle at 120% calc(100% - 20vmin),
var(--c-bg2),
- transparent 60%
+ transparent 150vmin
);
}
@@ -106,7 +107,9 @@ body {
flex-grow: 1;
padding: 0;
margin: 0;
- font-family: Inter, sans-serif;
+ font-family:
+ Inter, Ubuntu, "Noto Sans", "Fira Sans", Roboto, "Helvetica Neue",
+ "Arial Nova", "Nimbus Sans", Arial, sans-serif;
background-color: var(--c-body-background);
color: var(--c-text-dark);
}
@@ -247,7 +250,8 @@ ul.collection {
p {
margin: 0;
}
-p + p, pre + p {
+p + p,
+pre + p {
margin-top: 1lh;
}
blockquote {
@@ -546,7 +550,8 @@ a.header-anchor {
margin-bottom: 1rem;
}
-p > code, pre {
+p > code,
+pre {
font-family: "Commit Mono", monospace;
background-color: var(--c-text-background-light);
padding: 0.1em;
@@ -594,7 +599,7 @@ body .isso-input-wrapper label {
}
body .isso-input-wrapper input,
-input[type='text'],
+input[type="text"],
body .isso-textarea,
body .isso-preview {
color: inherit;
@@ -627,7 +632,8 @@ body .isso-preview {
var(--c-text-background-light) 20px
);
}
-body .isso-post-action > input, button {
+body .isso-post-action > input,
+button {
color: inherit;
background-color: var(--c-text-background-light);
font-size: 1rem;
diff --git a/site/posts/2025-06-15-replacing-github-pages.md b/site/posts/2025-06-15-replacing-github-pages.md
index d4c6b09..cbfdde4 100644
--- a/site/posts/2025-06-15-replacing-github-pages.md
+++ b/site/posts/2025-06-15-replacing-github-pages.md
@@ -26,7 +26,7 @@ I usually use nginx, but I wanted to give Caddy a shot, and it has been a great
Here is the Caddyfile I made---you will need to change the domains names and the email. Email could be removed, but it is recommended so SSL certificate issuers can contact you if there is a problem with your certificates.
`/etc/caddy/Caddyfile`
-```undefined
+```caddy
# Global options block
{
email you@example.com # <<<< CHANGE THIS <<<<