diff --git a/config.yml b/config.yml index d496484..e1eec62 100644 --- a/config.yml +++ b/config.yml @@ -1,6 +1,6 @@ base_url: / sitemap: - Home: / + # Home: / About: /about Blog: /blog Now: /now diff --git a/content/blog/email-formatting.md b/content/blog/email-formatting.md index 0f97e80..0c3449b 100644 --- a/content/blog/email-formatting.md +++ b/content/blog/email-formatting.md @@ -8,18 +8,34 @@ draft: true [Kakoune]: https://kakoune.org +[^html]: The first email was sent in 1971 --- HTML was specified in 1990. + +[TOC] + As I've [mentioned before](./email-in-kakoune.md), I like using [Kakoune] for reading & writing emails. Of course, Kakoune is a text editor, not a _rich text_ -editor. It operates on UTF-8 _plaintext_ --- which means that the emails I write -need to be in plaintext, too. +editor. It operates on UTF-8 _plain text_ --- which means that the emails I +write need to be in plain text, too. -As I went down this path, I quickly discovered that I needed an **email -formatter**. I eventually wrote [`mailfmt`](https://git.sr.ht/~ficd/mailfmt) to -fill this niche. It provides consistent paragraph spacing, hard-wrapping and -paragraph reflow, while preserving Markdown syntax, email headers, quotes, -sign-offs, and signature blocks. Additionally, the wrapped output can be made -safe for passing to a Markdown parser. This is useful if you want to build an -HTML email from plain-text. +As it turns out, plain-text email (which predates HTML by decades[^html]) hasn't +really left a "legacy" so much as it _hasn't actually gone anywhere_. Many +developers swear by it; some are even so committed as to automatically filter +`text/html` mail as spam. If you want to learn more, you can begin by reading +[Drew DeVault's post](https://drewdevault.com/2016/04/11/Please-use-text-plain-for-emails.html), +[useplaintext.email](https://useplaintext.email/#why-plaintext), and sourcehut's +[mailing list etiquette](https://man.sr.ht/lists.sr.ht/etiquette.md) guide. + +As I went down `text/plain` path, I quickly learned that I needed an **email +formatter**. Plain text is like source code. You can't rely on the recipient's +mail client to render it in a certain way --- most often, what you see is +_exactly_ what they get. + +I eventually wrote [`mailfmt`](https://git.ficd.sh/ficd/mailfmt) to fill this +niche. It provides consistent paragraph spacing, hard-wrapping and paragraph +reflow, while preserving Markdown syntax, email headers, quotes, sign-offs, and +signature blocks. Additionally, the wrapped output can be made safe for passing +to a Markdown parser. This is useful if you want to build an HTML email from +plain-text. `mailfmt` open-source under the ISC license, and is available on [PyPI](https://pypi.org/project/mailfmt/) for installation with tools like diff --git a/content/index.md b/content/index.md index af7b1bd..8b56c3b 100644 --- a/content/index.md +++ b/content/index.md @@ -3,15 +3,9 @@ title: ficd.sh show_title: false --- -
- -

Daniel Fichtinger

- -
-
-![Me (approximate likeness).](/static/images/dithered_ficd.jpg) +![Daniel Fichtinger (approximate likeness).](/static/images/dithered_ficd.jpg)
diff --git a/content/static/style.css b/content/static/style.css index 284a5ce..56bbae9 100644 --- a/content/static/style.css +++ b/content/static/style.css @@ -1,14 +1,17 @@ :root { --main-text-color: #b4b4b4; + --main-text-opaque-color: rgba(180, 180, 180, 0.8); --main-bg-color: #121212; --main-link-color: #df6464; --main-heading-color: #df6464; --main-bullet-color: #d87c4a; + --orange-rgb: rgba(216, 124, 74, 0.6); --main-transparent: rgba(255, 255, 255, 0.15); --main-small-text-color: rgba(255, 255, 255, 0.45); } body { + margin: 0; line-height: 1.6; font-size: 18px; font-family: sans-serif; @@ -17,6 +20,20 @@ body { padding-left: calc(100vw - 100%); } +header { + padding-top: -1rem; + margin-top: -1rem; + font-family: monospace; + text-transform: lowercase; +} + +.site-logo { + color: inherit; + font-weight: bold; + text-decoration: none; + /* font-size: 1.75rem;*/ +} + .toclink { position: relative; text-decoration: none; @@ -128,11 +145,28 @@ li::marker { a { color: var(--main-link-color); - text-decoration: underline; + text-decoration: none; + position: relative; } -a:hover { - background: var(--main-transparent); +a::after { + content: ""; + position: absolute; + left: 0; + bottom: -2px; + width: 100%; + height: 1px; + background-color: currentColor; + transform: scaleX(0); + transform-origin: center; + transition: transform 0.1s ease; +} + +a:hover::after { + transform: scaleX(1); +} +a:has(> code)::after { + display: none; } max-width: 100%; @@ -146,8 +180,8 @@ img { } blockquote { - color: var(--main-small-text-color); - border-left: 3px solid var(--main-transparent); + color: var(--main-text-opaque-color); + border-left: 3px solid var(--orange-rgb); padding: 0 1rem; margin-left: 0; margin-right: 0; @@ -157,6 +191,16 @@ hr { border: none; height: 1px; background: var(--main-small-text-color); + opacity: 0.5; +} + +time { + color: var(--main-bullet-color); + font-family: monospace; +} + +.post-list-date { + font-size: 0.95rem; } code { @@ -183,7 +227,7 @@ pre { } pre { - background-color: #151515; + background-color: #1d1d1d; color: #d5d5d5; padding: 1em; border-radius: 5px; @@ -362,13 +406,20 @@ caption { a > code { text-decoration: none; - color: inherit; + color: var(--main-link-color); + position: relative; } a:has(> code) { text-decoration: none; + background: none; + /* position: static;*/ } a:hover > code { - background-color: var(--main-transparent); + text-decoration: underline; +} + +a:hover:has(> code) { + background: none; } diff --git a/templates/header.html b/templates/header.html index 7c09ff6..1064e6e 100644 --- a/templates/header.html +++ b/templates/header.html @@ -1,7 +1,8 @@
-
ficd.sh