From 8642b7dbaafc3b0ca26583cc7f62c470586a1bfa Mon Sep 17 00:00:00 2001 From: Peter Ludikovsky Date: Tue, 25 Jan 2022 08:43:11 +0100 Subject: [PATCH] Apply blog styles --- static/blog.css | 37 +++++++++++++++++++++++++++++-------- templates/index.html | 2 +- 2 files changed, 30 insertions(+), 9 deletions(-) diff --git a/static/blog.css b/static/blog.css index 31c5023..a152aa7 100644 --- a/static/blog.css +++ b/static/blog.css @@ -1,8 +1,26 @@ -@import url('https://ludikovsky.name/fonts/fonts.css'); +@import url('/fonts/fonts.css'); + +@media (prefers-color-scheme: dark) { + :root { + --main-fg-color: #fff; + --main-bg-color: #000; + --middlegray: #8c8c8c; + --bordercol: white; + } +} + +@media (prefers-color-scheme: light) { + :root { + --main-fg-color: #000; + --main-bg-color: #fff; + --middlegray: #777; + --bordercol: black; + } +} article > footer { text-align: right; - color: #777; + color: var(--middlegray); font-variant: small-caps; font-size: 11pt; } @@ -11,25 +29,24 @@ article > div { font-size: 14pt; font-family: 'DejaVu Serif', sans-serif; text-align: justify; + hyphens: auto; } article > div > aside { max-width: 50%; float: right; - border: black 1pt solid; + border: var(--bordercol) 1pt solid; padding: 6pt; margin-left: 12pt; margin-bottom: 12pt; } blockquote { - border-left-color: #777; + border-left-color: var(--middlegray); } code { font-family: 'Hack', monospace; - color: #000; - background: #fff; } body { @@ -37,7 +54,11 @@ body { font-variant-ligatures: common-ligatures; font-kerning: normal; font-family: 'DejaVu Sans', sans-serif; + background-color: var(--main-bg-color); + color: var(--main-fg-color); } -dd { - padding-left: 2em; + +img.ccimg { + border-width: 0; } + diff --git a/templates/index.html b/templates/index.html index 7f0ef14..8b846e2 100644 --- a/templates/index.html +++ b/templates/index.html @@ -1,5 +1,5 @@ - + Live Markdown