joshua/joshua.seigler.net
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

colors and gradients

Browse source
This commit is contained in:
Joshua Seigler 2025-06-16 00:46:07 -04:00
parent 2895c107e6
commit 277945f7ec
4 changed files with 63 additions and 56 deletions
Download patch file Download diff file Expand all files Collapse all files

8
site/_includes/base.njk
View file

@ -9,6 +9,12 @@ title: Joshua's Homepage
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover"> <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
<link rel="stylesheet" href="{{ "/site.css" | url }}"/> <link rel="stylesheet" href="{{ "/site.css" | url }}"/>
<link rel="preload" as="font" href="/fonts/inter/InterVariable.woff2"/>
<script defer src="https://stats.apps.seigler.net/script.js" data-website-id="ccb4bd94-2a71-47fe-8eea-d85bf75b7f6d"></script>
<script defer src="/scripts/effects.js"></script>
<link rel="prefetch" href="/fonts/inter/InterVariable-Italic.woff2"/>
<link rel="prefetch" href="/fonts/ftaurebesh/ftaurebesh-medium.woff2"/>
<link rel="prefetch" href="/fonts/ftaurebesh/ftaurebesh-bold.woff2"/>
<link rel="me" href="https://github.com/seigler"/> <link rel="me" href="https://github.com/seigler"/>
<link rel="webmention" href="https://webmention.io/joshua.seigler.net/webmention"/> <link rel="webmention" href="https://webmention.io/joshua.seigler.net/webmention"/>
<title>{{ computedTitle }} - {{ site.title }}</title> <title>{{ computedTitle }} - {{ site.title }}</title>
@ -24,8 +30,6 @@ title: Joshua's Homepage
{% endif %} {% endif %}
<meta name="twitter:card" content="summary"/> <meta name="twitter:card" content="summary"/>
<meta name="generator" content="{{ eleventy.generator }}"> <meta name="generator" content="{{ eleventy.generator }}">
<script defer src="https://stats.apps.seigler.net/script.js" data-website-id="ccb4bd94-2a71-47fe-8eea-d85bf75b7f6d"></script>
<script defer src="/scripts/effects.js"></script>
</head> </head>
<body data-font="english" data-path="{{ page.url }}"> <body data-font="english" data-path="{{ page.url }}">
{% include "-header.njk" %} {% include "-header.njk" %}

83
site/_includes/css/prism.css
View file

