diff options
| -rw-r--r-- | config.toml | 9 | ||||
| -rw-r--r-- | netlify.toml | 4 | ||||
| -rw-r--r-- | templates/style.css | 239 | ||||
| -rw-r--r-- | vercel.json | 2 |
4 files changed, 121 insertions, 133 deletions
diff --git a/config.toml b/config.toml index 8cf932a..14c0b60 100644 --- a/config.toml +++ b/config.toml @@ -33,10 +33,11 @@ oidc_host = "https://id.alanpearce.eu/" "https://gc.zgo.at", ] style-src = [ - # index.html style - "'sha256-a4TPKWHB0aSu7cV10GthTEySTJ0w4r0bw6Q8JsNYMbk='", - # atom.xml style - "'sha256-gyxzfgCOxeAAL8URUdaW2nHYDOr9bzbwFjgSqi7D+8U='", + "'unsafe-inline'", + ## index.html style + "'sha256-50do9sS3PVRni4sYNWIx1hJuUOU9Y0GeMMwiLf8vmjc='", + ## atom.xml style + "'sha256-WIWHIhXqk7qQRekjaVXXydYSpSNixj54s4nqSMlM9Cg='", ] frame-ancestors = [ "https://kagi.com", diff --git a/netlify.toml b/netlify.toml index a218fcd..5f43058 100644 --- a/netlify.toml +++ b/netlify.toml @@ -24,8 +24,8 @@ object-src 'none'; script-src 'self' https://gc.zgo.at; style-src - 'sha256-a4TPKWHB0aSu7cV10GthTEySTJ0w4r0bw6Q8JsNYMbk=' - 'sha256-gyxzfgCOxeAAL8URUdaW2nHYDOr9bzbwFjgSqi7D+8U='; + 'sha256-50do9sS3PVRni4sYNWIx1hJuUOU9Y0GeMMwiLf8vmjc=' + 'sha256-WIWHIhXqk7qQRekjaVXXydYSpSNixj54s4nqSMlM9Cg='; form-action 'none'; base-uri 'self'; connect-src https://alanpearce-eu.goatcounter.com/count; diff --git a/templates/style.css b/templates/style.css index bd07f97..6888891 100644 --- a/templates/style.css +++ b/templates/style.css @@ -1,23 +1,43 @@ +:root { + --width: 800px; + --font-main: Verdana, sans-serif; + --font-secondary: Verdana, sans-serif; + --font-scale: 1em; + --background-color: #fff; + --heading-color: #222; + --text-color: #444; + --link-color: #3273dc; + --visited-color: #8b6fcb; + --code-background-color: #f2f2f2; + --code-color: #222; + --blockquote-color: #222; +} + +@media (prefers-color-scheme: dark) { + :root { + --background-color: #01242e; + --heading-color: #eee; + --text-color: #ddd; + --link-color: #8cc2dd; + --visited-color: #8b6fcb; + --code-background-color: #000; + --code-color: #ddd; + --blockquote-color: #ccc; + } +} + body { - font-family: Verdana, sans-serif; + font-family: var(--font-secondary); + font-size: var(--font-scale); margin: auto; - padding: 1em; - max-width: 50rem; + padding: 20px; + max-width: var(--width); text-align: left; - background-color: #fff; + background-color: var(--background-color); word-wrap: break-word; overflow-wrap: break-word; line-height: 1.5; - color: #444; -} - -.skip { - position: absolute; - top: -3em; - background: #fff; -} -.skip:focus { - top: 0; + color: var(--text-color); } h1, @@ -25,60 +45,34 @@ h2, h3, h4, h5, -h6, -strong, -b { - color: #222; +h6 { + font-family: var(--font-main); + color: var(--heading-color); + & > a { + color: var(--heading-color); + } } a { - color: #3273dc; -} - -.title { - color: #222; - text-decoration: none; - border: 0; -} - -.filter { - margin-bottom: 0; -} - -time { - font-style: italic; + color: var(--link-color); + cursor: pointer; } nav a { - margin-right: 1ex; -} - -.tags { - padding: unset; - font-size: small; -} - -.tags ul { - display: inline-block; -} - -.tags li { - list-style: none; - display: inline-block; - padding-right: 1ex; + margin-right: 8px; } -textarea { - width: 100%; - font-size: 1rem; +strong, +b { + color: var(--heading-color); } -input { - font-size: 1rem; +button { + margin: 0; + cursor: pointer; } -main, -article { +main { line-height: 1.6; } @@ -86,38 +80,27 @@ table { width: 100%; } +hr { + border: 0; + border-top: 1px dashed; +} + img { max-width: 100%; } code { - padding: 2px 5px; - background-color: #f2f2f2; -} - -pre code { - color: #222; - display: block; - padding: 20px; - white-space: pre-wrap; - font-size: 0.875rem; - overflow-x: auto; -} - -div.highlight pre { - background-color: initial; - color: initial; -} - -div.highlight code { - background-color: unset; - color: unset; + font-family: monospace; + padding: 2px; + background-color: var(--code-background-color); + color: var(--code-color); + border-radius: 3px; } blockquote, .aside { border-left: 1px solid #999; - color: #222; + color: var(--code-color); padding-left: 20px; font-style: italic; } @@ -127,16 +110,34 @@ blockquote, } footer { - padding: 25px; + padding: 25px 0; text-align: center; } -.helptext { - color: #777; - font-size: small; +.title:hover { + text-decoration: none; +} + +.title h1 { + font-size: 1.5em; +} + +.inline { + width: auto !important; +} + +.highlight, +.code { + padding: 1px 15px; + background-color: var(--code-background-color); + color: var(--code-color); + border-radius: 3px; + margin-block-start: 1em; + margin-block-end: 1em; + overflow-x: auto; } -/* blog posts */ +/* blog post list */ ul.h-feed { list-style-type: none; padding: unset; @@ -151,56 +152,42 @@ ul.h-feed li span { } ul.h-feed li a:visited { - color: #8b6fcb; + color: var(--visited-color); } -svg.rss-icon { - width: 1.5ex; - height: 1.5ex; +.title { + text-decoration: none; } -@media (prefers-color-scheme: dark) { - body { - background-color: #333; - color: #ddd; - } - - h1, - h2, - h3, - h4, - h5, - h6, - strong, - b, - .title { - color: #eee; - } - - a { - color: #8cc2dd; - } +.filter { + margin-bottom: 0; +} - code { - background-color: #777; - } +.skip { + position: absolute; + top: -3em; + background: var(--background-color); +} - pre code { - color: #ddd; - } +.skip:focus { + top: 0; +} - blockquote, - .aside { - color: #ccc; - } +.tags { + font-size: small; +} - textarea, - input { - background-color: #252525; - color: #ddd; - } +.p-categories, +ul.tags { + display: inline-block; + padding-inline-start: 0; +} +.tags li { + list-style: none; + display: inline-block; +} - .helptext { - color: #aaa; - } +svg.rss-icon { + height: 1.5ex; + width: 1.5ex; } diff --git a/vercel.json b/vercel.json index aebaf54..4572fce 100644 --- a/vercel.json +++ b/vercel.json @@ -47,7 +47,7 @@ }, { "key": "Content-Security-Policy", - "value": "default-src 'none'; img-src 'self' https://gc.zgo.at; object-src 'none'; script-src https://gc.zgo.at; style-src 'sha256-a4TPKWHB0aSu7cV10GthTEySTJ0w4r0bw6Q8JsNYMbk=' 'sha256-gyxzfgCOxeAAL8URUdaW2nHYDOr9bzbwFjgSqi7D+8U='; form-action 'none'; base-uri 'self'; frame-ancestors https://kagi.com; connect-src https://alanpearce-eu.goatcounter.com/count" + "value": "default-src 'none'; img-src 'self' https://gc.zgo.at; object-src 'none'; script-src https://gc.zgo.at; style-src 'sha256-50do9sS3PVRni4sYNWIx1hJuUOU9Y0GeMMwiLf8vmjc=' 'sha256-WIWHIhXqk7qQRekjaVXXydYSpSNixj54s4nqSMlM9Cg='; form-action 'none'; base-uri 'self'; frame-ancestors https://kagi.com; connect-src https://alanpearce-eu.goatcounter.com/count" }, { "key": "Cache-Control", |