@ -1,4 +1,4 @@
/* Prism Material */ /* Prism Material with some adjustments */
code[class*="language-"], code[class*="language-"],
pre[class*="language-"] { pre[class*="language-"] {
text-align: left; text-align: left;
@ -45,48 +45,45 @@ p:has(>code) + pre[class*="language-"] {
} }
.token.id { font-weight: bold; } .token.id { font-weight: bold; }
.token.important { font-weight: bold; } .token.important { font-weight: bold; }
/* Prism Material Light */ /* Prism Material Light, darkened in LCH by 50% */
.language-css > code, .language-scss > code { color: oklch(0.349 0.178 36.3); }
.language-sass > code, .token.atrule { color: oklch(0.29 0.247 288.2); }
.language-scss > code { .token.attr-name { color: oklch(0.344 0.101 201.7); }
color: #f76d47; .token.attr-value { color: oklch(0.391 0.153 69.5); }
} .token.attribute { color: oklch(0.391 0.153 69.5); }
.token.atrule { color: #7c4dff; } .token.boolean { color: oklch(0.29 0.247 288.2); }
.token.attr-name { color: #39adb5; } .token.builtin { color: oklch(0.344 0.101 201.7); }
.token.attr-value { color: #f6a434; } .token.cdata { color: oklch(0.344 0.101 201.7); }
.token.attribute { color: #f6a434; } .token.char { color: oklch(0.344 0.101 201.7); }
.token.boolean { color: #7c4dff; } .token.class { color: oklch(0.344 0.101 201.7); }
.token.builtin { color: #39adb5; } .token.class-name { color: oklch(0.302 0.091 260); }
.token.cdata { color: #39adb5; } .token.comment { color: oklch(0.396 0.027 228); }
.token.char { color: #39adb5; } .token.constant { color: oklch(0.29 0.247 288.2); }
.token.class { color: #39adb5; } .token.deleted { color: oklch(0.304 0.209 27); }
.token.class-name { color: #6182b8; } .token.doctype { color: oklch(0.396 0.027 228); }
.token.comment { color: #aabfc9; } .token.entity { color: oklch(0.304 0.209 27); }
.token.constant { color: #7c4dff; } .token.function { color: oklch(0.29 0.247 288.2); }
.token.deleted { color: #e53935; } .token.hexcode { color: oklch(0.349 0.178 36.3); }
.token.doctype { color: #aabfc9; } .token.id { color: oklch(0.29 0.247 288.2); }
.token.entity { color: #e53935; } .token.important { color: oklch(0.29 0.247 288.2); }
.token.function { color: #7c4dff; } .token.inserted { color: oklch(0.344 0.101 201.7); }
.token.hexcode { color: #f76d47; } .token.keyword { color: oklch(0.29 0.247 288.2); }
.token.id { color: #7c4dff; } .token.number { color: oklch(0.349 0.178 36.3); }
.token.important { color: #7c4dff; } .token.operator { color: oklch(0.344 0.101 201.7); }
.token.inserted { color: #39adb5; } .token.prolog { color: oklch(0.396 0.027 228); }
.token.keyword { color: #7c4dff; } .token.property { color: oklch(0.344 0.101 201.7); }
.token.number { color: #f76d47; } .token.pseudo-class { color: oklch(0.391 0.153 69.5); }
.token.operator { color: #39adb5; } .token.pseudo-element { color: oklch(0.391 0.153 69.5); }
.token.prolog { color: #aabfc9; } .token.punctuation { color: oklch(0.344 0.101 201.7); }
.token.property { color: #39adb5; } .token.regex { color: oklch(0.302 0.091 260); }
.token.pseudo-class { color: #f6a434; } .token.selector { color: oklch(0.304 0.209 27); }
.token.pseudo-element { color: #f6a434; } .token.string { color: oklch(0.391 0.153 69.5); }
.token.punctuation { color: #39adb5; } .token.symbol { color: oklch(0.29 0.247 288.2); }
.token.regex { color: #6182b8; } .token.tag { color: oklch(0.304 0.209 27); }
.token.selector { color: #e53935; } .token.unit { color: oklch(0.349 0.178 36.3); }
.token.string { color: #f6a434; } .token.url { color: oklch(0.304 0.209 27); }
.token.symbol { color: #7c4dff; } .token.variable { color: oklch(0.304 0.209 27); }
.token.tag { color: #e53935; }
.token.unit { color: #f76d47; }
.token.url { color: #e53935; }
.token.variable { color: #e53935; }
/* Prism Material Dark */ /* Prism Material Dark */
[data-theme="dark"] { [data-theme="dark"] {
.language-css > code, .language-css > code,

26
site/_includes/css/site.css
View file

@ -8,15 +8,16 @@
flex-grow: 1; flex-grow: 1;
padding: 0; padding: 0;
line-height: 1.5; line-height: 1.5;
font-display: swap;
} }
body { body {
--c-highlight: oklch(100% 0 0 / 0.875); --c-highlight: oklch(100% 0 0 / 0.875);
--c-accent: white; --c-accent: white;
--c-dark: oklch(32.1% 0.022 259.9); --c-dark: oklch(32.1% 0.022 259.9);
--c-body-background: oklch(85% 0 338); --c-body-background: oklch(87.5% 0 338);
--c-bg1: oklch(85% 0.04 285); --c-bg1: oklch(87.5% 0.04 285);
--c-bg2: oklch(85% 0.04 160); --c-bg2: oklch(87.5% 0.04 160);
--c-text-background-light: oklch(96.2% 0 0 / 0.6); --c-text-background-light: oklch(96.2% 0 0 / 0.6);
--c-text-light: var(--c-highlight); --c-text-light: var(--c-highlight);
@ -44,11 +45,11 @@ body {
--inset: calc(50vw - var(--content-width) / 2); --inset: calc(50vw - var(--content-width) / 2);
background-image: background-image:
url(/noise.png), 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( radial-gradient(
circle at 120% calc(100% - 20vmin), circle at 120% calc(100% - 20vmin),
var(--c-bg2), var(--c-bg2),
transparent 60% transparent 150vmin
); );
} }
@ -106,7 +107,9 @@ body {
flex-grow: 1; flex-grow: 1;
padding: 0; padding: 0;
margin: 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); background-color: var(--c-body-background);
color: var(--c-text-dark); color: var(--c-text-dark);
} }
@ -247,7 +250,8 @@ ul.collection {
p { p {
margin: 0; margin: 0;
} }
p + p, pre + p { p + p,
pre + p {
margin-top: 1lh; margin-top: 1lh;
} }
blockquote { blockquote {
@ -546,7 +550,8 @@ a.header-anchor {
margin-bottom: 1rem; margin-bottom: 1rem;
} }
p > code, pre { p > code,
pre {
font-family: "Commit Mono", monospace; font-family: "Commit Mono", monospace;
background-color: var(--c-text-background-light); background-color: var(--c-text-background-light);
padding: 0.1em; padding: 0.1em;
@ -594,7 +599,7 @@ body .isso-input-wrapper label {
} }
body .isso-input-wrapper input, body .isso-input-wrapper input,
input[type='text'], input[type="text"],
body .isso-textarea, body .isso-textarea,
body .isso-preview { body .isso-preview {
color: inherit; color: inherit;
@ -627,7 +632,8 @@ body .isso-preview {
var(--c-text-background-light) 20px var(--c-text-background-light) 20px
); );
} }
body .isso-post-action > input, button { body .isso-post-action > input,
button {
color: inherit; color: inherit;
background-color: var(--c-text-background-light); background-color: var(--c-text-background-light);
font-size: 1rem; font-size: 1rem;

2
site/posts/2025-06-15-replacing-github-pages.md
View file

@ -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. 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` `/etc/caddy/Caddyfile`
```undefined ```caddy
# Global options block # Global options block
{ {
email you@example.com # <<<< CHANGE THIS <<<< email you@example.com # <<<< CHANGE THIS <<<<