diff --git a/_data/blogroll.js b/_data/blogroll.js index 734af18..6b6be76 100644 --- a/_data/blogroll.js +++ b/_data/blogroll.js @@ -304,6 +304,13 @@ export default { url: "https://www.neatorama.com/", description: "Yep, Neatorama's still around!", }, + { + title: "Public Domain Review", + feedUrl: "https://publicdomainreview.org/rss.xml", + url: "https://publicdomainreview.org", + description: + "The Public Domain Review is an online journal and not-for-profit project dedicated to the exploration of curious and compelling works from the history of art, literature, and ideas.", + }, { title: "The Pudding", feedUrl: "https://pudding.cool/rss.xml", @@ -501,6 +508,13 @@ export default { description: "Started in 1997 by Floor64 founder Mike Masnick and then growing into a group blogging effort, the Techdirt blog relies on a proven economic framework to analyze and offer insight into news stories about changes in government policy, technology and legal issues that affect companies’ ability to innovate and grow.", }, + { + title: "The Canary", + feedUrl: "https://www.thecanary.co/feed/", + url: "https://www.thecanary.co/", + description: + "The Canary is a anti-oppression, decolonised, and recolonised radical media outlet that publishes the truth without fear or favour. We publish stories that matter to ordinary people across the UK, whether the corporate and state media like it or not.", + }, { title: "Usermag", feedUrl: "https://www.usermag.co/feed", @@ -593,6 +607,14 @@ export default { description: "Writing on wet shaving, politics, whole food plant based diets, and more.", }, + { + title: "lemon ice cream", + feedUrl: + "https://soundsoflemonicecream.blogspot.com/feeds/posts/default?alt=rss", + url: "https://soundsoflemonicecream.blogspot.com/", + description: + "annabelle kathleen marcile akers - aka lemon ice cream.", + }, { title: "MediaActivist", feedUrl: "https://www.mediaactivist.com/rss/", diff --git a/_data/galleries.js b/_data/galleries.js index 7f07152..3687085 100644 --- a/_data/galleries.js +++ b/_data/galleries.js @@ -1,4 +1,89 @@ export default [ + { + title: "Wild Berry Fizzy Pop Powder", + description: + "Recording my experience burning Wild Berry’s Fizzy Pop incense powder.", + synopsis: + "Recording my experience burning Wild Berry’s Fizzy Pop incense powder.", + url: "/img/gallery/wild-berry-fizzy-pop/", + date: new Date("May 28, 2026"), + galleryImage: "wild-berry-fizzy-pop-powder-8.webp", + galleryImageAlt: "", + pictures: [ + { + title: "Preparing the censer", + filename: "wild-berry-fizzy-pop-powder-1.webp", + altText: + "A brass incense censer with a tool holder and stencil next to a jar of the incense powder.", + thumbAltText: + "A brass incense censer with a tool holder and stencil next to a jar of the incense powder.", + caption: "I feel guilty for sullying this censer.", + }, + { + title: "Electric blue", + filename: "wild-berry-fizzy-pop-powder-8.webp", + altText: + "A brass incense spoon scooping bright blue powder from the top of a jar.", + thumbAltText: + "A brass incense spoon scooping bright blue powder from the top of a jar.", + caption: "Just look at the color of this stuff!", + }, + { + title: "Adding powder", + filename: "wild-berry-fizzy-pop-powder-2.webp", + altText: + "Putting the electric blue powder atop the brass stencil with a tiny incense spoon.", + thumbAltText: + "Putting the electric blue powder atop the brass stencil with a tiny incense spoon.", + caption: "No turning back now.", + }, + { + title: "Adding more powder", + filename: "wild-berry-fizzy-pop-powder-3.webp", + altText: + "Putting more electric blue powder atop the brass stencil with a tiny incense spoon.", + thumbAltText: + "Putting more electric blue powder atop the brass stencil with a tiny incense spoon.", + caption: "Fully committing.", + }, + { + title: "Stencil loaded", + filename: "wild-berry-fizzy-pop-powder-4.webp", + altText: + "The grooves of the brass stencil are full of blue incense powder, revealing the shape of an auspicious cloud.", + thumbAltText: + "The grooves of the brass stencil are full of blue incense powder, revealing the shape of an auspicious cloud.", + caption: "That color is wild.", + }, + { + title: "Time to get lit", + filename: "wild-berry-fizzy-pop-powder-5.webp", + altText: + "A plasma lighter hovers ominously over the tail of a trail of blue incense powder in the shape of an auspicious cloud, atop a flat layer of ash in a brass censer.", + thumbAltText: + "A plasma lighter hovers ominously over the tail of a trail of blue incense powder in the shape of an auspicious cloud, atop a flat layer of ash in a brass censer.", + caption: "Here we go.", + }, + { + title: "Time to get lit", + filename: "wild-berry-fizzy-pop-powder-6.webp", + altText: + "A long, angry-looking ember travels down the trail of blue incense powder.", + thumbAltText: + "A long, angry-looking ember travels down the trail of blue incense powder.", + caption: "What a wicked looking ember.", + }, + { + title: "Finally over", + filename: "wild-berry-fizzy-pop-powder-7.webp", + altText: + "A long, angry-looking ember lights the final stretch of the incense seal, leaving a trail of very dark black ash.", + thumbAltText: + "A long, angry-looking ember lights the final stretch of the incense seal, leaving a trail of very dark black ash.", + caption: "At last.", + }, + ], + }, { title: "Cooking", description: "Some stuff I've made in the kitchen.", diff --git a/_data/metadata.js b/_data/metadata.js index 0a76532..06530d5 100644 --- a/_data/metadata.js +++ b/_data/metadata.js @@ -1,12 +1,57 @@ export default { + blogName: "The Stochastic Bletherist", title: "Nathan Upchurch", logo: "/img/logo.svg", holidayLogo: "", url: "https://nathanupchurch.com/", language: "en", + pageELementBackgroundImage: + "/img/Still_Life_with_Lemons_Oranges_and_a_Pomegranate_about_1620–1630_Jacob_van_Hulsdonck.webp", + defaultHeroImage: + "/img/Still_Life_with_Lemons_Oranges_and_a_Pomegranate_about_1620–1630_Jacob_van_Hulsdonck.webp", description: "The personal website and blog of Nathan Upchurch, where I write about incense, free and open source software, design, vegan cooking, music, and all sorts of other topics that I find interesting.", + footerLinks: [ + { + linkDisplay: "About", + linkURL: "/about/", + }, + { + linkDisplay: "Blog", + linkURL: "/blog/", + }, + { + linkDisplay: "Contact", + linkURL: "/me/", + }, + { + linkDisplay: "Colophon", + linkURL: "/about/colophon/", + }, + { + linkDisplay: "Feed", + linkURL: "/feed/feed.xml", + }, + { + linkDisplay: "Privacy", + linkURL: "/about/privacy/", + }, + { + linkDisplay: "Search", + linkURL: "/search/", + }, + { + linkDisplay: "Site Settings", + linkURL: "#", + onClick: "event.preventDefault();siteSettings.showModal()", + }, + { + linkDisplay: "Sitemap", + linkURL: "/sitemap/", + }, + ], author: { + bio: "Nathan likes to cook vegan food, play the trombone, make incense, design stuff, muck about with free software and tech, and more. He dreams of living in a cottage somewhere and spending his days making incense sticks. Sadly, he can not afford to do this.", givenName: "Nathan", familyName: "Upchurch", name: "Nathan Upchurch", @@ -22,77 +67,127 @@ export default { mastodonUser: "nathanu", navigatorLinks: [ { - iconURL: "/img/icons/breeze/typewriter.svg", + iconSVG: ` + + + `, linkDisplay: "Blog", linkURL: "/blog/", }, { - iconURL: "/img/icons/breeze/view-list-text.svg", + iconSVG: ` + + + `, linkDisplay: "Blogroll", linkURL: "/blogroll/", }, { - iconURL: "/img/icons/breeze/view-preview.svg", + iconSVG: ` + + + `, linkDisplay: "Galleries", linkURL: "/galleries/", }, { - iconURL: "/img/icons/breeze/story-editor.svg", + iconSVG: ` + + + `, linkDisplay: "Guestbook", linkURL: "/guestbook/", }, { - iconURL: "/img/censer_short.svg", + iconSVG: ` + + + + + + `, linkDisplay: "Incense", linkURL: "/incense/", }, { - iconURL: "/img/icons/breeze/news-subscribe.svg", + iconSVG: ` + + + `, linkDisplay: "Life Updates", linkURL: "/now/", }, { - iconURL: "/img/icons/breeze/link-symbolic.svg", + iconSVG: ` + + + + + `, linkDisplay: "Links", linkURL: "/links/", }, { - iconURL: "/img/icons/breeze/amarok_cart_view.svg", + iconSVG: ` + + + `, linkDisplay: "Not Amazon", linkURL: "/not-amazon/", }, { - iconURL: "/img/burn.svg", + iconSVG: ` + + + `, linkDisplay: "Now Burning", linkURL: "/now-burning/", }, { - iconURL: "/img/icons/breeze/document-edit-sign.svg", + iconSVG: ` + + + `, linkDisplay: "Quizzes", linkURL: "/quizzes/", }, { - iconURL: "/img/icons/breeze/file-search-symbolic.svg", + iconSVG: ` + + + `, linkDisplay: "Search", linkURL: "/search/", }, { - iconURL: "/img/icons/breeze/map-globe.svg", + iconSVG: ` + + + `, linkDisplay: "Sitemap", linkURL: "/sitemap/", }, { - iconURL: "/img/icons/breeze/clock-symbolic.svg", + iconSVG: ` + + + `, linkDisplay: "Status", linkURL: "/status/", }, { - iconURL: "/img/icons/breeze/tag.svg", + iconSVG: ` + + + `, linkDisplay: "Topics", linkURL: "/tags/", }, { - iconURL: "/img/icons/breeze/kstars_supernovae.svg", + iconSVG: ` + + + `, linkDisplay: "Wishes", linkURL: "/wish/", }, @@ -105,77 +200,106 @@ export default { title: "My Blog", linkURL: "https://nathanupchurch.com", linkDisplay: "Blog", - iconURL: "/img/logo.svg", + iconSVG: ``, }, { customAttribute: `rel="me"`, title: "BookWyrm", linkURL: "https://ramblingreaders.org/user/NathanU", linkDisplay: "BookWyrm", - iconURL: "/img/book.svg", + iconSVG: ` + + + `, }, { customAttribute: `rel="me"`, title: "Email Me", linkURL: "Mailto:blog@upchur.ch", linkDisplay: "Email", - iconURL: "/img/envelope.svg", + iconSVG: ` + + + `, }, { customAttribute: `rel="me"`, title: "Friendica", linkURL: "https://friendica.world/profile/nathan", linkDisplay: "Friendica", - iconURL: "/img/friendica.svg", + iconSVG: ``, }, { customAttribute: `rel="me"`, title: "Keyoxide Identity Profile", linkURL: "https://keyoxide.org/31E809FAEA1532AC91BBDCF1EC499D3513F69340", linkDisplay: "Keyoxide", - iconURL: "/img/keyoxide.svg", + iconSVG: ` + + + + + `, }, { customAttribute: `rel="me"`, title: "Lemmy", linkURL: "https://lemmy.ml/u/NathanUp", linkDisplay: "Lemmy", - iconURL: "/img/Lemmy_logo.svg", + iconSVG: ``, }, { customAttribute: `rel="me"`, title: "Mastodon", linkURL: "https://lounge.town/@nathanu", linkDisplay: "Mastodon", - iconURL: "/img/mastodon.svg", + iconSVG: ` + + + `, }, { customAttribute: `rel="me"`, title: "Matrix", linkURL: "https://matrix.to/#/@nathan:upchur.ch", linkDisplay: "Matrix", - iconURL: "/img/matrix-org.svg", + iconSVG: ` + + + `, }, { customAttribute: `rel="me"`, title: "Movim", linkURL: "https://xmpp.earth/blog/Nathan", linkDisplay: "Movim", - iconURL: "/img/movim.svg", + iconSVG: ``, }, { customAttribute: `rel="me"`, title: "PeerTube", linkURL: "https://makertube.net/a/nathan/video-channels", linkDisplay: "PeerTube", - iconURL: "/img/peertube.svg", + iconSVG: ` + + + + + + + `, }, { customAttribute: `rel="me"`, title: "Pixelfed", linkURL: "https://pixelfed.social/@nathanu", linkDisplay: "Pixelfed", - iconURL: "/img/pixelfed.svg", + iconSVG: ` + + + `, }, { customAttribute: `rel="me"`, @@ -183,25 +307,34 @@ export default { linkURL: "https://signal.me/#eu/j-om4cfsGXtfKo0UX28EQfEL_Gd1KpJr8nQpI9Smhdsb-r98eT5F6obQ1BcYZCcW", linkDisplay: "Signal", - iconURL: "/img/Signal-Logo-White.svg", + iconSVG: ` + + + + + + `, }, { customAttribute: `rel="me"`, title: "XMPP", linkURL: "xmpp:nathan_u@member.fsf.org", linkDisplay: "XMPP", - iconURL: "/img/XMPP.svg", + iconSVG: ` + + + `, }, { customAttribute: `rel="me"`, title: "WAFRN", linkURL: "https://app.wafrn.net/blog/nathan", linkDisplay: "WAFRN", - iconURL: "/img/wafrn.svg", + iconSVG: ``, }, ], weatherOnByDefault: false, - weatherSymbol: "🌸", + weatherSymbol: "🌞", webrings: [ { name: "Fediring", diff --git a/_includes/articleAuthor.njk b/_includes/articleAuthor.njk new file mode 100644 index 0000000..0f0337e --- /dev/null +++ b/_includes/articleAuthor.njk @@ -0,0 +1,51 @@ +
+ {% if author %} + {% if author.profilePic %} + {% if author.url %} + + {% endif %} + + {% if author.url %} + + {% endif %} + {% endif %} +

+ {% if author.url %} + + {% endif %} + {% if author.name %} + {{ author.name }} + {% endif %} + {% if author.url %} + + {% endif %} + {% if author.bio %} +
{{ author.bio }} + {% endif %} +

+ {% else %} + {% if metadata.author.profilePic %} + {% if metadata.author.url %} + + {% endif %} + + {% if metadata.author.url %} + + {% endif %} + {% endif %} +

+ {% if metadata.author.url %} + + {% endif %} + {% if metadata.author.name %} + {{ metadata.author.name }} + {% endif %} + {% if metadata.author.url %} + + {% endif %} + {% if metadata.author.bio %} +
{{ metadata.author.bio }} + {% endif %} + {% endif %} +

+
diff --git a/_includes/footer.njk b/_includes/footer.njk index 151b424..f99391b 100644 --- a/_includes/footer.njk +++ b/_includes/footer.njk @@ -1,22 +1,25 @@ +{% include "settings/siteSettings.njk" %} diff --git a/_includes/header.njk b/_includes/header.njk index 4471aa6..93f18fc 100644 --- a/_includes/header.njk +++ b/_includes/header.njk @@ -1,12 +1,4 @@
- - - {% if not hideNav %}{% include "nav.njk" %}{% endif %}
diff --git a/_includes/layouts/base.njk b/_includes/layouts/base.njk index ebd6a5c..c1a2336 100644 --- a/_includes/layouts/base.njk +++ b/_includes/layouts/base.njk @@ -13,18 +13,9 @@ {% if tags and tags.includes('galleryImage') %} {% endif %} - {% if tags and tags.includes('metadata') %} - - {% endif %} {% if tags and tags.includes('navigator') %} {% endif %} - {% if tags and tags.includes('profilePic') %} - - {% endif %} - {% if tags and tags.includes('postList') %} - - {% endif %} {% if tags and tags.includes('tagList') %} {% endif %} @@ -86,8 +77,8 @@ {% endif %} - {% include "birb.njk" %} {% include "footer.njk" %} + {% include "birb.njk" %} {% include "weather.njk" %} {% include "wooMode.njk" %} {% include "settings/settingsConfig.njk" %} diff --git a/_includes/layouts/links.njk b/_includes/layouts/links.njk index 90b8c31..bffd8cb 100644 --- a/_includes/layouts/links.njk +++ b/_includes/layouts/links.njk @@ -8,7 +8,7 @@ layout: layouts/linksPage.njk
{% for link in metadata.socialLinks %} - + {% endfor %}
diff --git a/_includes/layouts/post.njk b/_includes/layouts/post.njk index fa30c85..f030e6c 100644 --- a/_includes/layouts/post.njk +++ b/_includes/layouts/post.njk @@ -2,44 +2,39 @@ layout: layouts/base.njk ---
-

{{ title | markdownify | safe}}

-{% include "mastodonComments.njk" %} -{% if not hideMetadata %} -
- {% if author %} - {% if author.profilePic %} - - {% endif %} -
-

{% if author.url %}{% endif %} - {% if author.name %}By {{ author.name }}{% endif %}{% if author.url %} • {% endif %} • {{ content | emojiReadTime }}

- - {% else %} - {% if metadata.author.profilePic %} - - {% endif %} -
-

{% if metadata.author.url %}{% endif %} - {% if metadata.author.name %}By {{ metadata.author.name }}{% endif %}{% if metadata.author.url %} • {% endif %}{% if tags and not tags.includes('quiz') %} • {{ content | emojiReadTime }}{% endif %}

- - {% endif %} - - -
    - {%- for tag in tags | filterTagList %} - {%- set tagUrl %}/tags/{{ tag | slugify }}/{% endset %} -
  • - - {{ tag }}  - -
    • - {%- endfor %} -
+
+
+

+ {%- for tag in tags | filterTagList %} + {%- set tagUrl %}/tags/{{ tag | slugify }}/{% endset %} + #{{ tag }}  + {%- endfor %} +

+

{{ title | markdownify | safe}}

+ {% if synopsis %} +

+ {{ synopsis | markdownify | safe}} +

+ {% endif %} + {% if tags and tags.includes('quiz') %} +

+ {{ content | markdownify | safe}} +

+ {% endif %} + {% if not tags.includes('quiz') %} + {% if imageURL %} + {{ imageAlt }} + {% endif %} +

+
+ By {% if author %}{{ author.name }}{% else %}{{ metadata.author.name }}{% endif %}

+ {% endif %} +
-
-{% endif %} -{{ content | safe }} +{% if tags and not tags.includes('quiz') %}{{ content | safe }}{% endif %}
+{% if tags and not tags.includes('quiz') %} +{% include "articleAuthor.njk" %} +{% include "mastodonComments.njk" %} +{% endif %} {% include "issoCommenting.njk" %} diff --git a/_includes/layouts/quizzes.njk b/_includes/layouts/quizzes.njk index 7bfc0be..2622bd2 100644 --- a/_includes/layouts/quizzes.njk +++ b/_includes/layouts/quizzes.njk @@ -3,6 +3,12 @@ layout: layouts/post.njk structuredData: none --- {{ content | safe }} +{% if imageURL %} + {{ imageAlt }} +{% endif %} +

+
+ By {% if author %}{{ author.name }}{% else %}{{ metadata.author.name }}{% endif %}

{% for question in questions %} diff --git a/_includes/mastodonComments.njk b/_includes/mastodonComments.njk index 8d251f9..74f14f6 100644 --- a/_includes/mastodonComments.njk +++ b/_includes/mastodonComments.njk @@ -2,7 +2,15 @@
diff --git a/_includes/nav.njk b/_includes/nav.njk index d0360be..cbc9d12 100644 --- a/_includes/nav.njk +++ b/_includes/nav.njk @@ -1,10 +1,24 @@ diff --git a/_includes/navigator.njk b/_includes/navigator.njk index 121349e..5bf61a3 100644 --- a/_includes/navigator.njk +++ b/_includes/navigator.njk @@ -2,7 +2,7 @@ {% for link in metadata.navigatorLinks %}
- + {{ link.iconSVG | safe }}

{{ link.linkDisplay }}
diff --git a/_includes/permalinkButtons.njk b/_includes/permalinkButtons.njk index 332f900..4dcb9f6 100644 --- a/_includes/permalinkButtons.njk +++ b/_includes/permalinkButtons.njk @@ -1,12 +1,14 @@ {% set numPages = pagination.pages | length %} -{% if pagination.pageNumber > 0 %} - - - -{% endif %} + + {% if pagination.pageNumber > 0 %} + + + + {% endif %} -{% if pagination.pageNumber < numPages - 1 %} - - - -{% endif %} + {% if pagination.pageNumber < numPages - 1 %} + + + + {% endif %} + diff --git a/_includes/postslist.njk b/_includes/postslist.njk index 15e1fe7..ea49fee 100644 --- a/_includes/postslist.njk +++ b/_includes/postslist.njk @@ -1,17 +1,8 @@
- {% if postlistHeaderText %}

{{ postlistHeaderText }}

{% endif %} + {% if postlistHeaderText %}

{{ postlistHeaderText }}

{% endif %}
{% for post in postslist %}
- - {% if not postListTypeMicroblog %} - -
- {{ post.data.imageAlt }} -
- - {% endif %} -
{% if not postListTypeMicroblog %} @@ -23,6 +14,13 @@ {% endif %} + {% if post.data.synopsis %} +

{{ post.data.synopsis | markdownify | safe }}

+ {% endif %} + {% if not post.data.synopsis and post.data.description %} +

{{ post.data.description | markdownify | safe }}

+ {% endif %} +

@@ -32,30 +30,25 @@ {% endif %} {% if post.data.author.name %} - By {{ post.data.author.name }} + {{ post.data.author.name }} {% endif %} {% if post.data.author.url %} •  {% endif %} - {% else %}By {{ metadata.author.name }} •  + {% else %}{{ metadata.author.name }} •  {% endif %} {% endif %}

-
    - {%- for tag in post.data.tags | filterTagList %} - {%- set tagUrl %}/tags/{{ tag | slugify }}/{% endset %} -
  • - - {{ tag }}  - -
    • - {%- endfor %} -
+ {% if not postListTypeMicroblog %} + +
+ {{ post.data.imageAlt }} +
+ + {% endif %}
{% endfor %} diff --git a/_includes/settings/siteSettings.njk b/_includes/settings/siteSettings.njk index 345fc0a..fb09d7b 100644 --- a/_includes/settings/siteSettings.njk +++ b/_includes/settings/siteSettings.njk @@ -1,5 +1,4 @@
-

Site Settings

{% include "settings/controllers/birbController.njk" %} diff --git a/_includes/statusList.njk b/_includes/statusList.njk index b0d1d56..6f32edc 100644 --- a/_includes/statusList.njk +++ b/_includes/statusList.njk @@ -7,28 +7,27 @@ {{ status.data.emoji }}
-

- - {% if metadata.author.url %} - +

+ + {% if metadata.author.url %} + + {% endif %} + + {% if metadata.author.name %} + {{ metadata.author.name }} + {% endif %} + + {% if metadata.author.url %} + + {% endif %} + • {{ status.date | niceDate }}
+ + {% if status.data.comment %} + {{ status.data.comment | markdownify | safe }}
{% endif %} - - {% if metadata.author.name %} - {{ metadata.author.name }} - {% endif %} - - {% if metadata.author.url %} -
- {% endif %} - - - {{ status.data.comment | markdownify | safe }}
- - - {{ status.date | niceDate }} - -

+

+
{% endfor %} diff --git a/content/about-feeds/index.md b/content/about-feeds/index.md index 2bab46d..5402d56 100644 --- a/content/about-feeds/index.md +++ b/content/about-feeds/index.md @@ -1,10 +1,11 @@ --- -layout: layouts/post.njk -title: How to Use Feeds +layout: layouts/base.njk +title: Nathan Upchurch | How to Use Feeds structuredData: none -hideMetadata: yep --- -

+
+ +

How to Use Feeds

Get all the latest content from your favorite creators with no algorithm, no spam, and no spying. This page is based on [Matt Webb](https://interconnected.org)'s *[About Feeds](https://aboutfeeds.com/)*. @@ -66,3 +67,5 @@ It doesn't matter which you choose; newsreaders usually make it fairly easy to e [^1]: Please note that I haven't tested all of these options personally; your mileage may vary. + +
diff --git a/content/about/index.md b/content/about/index.md index 67f485a..ff49125 100644 --- a/content/about/index.md +++ b/content/about/index.md @@ -10,16 +10,17 @@ eleventyNavigation:

I’m a prolific vegan home cook, classical trombonist, incense maker, a FLOSS enthusiast, designer, programmer, music producer, print lover, and human with too many interests and too little time.

This is my little corner of the internet where I talk about whatever I like without worrying about maintaining a ‘personal brand’, or constraining my writing to topics which might help advance my career or establish me as a ‘thought leader’. I’m here to express myself and have fun writing about topics I enjoy.

If you’d like to learn more about my professional accomplishments and work, I’ll link my professional website here when I get around to it.

- - - + + + + - - - - - - - + + + + + + + diff --git a/content/blog/an-evening-with-americas-best-incense-wild-berry.md b/content/blog/an-evening-with-americas-best-incense-wild-berry.md index 7739c6d..b7a9f15 100644 --- a/content/blog/an-evening-with-americas-best-incense-wild-berry.md +++ b/content/blog/an-evening-with-americas-best-incense-wild-berry.md @@ -23,7 +23,7 @@ As I brought my laundry basket downstairs earlier today I checked the front porc The "eleven inch" sticks all come markedly short of eleven inches, and they each have some three-plus inches of bare bamboo stick. Some appear to be machine extruded while others show a coating gradient typical with powder-coated sticks. Strange. I start with a strawberry cone: ## Strawberry (Cones) -I'm *sure* I've had these before. I have a feeling they may have been among the incense I picked up from a gas station I once frequented not only for [the drinks with the wee glass lizards on them](https://www.reddit.com/media?url=https%3A%2F%2Fi.redd.it%2Feaqi1o3yv2441.jpg)[^3], but for their gargantuan incense display. The cones have surprisingly little fragrance before they are burned. Upon lighting, they produce a large amount of smoke. There is a sweet, strikingly artificial, strawberry-like fragrance in the burn. It's reminds me of a strawberry juice-box or fruit snack that's 99% apple juice with a hint of strawberry essence. But mostly, I smell the charcoal and some accelerant. The smell is nostalgic, but not good by any stretch. My throat is already feeling slightly irritated; an inauspicious start. Moving on swiftly. +I'm *sure* I've had these before. I have a feeling they may have been among the incense I picked up from a gas station I once frequented not only for [the drinks with the wee glass lizards on them](https://www.reddit.com/media?url=https%3A%2F%2Fi.redd.it%2Feaqi1o3yv2441.jpg)[^3], but for their gargantuan incense display. The cones have surprisingly little fragrance before they are burned. Upon lighting, they produce a large amount of smoke. There is a sweet, strikingly artificial, strawberry-like fragrance in the burn. It reminds me of a strawberry juice-box or fruit snack that's 99% apple juice with a hint of strawberry essence. But mostly, I smell the charcoal and some accelerant. The smell is nostalgic, but not good by any stretch. My throat is already feeling slightly irritated; an inauspicious start. Moving on swiftly. ## Coconut These have a very strong fragrance on the stick. It's sweet and acidic, almost more like a piña colada than coconut. It smells quite delicious. This fragrance is also inducing some nostalgia for me. On lighting, an aggressively sooty flame leaps to cover the first centimeter or so of the stick; oil appears to emerge from the stick directly beneath the flame. The fragrance upon extinguishing the flame is shocking. It's *foul*: vaporized wax, burning plastic, and some odd fishy note with a hint of artificial coconut. It's the kind of smell that makes you feel that your lifespan is being reduced. I put the stick out in short order. diff --git a/content/blog/incense-review-wild-berry-fizzy-pop-incense-powder.md b/content/blog/incense-review-wild-berry-fizzy-pop-incense-powder.md new file mode 100644 index 0000000..20a0c44 --- /dev/null +++ b/content/blog/incense-review-wild-berry-fizzy-pop-incense-powder.md @@ -0,0 +1,39 @@ +--- +title: "One Last Chance for Wild Berry: Reviewing Fizzy Pop Incense Powder" +description: "If this isn't any good, I'm giving up on Wild Berry once and for all." +date: 2026-05-28 +tags: + - Incense + - Incense Review +synopsis: "If this isn't any good, I'm giving up on Wild Berry once and for all." +imageURL: /img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-5.webp +imageAlt: "A plasma lighter hovers ominously over the tail of a trail of blue incense powder in the shape of an auspicious cloud, atop a flat layer of ash in a brass censer." +mastodon_id: "116653399110363374" +--- +Some time ago, I [reviewed a variety](/blog/an-evening-with-americas-best-incense-wild-berry/) of Wild Berry incense sticks and cones. If you don't know how that went, here's an idea: + +> It’s the kind of smell that makes you feel that your lifespan is being reduced… off-notes are tremendous… beginning to feel as though I’ve french-inhaled my way through a pack of menthol Newports. + +I didn't think I'd wind up returning to the brand, but I figured I'd give them one last chance before I completely wrote it off. If you haunt [/r/incense](https://www.reddit.com/r/Incense/) as much I do, you'll know that *Fizzy Pop* is rated highly by Wild Berry fans. Since my last experience with Wild Berry's incense, I've felt that it may have been a bit of an oversight not to try *Fizzy Pop*. I was also curious about the company's incense powder offering. Not only is it unusual for a western incense brand to offer powder, but in my experience powders don't tend to contain all of the off-notes you might imagine to be supplied by bamboo sticks and binders. It's much easier to make a powder that doesn't stink to the heavens than it is a stick. With that thought, my mind was made up. I simply hadn't been fair to Wild Berry until I'd tried the powder variant of their fan favorite. + +Ten Trumpland fun-bucks, plus shipping, will net you a jar containing 38 grams of shockingly blue incense powder—approximately twelve hours of burn time according to the side of the jar. I sure hope I like this stuff. The fragrance upon opening the jar is a lot of fun. It's strong, smelling distinctly like a concentrated lemon-lime soda syrup, or a fizzy lemon-lime candy. It's uncanny; a super bright, almost powdery, white-musk / laundry detergent note offers a real sensation of effervescence. There are going to be a lot of people who find the unburned fragrance of this stuff sickly, but I happen to love candy and don't mind smells in this category. I don't necessarily want my apartment fragranced of it, but it's fun to smell. + +[![A brass incense spoon scooping bright blue powder from the top of a jar.](/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-8.webp "Just look at the color of this stuff!")](/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-8.webp) + +I must admit that it felt *wrong* loading up a stencil with this lightning-blue powder in my Chinese censer. The test-blends I use this thing to burn might not always be great, but they are made of real aromatic woods, resins, and other botanicals. The powder texture was pretty perfect, however, and it was easy enough to make a neat incense seal. + +[![A plasma lighter hovers ominously over the tail of a trail of blue incense powder in the shape of an auspicious cloud, atop a flat layer of ash in a brass censer.](/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-5.webp "Lighting the inauspicious cloud.")](/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-5.webp) + +Upon lighting, a long, angry red ember took hold, quickly working its way down the electric blue trail and turning it into a spookily dark black ash. The fragrance that emerged immediately alerted me to the fact that this experiment was a grave mistake. While scrambling to get away without knocking over my camera, I scribbled onto an upside-down notepad: + +> fishy , burning laundry-detergent. metallic. ~~Like~~ smelled like ~~in~~ the ashes of incense. Diabolical. maybe the faintest hint of sprite. + +As I paced the living room, trying to come to terms with what I was experiencing, I realized that I was going to have to sit back down next to the burning incense to take more pictures. Behind the camera the fishy smoke followed me, flying straight at my face like I'd offended it. I covered my mouth with my shirt; it did little good. Even the ember looked like it had it in for me. + +[![A long, angry-looking ember travels down the trail of blue incense powder.](/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-6.webp "That mean glow frightens me. See more pictures in [the gallery](/gallery/wild-berry-fizzy-pop-powder/).")](/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-6.webp) + +In the aftermath of this ordeal, It occurred to me that I may not have managed to write in sufficient detail to constitute a review. I thought about burning another trail to analyze the incense more closely, but I just can't bring myself to do it. + +[![My scribbled note, with the underlined word "diabolical" highlighted. The notepad sits on top of a black fabric patch for a Black Metal act. An air-conditioner remote can be seen in the top right corner.](/img/wild-berry-fizzy-pop-powder/diabolical.webp "My \"notes.\"")](/img/wild-berry-fizzy-pop-powder/diabolical.webp) + +But, really, what more can I say? In my struggle to record the many emotions and sensations I was experiencing, I don't know that I could do much better than "Diabolical" at the time, and I don't know that I can do better now. Yes, I think I'm done with Wild Berry for good at this point. After two, frankly, *harrowing* experiences with the brand, I don't even know that I can muster the courage to try the "Mystic Meadow" sample sticks they've sent me. Not to put too fine a point on it, but how a company can develop, approve, and sell an incense powder that smells so strikingly, aggressively, offensively bad is truly beyond me. diff --git a/content/blog/index.njk b/content/blog/index.njk index 48a2a55..35f9bf3 100644 --- a/content/blog/index.njk +++ b/content/blog/index.njk @@ -1,6 +1,7 @@ --- eleventyExcludeFromCollections: true layout: layouts/base.njk +hideBlogTitleFromHeader: true title: "The Stochastic Bletherist | The Personal Blog of Nathan Upchurch" tags: - metadata @@ -19,31 +20,28 @@ paginationRootDir: blog

The Stochastic Bletherist

-The personal blog of Nathan Upchurch, where he writes about everything from personal stories to tech, food, and incense.
- - - - - - - +The Stochastic Bletherist is the personal blog of Nathan Upchurch, where he writes about whatever he fancies at the time. Subscribe if you’re interested in musings on life, music, and technology, weird and wonderful incense reviews, the occasional bit of spicy discourse, or learning how to make things like vegan ranch dressing or incense sticks. There’s something for everyone here. + + + + + + + + + + +

-

What’s New:

{% else %} -

The Stochastic Bletherist Blog

-

-Writing about everything from personal stories to tech, food, and incense.
+

The Stochastic Bletherist

- - - - - - +

+The Stochastic Bletherist is the personal blog of Nathan Upchurch, where he writes about whatever he fancies at the time. Subscribe if you’re interested in musings on life, music, and technology, weird and wonderful incense reviews, the occasional bit of spicy discourse, or learning how to make things like vegan ranch dressing or incense sticks. There’s something for everyone here.

-

More posts:

+

More posts:

{% endif %} diff --git a/content/blog/vegan-ranch-dressing.md b/content/blog/vegan-ranch-dressing.md new file mode 100644 index 0000000..6fadaf6 --- /dev/null +++ b/content/blog/vegan-ranch-dressing.md @@ -0,0 +1,45 @@ +--- +title: Making a Decent Vegan Ranch Dressing +description: Veganizing the corpulegenic condiment at the pinnacle of American sauces. +synopsis: Veganizing the corpulegenic condiment at the pinnacle of American sauces. +date: 2026-05-25 +tags: + - Vegan Cooking + - Food and Beverage +imageURL: /img/ranch/vegan-ranch-dressing.webp +imageAlt: My hand holding a bottle of vegan ranch dressing labeled with blue tape. +mastodon_id: "116638231076499180" +--- +If, like me, you have ever lived in the U.S.A., and if, like me, you are of a sufficiently distinguished BMI so as to rank highly the invention of comestibles, you will agree[^1] that Ranch (enPR: rāyŭnch) dressing is one of the great American inventions—right up there with the cotton gin, surgical anesthesia, and the modern assembly line. + +[![My hand holding a bottle of vegan ranch dressing labeled with blue tape.](/img/ranch/vegan-ranch-dressing.webp "This bottle is about half empty already.")](/img/ranch/vegan-ranch-dressing.webp) + +For those unfamiliar with the condiment, Ranch dressing is a tangy, herbaceous, and unsettlingly white sauce of moderate viscosity intended for use as a salad dressing. In practice, it is also used as a dip for everything from fresh vegetables to fried foods, and a general purpose condiment that you might find in or on anything from pizzas to sandwiches. These days, Ranch dressing is essentially a cool, green-flecked, less-sweet alternative to ketchup, only limited in its uses by your imagination. The flavor is peculiar. It's creamy, tangy, savory, and herbal all at once in a way that is all its own. Is it any good? Here's what Dan Howell of the internet's most famous gaslighting gay couple had to say about it: + +
They could hide their relationship for sixteen years, but nothing could obscure Dan’s love of Ranch dressing.
+ +I've been vegan for some twelve years now, and store-bought vegan ranch dressing is unfortunately expensive and rarely scratches the itch for me anyway. Dry Ranch seasoning mixes usually contain dairy, so they're out of the question. Surprisingly, even if this were an affordable avenue, not a single vegan restaurant in the city of Chicago seems to have a decent Ranch dressing either, so I set out to see whether the carnists might have a recipe that I could adapt. I landed on [a homemade Ranch seasoning mix recipe from The Pioneer Woman](https://www.thepioneerwoman.com/food-cooking/recipes/a91701/homemade-ranch-seasoning-mix/). The recipe helpfully includes instructions for making a dressing from the mix, which I also adapted. Making it is easy. Simply whisk together the following dry ingredients: + +|Qty|Unit|Ingredient| +|--|--|--| +|1|Tbsp|Dried Parsley| +|2|tsp|Dried Dill| +|1|tsp|Dried Chives| +|1|Tbsp|Garlic Powder| +|1/2|tsp|Ground Black Pepper| +|n/a|n/a|MSG to Taste| +|1|Tbsp|Onion Powder| +|n/a|n/a|Salt to Taste| + +then whisk the mixture with these wet ingredients until well combined: + +|Qty|Unit|Ingredient| +|--|--|--| +|1/4|cup|Lemon Juice| +|1|cup|Vegan Mayonnaise| +|2/3|cup|Vegan Sour Cream| +|3/4|cup|Water| + +Now store your homemade vegan Ranch dressing in the fridge, and use it within five days. I'm sure this won't present a challenge. + +[^1]: By continuing readers agree to indemnify, defend, and hold the author harmless from any and all claims arising from or related to neck sprains and other injuries sustained through vigorous nodding in agreement. diff --git a/content/blog/what-would-you-do-if-you-didnt-have-to-work.md b/content/blog/what-would-you-do-if-you-didnt-have-to-work.md new file mode 100644 index 0000000..9b44eda --- /dev/null +++ b/content/blog/what-would-you-do-if-you-didnt-have-to-work.md @@ -0,0 +1,70 @@ +--- +title: "Re: What Would You Do if You Didn't Have to Work?" +description: "Oh the lives we could lead without capitalism in the way." +date: 2026-05-18 +tags: + - Life + - Quick Thoughts +synopsis: "Oh the lives we could lead without capitalism in the way." +imageURL: /img/what-would-you-do-if-you-didnt-have-to-work/ducc.webp +imageAlt: "A close up shot of a well fed mallard with a shiny green head bobbing about in the Chicago River." +mastodon_id: "116596651947015321" +--- + +In response to [this recent post](https://gary.onl/what-would-you-do-if-you-didnt-have-to-work/) by [gary online](https://gary.onl/): I am *absolutely* not someone who derives their worth or identity by what they do +to earn a crust. If I didn't have to work, I'd lead a richness of life that +would put to shame both the wastrels[^1] of ~~inherited~~ *stolen* means who live by +the labor of others, and the wealthy denizens of the c-suite who earn their +exorbitant salaries by becoming professional whip-crackers for the former. Here +are a few things I'd like to do. + +[![A close up shot of a well fed mallard with a shiny green head bobbing about in the Chicago River.](/img/what-would-you-do-if-you-didnt-have-to-work/ducc.webp "This fellow would be well fed for a start.")](/img/what-would-you-do-if-you-didnt-have-to-work/ducc.webp) + +- Learn + [Launy Grøndahl's Trombone Concerto](https://www.youtube.com/watch?v=AY8VJ6n83Qs&list=RDAY8VJ6n83Qs&start_radio=1) + so well I could play it in the middle of a battlefield. +- Finally get around to learning tenor clef in order to be able to do so. +- Cook for people: great big trays of vegan mac and cheese, spaghetti squash + with all sorts of sauces, coconut curries, baked beans, cornbread, teriyaki, + pizzas, burgers in homemade pretzel rolls, foccacia with olive oil and + balsamic vinegar for dipping, crunchy palmiers, millionaire's shortbread, tablet, + dosa, sambar, kale salads with pickled vegetables and crispy tofu, orange + faux chicken, seitan deli meats and country-fried steaks, biscuits and + "sausage" gravy, and more. +- Learn to make stovies, vegan haggis, peshwari naan, and sourdough bread, and + other delicious things. +- Get really good at programming. +- Learn C++ so that I can contribute code to open source projects like + [Scribus](https://www.scribus.net/), [Inkscape](https://inkscape.org/), and + [KDE](https://kde.org/). +- Focus on my health and fitness. +- Go to college and/or university, something I never had the chance to do, and + learn about psychology, computer science, music, mathematics, statistics, + design, and electrical engineering. +- Take courses for the fun of learning something new. +- Write more. +- Spend more time with my partner. +- Spend more time socializing. +- Go on more walks. +- Feed peas to the ducks on the river more days than not. +- Make more incense. +- Get really good at making incense. +- Try my hand at enfleurage +- Learn perfumery. +- Take a first-aid course. +- Design signage and informational material for public benefit. +- Get back into welding. +- Attempt to make soap. +- Lay in the grass on sunny days drinking shandy and eating vegan cheese and + crackers. +- Get my Spanish into shape. +- Learn German. +- Learn more Scots. Maybe write something in it. +- Write music. +- Wile away afternoons in cafés drinking tea. +- Search for resins and local aromatics. +- Take the bus to different towns just to walk around. +- Read more books. +- Not worry about what time it is. + +[^1]: You ever meet one of those modern Bertie Wooster types? It's all bottle service, trips to Dubai, and overpriced yet under-seasoned lunches. Wealth truly is wasted on the wealthy. diff --git a/content/changelog/index.md b/content/changelog/index.md index eec3827..cca76eb 100644 --- a/content/changelog/index.md +++ b/content/changelog/index.md @@ -7,6 +7,11 @@ includeTOC: true --- ## 2026 ### May +* 2026-05-26 + * Updated [blogroll](/blogroll). + * Updated [/links](/links). +* 2026-05-15 + * Updated [/links](/links). * 2026-05-12 * Implement pet bird in settings. * Refactor settings implementation. As a result: diff --git a/content/galleries/gallery-image-page-generator.njk b/content/galleries/gallery-image-page-generator.njk index d1e3c2b..83bef2e 100644 --- a/content/galleries/gallery-image-page-generator.njk +++ b/content/galleries/gallery-image-page-generator.njk @@ -18,15 +18,15 @@ eleventyComputed:
{% if picture.previousImage %} - + {% endif %} - + {% if picture.nextImage %} - + {% endif %}
diff --git a/content/index.njk b/content/index.njk index 12a3f77..8376170 100644 --- a/content/index.njk +++ b/content/index.njk @@ -1,7 +1,4 @@ --- layout: layouts/home.njk -eleventyNavigation: - key: Home - order: 1 --- {% include "navigator.njk" %} diff --git a/content/links/index.md b/content/links/index.md index 50b6267..05e5ebf 100644 --- a/content/links/index.md +++ b/content/links/index.md @@ -6,12 +6,17 @@ h1: Links includeTOC: true --- Here are some links to pages and resources that I believe are worth sharing. -## Design tools and resources -### Education +## Creative resources +### General +* [Creazilla](https://creazilla.com/)—A huge collection of media files under a Public Domain license including photos, illustrations, scanned art images, vectors, videos, and audio files. +* [Pixabay](https://pixabay.com/)—Free stock photos, illustrations, vector graphics, videos, music and sounds effects. + +### Graphic Design +#### Education * [Butterick’s Practical Typography](https://practicaltypography.com/) -### Reference +#### Reference * [Design Systems Gallery](https://designsystemsrepo.com/design-systems-recent/) -### Software +#### Software * [Converseen](https://converseen.fasterland.net/)—A Batch Image Converter and Resizer Tool for Windows, Linux and macOS * [darktable](https://www.darktable.org/)—An open source photography workflow application and raw developer * [digiKam](https://www.digikam.org/)—Open-source digital asset manager and image editor @@ -22,16 +27,18 @@ Here are some links to pages and resources that I believe are worth sharing. * [Krita](https://krita.org/en/)—A professional FLOSS painting and raster editing tool * [RawTherapee](https://www.rawtherapee.com/)—A free, cross-platform raw image processing program * [Scribus](https://www.scribus.net/)—The Go-To Libre Desktop Publishing Application -### Stock graphics +#### Stock graphics * [Artvee](https://artvee.com/)—Browse and download high-resolution, public domain paintings, posters and illustrations * [CocoMaterial](https://cocomaterial.com/)—The Open Source hand-drawn illustration library with 3,293 images * [Free and open source icons](https://www.toools.design/free-open-source-icon-libraries) -* [Getty Search Gateway](https://search.getty.edu/gateway/search?q=&cat=type&r=%22Paintings%22&types=%22Paintings$Paintings%22&highlights=%22Open%20Content%20Images$Recent%20Acquisitions%22&rows=10&srt=a&dir=s&dsp=0&img=0&pg=1) +* [Getty Museum Collection](https://www.getty.edu/art/collection/search?open_content=true) +* [Getty Research Collections](https://www.getty.edu/research/collections/search?is_open_content=true) * [Museo](https://museo.app/)—A visual search engine that connects you with the Art Institute of Chicago, the Rijksmuseum, the Harvard Art Museums, the Minneapolis Institute of Art, the The Cleveland Museum of Art, and the New York Public Library Digital Collection +* [National Gallery of Art](https://www.nga.gov/artwork-search?download=1)—Search and download from a collection of tens of thousands of artworks. * [Pexels](https://www.pexels.com/)—The best free stock photos, royalty free images & videos shared by creators -* [Pixabay](https://pixabay.com/)—Stunning royalty-free images & royalty-free stock +* [Public Domain Image Archive](https://pdimagearchive.org/galleries/all/random/desc)—The Public Domain Image Archive is a curated collection of more than 10,000 out-of-copyright historical images, free for all to explore and reuse. * [Smithsonian Open Access](https://www.si.edu/openaccess)—Download, share, and reuse millions of the Smithsonian’s images -### Typefaces +#### Typefaces * [Badass Libre Fonts By Womxn](https://www.design-research.be/by-womxn/) * [Collletttivo](https://www.collletttivo.it/)—An Open-Source type foundry and a network of people promoting the practice of type design through mutual exchange and collaboration * [coolLabs Fonts](https://fonts.coollabs.io/)—A privacy-friendly drop-in replacement for Google Fonts @@ -140,6 +147,10 @@ Unlimited creativity, zero ads. * [TypeLit.io](https://www.typelit.io/)—Test your typing online by practicing on your favorite literature * [Wee Windaes—A continuum o the Scots Leid](https://wee-windaes.nls.uk/) +## Music +* [Free Music Archive](https://freemusicarchive.org/home)—Free Music Archive (FMA) offers free access to open licensed, original music by independent artists around the world. +* [Musopen](https://musopen.org/)—Musopen is a 501(c) 3 non-profit working to increase access to music education by providing free music recordings, sheet music, apps, and educational materials. + ## Privacy-respecting tools and services * [Autistici](https://www.autistici.org/)—A collective offering free digital services, including: * Anonymity services @@ -263,5 +274,4 @@ Unlimited creativity, zero ads. ## Sounds & Samples * [FreeSound](https://freesound.org/) * [LooperMan](https://www.looperman.com/) -* [Pixabay](https://pixabay.com/sound-effects/) * [SampleSwap](https://sampleswap.org/index.php) diff --git a/content/not-amazon/index.md b/content/not-amazon/index.md index 04b33e0..4f25c7b 100644 --- a/content/not-amazon/index.md +++ b/content/not-amazon/index.md @@ -65,6 +65,7 @@ Mostly for my own use, this is a list of U.S.-based online shops that are not Am * [All Vegetarian Inc.](https://veganforall.com/)—Vegan substitutes for bacon, shrimp, eggs, and more. * [Fake Meats](https://www.fakemeats.com/default.asp)—Vegetarian and vegan meat substitutes, snacks, seasonings, sauces, jerky, and more. Seems like this store isn't totally vegan: check ingredients before buying. * [vegefood.com](https://vegefood.com/)—All sorts of weird and wonderful vegan and vegetarian meat alternatives. Not totally vegan: check ingredients before buying. +* [WebstaurantStore](https://www.webstaurantstore.com/search/vegan.html)—If you're willing to buy by the case, you can get all sorts of vegan alternatives here on the cheap. * [Yang Kee Trading](https://yangkeetrading.com/)—Large dried TVP chunks, slices, and strips, vegan pork floss, teas, and more. ## General @@ -74,6 +75,9 @@ Mostly for my own use, this is a list of U.S.-based online shops that are not Am * [Ten Thousand Villages](https://www.tenthousandvillages.com/)—Fair trade kitchen items, soaps, handwoven baskets, games and puzzles, jewelry, and more from artisans across the world. ## Home +### Art +* [Prints: The Public Domain Review](https://publicdomainreview.org/shop/fine-art-prints/)—The Public Domain Review prints shop offers custom-made Giclée prints from a selection of more than 900 public domain images. All proceeds from sales go back into The Public Domain Review (a not-for-profit project). + ### Cleaning Supplies * [Friendswood Brooms](https://friendswoodbrooms.com/)—Handmade corn brooms. * [Meckley Brooms](https://www.meckleybrooms.com/)—Handmade corn brooms. diff --git a/content/now-burning/Now Burning_2026-05-18_12:40.md b/content/now-burning/Now Burning_2026-05-18_12:40.md new file mode 100644 index 0000000..9b04078 --- /dev/null +++ b/content/now-burning/Now Burning_2026-05-18_12:40.md @@ -0,0 +1,7 @@ +--- +title: Hippie Hug +manufacturer: The World Makes Scents +date: 2026-05-18 12:40:00 +time: 12:40 PM +--- + diff --git a/content/now-burning/Now Burning_2026-05-21_11:48.md b/content/now-burning/Now Burning_2026-05-21_11:48.md new file mode 100644 index 0000000..0b88687 --- /dev/null +++ b/content/now-burning/Now Burning_2026-05-21_11:48.md @@ -0,0 +1,7 @@ +--- +title: Morning Star Lavender +manufacturer: Nippon Kodo +date: 2026-05-21 11:47:47 +time: 11:47 AM +--- +Meh. diff --git a/content/now-burning/Now Burning_2026-05-23_15:02.md b/content/now-burning/Now Burning_2026-05-23_15:02.md new file mode 100644 index 0000000..f6acc3e --- /dev/null +++ b/content/now-burning/Now Burning_2026-05-23_15:02.md @@ -0,0 +1,7 @@ +--- +title: Suifu +manufacturer: Yamadamatsu +date: 2026-05-23 15:02:33 +time: 3:02 PM +--- + diff --git a/content/now-burning/index.njk b/content/now-burning/index.njk index 5e607f8..9fccd57 100644 --- a/content/now-burning/index.njk +++ b/content/now-burning/index.njk @@ -10,9 +10,9 @@ postlistHeaderText: "What I've been burning:"

Now Burning:

- +
-

{{ burning.data.title }}{% if burning.data.manufacturer %}, {{ burning.data.manufacturer }}{% endif %}, {{ burning.date | niceDate }}, {{ burning.data.time }}

+

{{ burning.data.title }}{% if burning.data.manufacturer %}, {{ burning.data.manufacturer }}{% endif %},
{{ burning.date | niceDate }}, {{ burning.data.time }}

{% if burning.content %}
{{ burning.content | safe }} @@ -21,5 +21,5 @@ postlistHeaderText: "What I've been burning:"
- + diff --git a/content/now/index.njk b/content/now/index.njk index 2db01cb..f304db5 100644 --- a/content/now/index.njk +++ b/content/now/index.njk @@ -18,7 +18,13 @@ tags:
@@ -31,7 +37,7 @@ tags:
{% set postsCount = collections.now | removeMostRecent | length %} {% if postsCount > 1 %} -

Previous Entries:

+

Previous Entries:

{% set postslist = collections.now | removeMostRecent %} {% set showPostListHeader = false %} {% include "postslist.njk" %} diff --git a/content/once-burned/index.njk b/content/once-burned/index.njk index bc5ea87..be9fb52 100644 --- a/content/once-burned/index.njk +++ b/content/once-burned/index.njk @@ -25,11 +25,12 @@ paginationRootDir: once-burned {% else %}

Nothing’s here yet!

{% endif %} + + {% include "permalinkButtons.njk" %} -{% include "permalinkButtons.njk" %} - - - - + + + +
diff --git a/content/prior-thoughts/index.njk b/content/prior-thoughts/index.njk index dfa0fcf..0701004 100644 --- a/content/prior-thoughts/index.njk +++ b/content/prior-thoughts/index.njk @@ -27,7 +27,7 @@ paginationRootDir: prior-thoughts {% include "permalinkButtons.njk" %} - + diff --git a/content/quizzes/index.njk b/content/quizzes/index.njk index bf1e8e7..7233cb9 100644 --- a/content/quizzes/index.njk +++ b/content/quizzes/index.njk @@ -13,7 +13,7 @@ description: "Bored? Take a fun quiz to while away the time!"

Test your knowledge, learn about yourself, and waste your precious time, right here, right now, with a quiz!

{% set postsCount = collections.quiz | length %} -

Available quizzes:

+

Available quizzes:

{% set postslist = collections.quiz | reverse %} {% set showPostListHeader = false %} {% include "postslist.njk" %} diff --git a/content/status/Status_2026-05-18_10:07.md b/content/status/Status_2026-05-18_10:07.md new file mode 100644 index 0000000..6e651de --- /dev/null +++ b/content/status/Status_2026-05-18_10:07.md @@ -0,0 +1,5 @@ +--- +date: 2026-05-18 10:06:00 +emoji: 👻 +comment: "[Spooky stuff](https://sinceyouarrived.world/taken)." +--- diff --git a/content/status/index.njk b/content/status/index.njk index fc89a7f..81df99a 100644 --- a/content/status/index.njk +++ b/content/status/index.njk @@ -7,7 +7,7 @@ permalink: "/status/index.html" --- {% set status = collections.status | last %} -

Nathan’s status:

+

Current status:

{{ status.data.emoji }} @@ -24,20 +24,17 @@ permalink: "/status/index.html" {% endif %} {% if metadata.author.url %} -
+ {% endif %} + • {{ status.date | niceDate }}
{% if status.data.comment %} {{ status.data.comment | markdownify | safe }}
{% endif %} - - - {{ status.date | niceDate }} -

- + diff --git a/content/tags/tag-page-generator.njk b/content/tags/tag-page-generator.njk index e50d9a6..64e19e1 100644 --- a/content/tags/tag-page-generator.njk +++ b/content/tags/tag-page-generator.njk @@ -41,17 +41,25 @@ eleventyComputed:

Here’s everything I’ve posted tagged “{{ tag }}.” Want to be notified when I post on this topic? Subscribe to “{{ tag }}” using the button below.
- - - - - - + + + + + + + +

{% set postslist = collections[ tag ] | reverse %} diff --git a/public/css/comments.css b/public/css/comments.css index 44dada7..0504845 100644 --- a/public/css/comments.css +++ b/public/css/comments.css @@ -1,21 +1,124 @@ -.isso-comment-header { - height: var(--space-2xl) !important; +.isso-auth-section { + display: flex !important; + flex-flow: row wrap; + gap: var(--space-3xs); + & .isso-input-wrapper { + flex-basis: 30%; + flex-grow: 1; + } +} +@container (width < 460px) { + .isso-auth-section { + flex-flow: column; + } } -h4.isso-thread-heading { - color: var(--text-color) !important; - font-size: var(--step-2) !important; - font-variation-settings: - "opsz" 50, - "wght" 350, - "SOFT" 20, - "WONK" 1 !important; - line-height: calc(var(--step-2) * 0.25 + var(--step-2)) !important; - margin-bottom: var(--space-m) !important; - margin-top: var(--space-m) !important; - padding-bottom: 0 !important; - padding-top: 0 !important; - text-wrap: pretty !important; +.isso-comment { + & > .isso-avatar { + margin-left: var(--space-l); + margin-top: var(--space-l); + & img { + border-radius: var(--large-rounded-radius); + border-top-left-radius: 0; + } + } + & .isso-comment-footer { + display: flex; + flex-flow: row nowrap; + align-items: center; + & a { + position: inherit; + } + & .isso-reply { + color: var(--contrast-color); + font-family: var(--font-family-ui); + font-size: var(--step--2); + font-variation-settings: "wght" 700; + letter-spacing: var(--wide-letter-spacing); + text-align: end; + text-transform: uppercase; + } + & .isso-spacer { + display: none; + } + & .isso-votes { + color: var(--contrast-color); + font-family: var(--font-family-ui); + font-size: var(--step--1); + font-variation-settings: "wght" 700; + letter-spacing: var(--wide-letter-spacing); + text-transform: uppercase; + } + & svg { + fill: var(--contrast-color) !important; + } + } + & .isso-comment-header { + color: var(--contrast-color) !important; + margin-bottom: var(--space-s); + & a[href].isso-author, a[href].isso-author:visited, a[href].isso-author:hover { + color: var(--contrast-color) !important; + } + & .isso-author { + color: var(--contrast-color); + font-family: var(--font-family-ui); + font-size: var(--step--1); + font-variation-settings: "wght" 600; + &::after { + content: "\A"; + white-space: pre; + } + } + & .isso-permalink { + color: var(--contrast-color); + font-family: var(--font-family-ui); + font-size: var(--step--2); + font-variation-settings: "wght" 500; + + } + & .isso-spacer { + display: none; + } + } + & > .isso-follow-up { + border-top-right-radius: 0; + margin-top: var(--space-xs); + margin-bottom: var(--space-l); + + & .isso-text-wrapper { + border-top-left-radius: var(--large-rounded-radius); + border-top-right-radius: 0; + } + } + & > .isso-text-wrapper { + background-color: var(--contrast-color-tint); + border-radius: var(--large-rounded-radius); + border-top-left-radius: 0; + padding: var(--space-l); + & .isso-text p { + font-style: italic; + margin-block: 0 1lh !important; + } + } + &:not(:first-of-type), .isso-follow-up .isso-comment { + border-top: none !important; + } +} +section#isso-thread { + & h4.isso-thread-heading { + color: var(--contrast-color); + font-family: var(--font-family-ui); + font-size: var(--step-0); + font-variation-settings: "wght" 450; + letter-spacing: var(--wide-letter-spacing); + line-height: calc(var(--step-0) * 0.25 + var(--step-0)); + margin-block: 0 1lh; + margin-top: var(--space-m); + padding-bottom: 0; + padding-top: 0; + text-transform: uppercase; + text-wrap: pretty; + } } .isso-text > h1, @@ -24,15 +127,15 @@ h4.isso-thread-heading { } .isso-form-wrapper > .isso-auth-section > .isso-post-action > input { - background-color: var(--contrast-color) !important; + background-color: var(--contrast-color-tint) !important; border: none !important; border-radius: var(--border-radius) !important; - color: var(--background-color) !important; + color: var(--contrast-color) !important; font-family: var(--font-family-ui) !important; font-size: var(--step--2) !important; font-variation-settings: var(--font-variation-ui) !important; height: var(--space-m-l) !important; - letter-spacing: var(--ui-letter-spacing) !important; + letter-spacing: var(--wide-letter-spacing) !important; margin: var(--space-s) 0 0 0 !important; padding: 0 var(--space-xs) !important; text-transform: uppercase !important; @@ -44,8 +147,7 @@ p.isso-input-wrapper { display: block !important; margin: 0 !important; max-width: 100% !important; - & > label, - & > input { + & > label { font-family: var(--font-family-ui) !important; font-size: var(--step--2) !important; font-variation-settings: var(--font-variation-ui) !important; @@ -55,15 +157,56 @@ p.isso-input-wrapper { margin-block: inherit !important; } } - +@container (width < 460px) { + p.isso-input-wrapper > label { + margin-top: 0 !important; + } +} +.isso-postbox { + background-color: var(--contrast-color); + border-radius: var(--large-rounded-radius); + border-top-left-radius: 0; + color: var(--background-color); + padding: var(--space-l) calc((100cqw - (var(--grid-gutter) * 11)) / 12) var(--space-2xs) calc((100cqw - (var(--grid-gutter) * 11)) / 12); + margin-left: calc(((100cqw - (var(--grid-gutter) * 11)) / 12) * -1) !important; + margin-block: 1lh 1lh; + width: calc(((100cqw) / 12) * 14); +} +@container (width < 460px) { + .isso-postbox { + padding: var(--space-l) var(--space-m) var(--space-s) var(--space-m); + } +} .isso-post-action { display: inline-block !important; float: inherit !important; - margin: 0 var(--space-2xs) 0 0 !important; + margin-left: 0 !important; &::after { content: "" !important; } } +@container (width < 460px) { + .isso-post-action { + margin-bottom: 0 !important; + } +} +.isso-text { + color: var(--text-color); + & > blockquote { + margin: 0; + padding: var(--space-3xs) var(--space-s); + &::before { + font-size: var(--step-5); + margin-top: -4.5px; + } + & p { + padding: 0 0 0 var(--space-s); + } + } + & p { + margin-bottom: 0 !important; + } +} textarea.isso-textarea { background-color: var(--background-color) !important; @@ -76,7 +219,13 @@ textarea.isso-textarea { font-variation-settings: var(--font-variation-default) !important; margin-bottom: 0 !important; min-height: var(--space-l) !important; - padding: 0 var(--space-3xs) !important; resize: vertical !important; width: 100%; } + +@media (max-width: 900px) { + .isso-postbox { + margin-left: auto !important; + width: 100%; + } +} \ No newline at end of file diff --git a/public/css/continue-discussion-on-mastodon.css b/public/css/continue-discussion-on-mastodon.css index 2e9eb75..be283b6 100644 --- a/public/css/continue-discussion-on-mastodon.css +++ b/public/css/continue-discussion-on-mastodon.css @@ -2,6 +2,12 @@ grid-column: var(--span-grid); } .continue-discussion button { - margin-top: calc(var(--space-s) * -1); margin-bottom: var(--space-m); + & > svg { + aspect-ratio: 1 / 1; + fill: var(--background-color); + height: var(--space-xs); + margin-right: var(--space-2xs); + width: var(--space-xs); + } } diff --git a/public/css/dropcap.css b/public/css/dropcap.css index 88e5239..7fd4bc4 100644 --- a/public/css/dropcap.css +++ b/public/css/dropcap.css @@ -1,16 +1,13 @@ main > section > article.post > p:not(.nodropcap):first-of-type:first-letter { float: left; - font-size: var(--step-5); - padding: var(--space-2xs); + font-size: var(--step-4); + padding-top: var(--space-3xs); color: var(--contrast-color); - border: solid 2px var(--contrast-color); font-family: var(--font-family-headline); font-variation-settings: "opsz" 144, - "wght" 500, + "wght" 600, "SOFT" 10, "WONK" 0; margin: 0.5rem 0.7rem 0 0; - border-radius: 0.2em; - border-top-left-radius: 0; } diff --git a/public/css/gallery-images.css b/public/css/gallery-images.css index 9ad7566..aa187d3 100644 --- a/public/css/gallery-images.css +++ b/public/css/gallery-images.css @@ -7,7 +7,8 @@ width: var(--space-7xl-8xl); height: var(--space-7xl-8xl); .gallery-image { - border-radius: var(--border-radius); + border-radius: 1em; + border-top-left-radius: 0; width: var(--space-7xl-8xl); height: var(--space-7xl-8xl); object-fit: cover; diff --git a/public/css/guestbook.css b/public/css/guestbook.css index 331f7e6..91c51cf 100644 --- a/public/css/guestbook.css +++ b/public/css/guestbook.css @@ -1,31 +1,48 @@ .guestbook-message blockquote { margin-bottom: var(--space-m); margin-top: var(--space-3xs); + padding: var(--space-m) var(--space-2xl); + &:before { + color: var(--contrast-color); + content: "“"; + font-size: 10rem; + font-variation-settings: + "opsz" 72, + "wght" 360, + "SOFT" 0, + "WONK" 0; + margin-left: calc((var(--space-xl) * 1.25) * -1); + margin-top: calc((var(--space-s) * 1.3) * -1); + position: absolute; +} } .guestbook-message p { margin-block: 0 0; position: relative; - z-index: 1; } .guestbook-message p b, .guestbook-message p small { - font-family: var(--meta-font-family); - font-size: var(--meta-font-size); - font-variation-settings: var(--meta-font-variation-settings); + color: var(--color-metadata); + font-family: var(--font-family-metadata); + font-size: var(--font-size-metadata); + font-variation-settings: var(--font-variation-settings-metadata); + text-transform: var(--text-transform-metadata); + letter-spacing: var(--letter-spacing-metadata); + & a[href] { + color: var(--color-metadata); + } } #guestbooks___challenge-answer-container br, .guestbooks___input-container br { display: none; } .guestbook-message-reply { - border-left: var(--border-details); margin-left: var(--space-l); margin-top: calc(var(--space-s) * -1); - opacity: 0.9; padding-left: var(--space-s); font-style: italic; & blockquote { - margin-left: 0; + padding-left: var(--space-s); } & blockquote::before { content: ""; diff --git a/public/css/index.css b/public/css/index.css index f6e5119..207246a 100644 --- a/public/css/index.css +++ b/public/css/index.css @@ -5,15 +5,15 @@ --font-family-ui: "Manrope", sans-serif; --font-variation-default: "opsz" 18, "wght" 310, "SOFT" 40, "WONK" 0; --font-variation-ui: "wght" 500; - --font-family-monospace: Consolas, Menlo, Monaco, Andale Mono WT, Andale Mono, - Lucida Console, Lucida Sans Typewriter, DejaVu Sans Mono, - Bitstream Vera Sans Mono, Liberation Mono, Nimbus Mono L, Courier New, - Courier, monospace; + --font-family-monospace: + Consolas, Menlo, Monaco, Andale Mono WT, Andale Mono, Lucida Console, + Lucida Sans Typewriter, DejaVu Sans Mono, Bitstream Vera Sans Mono, + Liberation Mono, Nimbus Mono L, Courier New, Courier, monospace; --meta-font-family: "Manrope", sans-serif; - --meta-font-size: var(--step--2); + --meta-font-size: var(--step--1); --meta-font-style: normal; - --meta-font-variation-settings: "wght" 500; - --ui-letter-spacing: calc(var(--space-3xs) * 0.5); + --meta-font-variation-settings: "wght" 350; + --wide-letter-spacing: 15%; } /* Design Tokens */ @@ -24,9 +24,11 @@ --card-color: rgba(250, 250, 250, 1); --contrast-color: rgb(2, 120, 96); - --contrast-color-translucent: rgba(2, 120, 96, 0.5); - --background-color: #faf5f5; + --contrast-color-translucent: rgba(2, 94, 74, 0.5); + --background-color: rgb(235, 245, 240); --rss-orange: rgb(255, 152, 0); + --contrast-color-tint: rgb(225, 240, 236); + --nav-footer-color: white; --text-color: var(--color-gray-90); --text-color-link: var(--text-color); --text-color-tag: var(--contrast-color); @@ -87,29 +89,33 @@ --grid-gutter: var(--space-s-s, clamp(1.25rem, 1.1092rem + 0.7042vw, 1.5rem)); --grid-columns: 12; - /* Span grid utility */ + /* Utilities */ --span-grid: 1 / span 12; - - /* Change SVG color with filter */ - --logo-filter: brightness(0) saturate(100%) invert(16%) sepia(0%) - saturate(1024%) hue-rotate(177deg) brightness(99%) contrast(88%); - --icon-filter: none; + --color-metadata: var(--contrast-color); + --font-family-metadata: var(--font-family-ui); + --line-height-metadata: calc(var(--step--2) * 0.25 + var(--step--2)); + --font-size-metadata: var(--step--2); + --letter-spacing-metadata: var(--wide-letter-spacing); + --text-transform-metadata: uppercase; + --font-variation-settings-metadata: "wght" 500; /* Corners */ --border-radius: 0.3rem; + --large-rounded-radius: 1rem; /* Transitions */ --transition-normal: all 0.3s allow-discrete; /* Links */ - --link-decoration-thickness: 0.06rem; + --link-decoration-thickness: 0.15rem; /* Borders */ --border-details: 1px solid var(--color-gray-20); + --border-header-footer: 1px solid var(--contrast-color); --border-hr: 0.5px solid var(--color-gray-20); - --border-nav: 1px solid var(--text-color); - --border-nav-currentpage: var(--space-xs-s) solid var(--contrast-color); - --border-nav-hover: var(--space-xs-s) solid var(--text-color); + --border-nav: 1px solid var(--background-color); + --border-nav-currentpage: var(--space-xs-s) solid var(--background-color); + --border-nav-hover: var(--space-xs-s) solid var(--background-color); /* Shadow */ --box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2); @@ -119,17 +125,14 @@ :root { --color-gray-20: #253848; --color-gray-90: #dad8d8; - --card-color: #333333; + --card-color: rgb(0,50,40); --contrast-color: rgb(4, 196, 158); + --contrast-color-tint: rgb(21, 58, 56); --contrast-color-translucent: rgba(4, 196, 158, 0.5); - + --nav-footer-color: rgb(0,50,40); /* --text-color is assigned to --color-gray-_ above */ --text-color-link: var(--text-color); - - --background-color: #15202b; - --logo-filter: none; - --icon-filter: brightness(0) saturate(100%) invert(9%) sepia(76%) - saturate(340%) hue-rotate(168deg) brightness(95%) contrast(94%); + --background-color: rgb(24, 27, 32); } .socialLinks a li img { filter: auto; @@ -148,12 +151,22 @@ body { font-family: var(--font-family); font-variation-settings: var(--font-variation-default); font-variant-ligatures: normal; - margin: 0 auto; + margin: 0; padding: 0; } html { font-size: 13px; - overflow-y: scroll; + height: 100%; +} +abbr { + cursor: help; + text-decoration-thickness: var(--link-decoration-thickness); + text-decoration-color: var(--contrast-color); +} +article.post { + & > p:first-of-type { + margin-top: var(--space-xl); + } } input:not(.answer, .siteSettingsToggle input), textarea { @@ -167,50 +180,74 @@ textarea { font-variation-settings: var(--font-variation-default); margin-block: 0 1lh; min-height: var(--space-l); - padding: 0 var(--space-3xs); width: 100%; &:focus { box-shadow: 0 0 0 2px var(--contrast-color); outline: none; } + &::placeholder { + font-style: italic; + } } label { display: block; margin-bottom: var(--space-3xs); } -article:not(.postlist-item) { - & h2 { - padding-top: var(--space-m); +blockquote { + background-color: var(--contrast-color-tint); + border-radius: var(--large-rounded-radius); + border-top-left-radius: 0; + color: var(--contrast-color); + font-style: italic; + font-variation-settings: + "opsz" 18, + "wght" 360, + "SOFT" 40, + "WONK" 0; + margin-left: 0; + margin-right: 0; + padding: var(--space-m) var(--space-l) var(--space-3xs) var(--space-l); + position: relative; + z-index: -1; + & p { + padding-left: var(--space-xl); } } -blockquote p { - font-style: italic; -} + blockquote:before { color: var(--contrast-color); content: "“"; font-size: 10rem; - margin-left: -4rem; - margin-top: -2rem; + font-variation-settings: + "opsz" 72, + "wght" 360, + "SOFT" 0, + "WONK" 0; + margin-left: calc(var(--space-s) * -1); + margin-top: calc(var(--space-s) * -1); position: absolute; - filter: opacity(0.15); - z-index: 0; } + .blogroll { h2:first-of-type { padding-top: 0; } } body { + container-type: inline-size; + display: flex; + flex-direction: column; font-size: var(--step-0); - margin-inline: auto; - max-width: var(--grid-max-width); + height: 100cqh; padding-inline: var(--grid-gutter); - padding-top: var(--space-m); - padding-bottom: var(--space-m); + /*! width: 100vw; */ } button { + align-items: center; + display: flex; + flex-flow: row nowrap; height: var(--space-m-l); + width: fit-content; } .buttonContainer { display: flex; @@ -219,31 +256,28 @@ button { margin-bottom: var(--space-m); button { margin-top: var(--space-s); + & svg { + fill: var(--background-color); + height: var(--space-2xs); + margin-right: var(--space-2xs); + width: var(--space-2xs); + } } &.galleryButtons { margin-top: calc(var(--space-l) * -1); + width: 100%; } } button, .nav-item { font-family: var(--font-family-ui); } -header, -footer, -main { - display: grid; - gap: var(--grid-gutter); - grid-template-columns: repeat(var(--grid-columns), 1fr); -} .indexFeature:not(:last-child) { padding-bottom: var(--space-l); } mark { background-color: var(--contrast-color); } -nav { - grid-column: 2 / span 12; -} .now { display: grid; grid-column: var(--span-grid); @@ -252,10 +286,8 @@ ol { padding-left: 0; } section { + container-type: inline-size; grid-column: var(--span-grid); - p { - grid-column: var(--span-grid); - } } ::selection { background: var(--contrast-color); @@ -265,10 +297,6 @@ section { grid-column: var(--span-grid); margin: 0; } -ul { - margin: 0; - grid-column: var(--span-grid); -} a { text-decoration-color: var(--contrast-color); @@ -286,15 +314,54 @@ a { width: 1px; } footer { - padding: var(--space-xl) 0 var(--space-m) 0; + border-top: var(--border-header-footer); + background-color: var(--nav-footer-color); + color: var(--contrast-color); + font-family: var(--font-family-ui); + font-size: var(--step--1); + font-variation-settings: "wght" 500; + margin-left: calc(var(--grid-gutter) * -1); + margin-right: calc(var(--grid-gutter) * -1); + min-height: calc(var(--space-3xl) * 3); + padding: var(--space-xl) var(--grid-gutter) 0 var(--grid-gutter); + width: calc(100% + var(--grid-gutter) * 2); + & .footerContainer { + display: grid; + gap: var(--grid-gutter); + grid-template-columns: repeat(var(--grid-columns), 1fr); + margin: auto; + max-width: var(--grid-max-width); + & .webringsContainer { + display: flex; + flex-flow: row wrap; + gap: var(--space-2xs) var(--space-xs); + grid-column: 1 / 4; + } + & .linksContainer { + display: flex; + flex-flow: row wrap; + gap: var(--space-2xs) var(--space-xs); + grid-column: 4 / 12; + } + } + & a[href]:not(.icon-button) { + color: var(--contrast-color); + text-decoration: none; + &:visited { + color: var(--contrast-color); + } + &:hover { + color: var(--contrast-color); + } + } & p { - font-size: var(--step-0); + font-size: var(--step--1); grid-column: var(--span-grid); + line-height: calc(var(--step--1) * 0.25 + var(--step--1)); margin-bottom: 0; } & .webring { display: inline; - padding-right: var(--space-xs); } } @@ -302,48 +369,80 @@ h1, h2, h3 { color: var(--text-color); - grid-column: var(--span-grid); margin: 0; - width: 100%; } h1 { + color: var(--contrast-color); font-family: var(--font-family-headline); + font-size: var(--step-5); + font-style: italic; font-variation-settings: "opsz" 100, - "wght" 500, - "SOFT" 10, + "wght" 400, + "SOFT" 20, "WONK" 1; - font-size: var(--step-4); - font-style: normal; - line-height: calc(var(--step-4) * 0.25 + var(--step-4)); + line-height: calc(var(--step-5) * 0.25 + var(--step-5)); padding-bottom: var(--space-l); text-wrap: balance; } h2 { - font-size: var(--step-2); - font-variation-settings: - "opsz" 50, - "wght" 350, - "SOFT" 20, - "WONK" 1; - line-height: calc(var(--step-2) * 0.25 + var(--step-2)); - padding-bottom: var(--space-s); - padding-top: var(--space-s); + color: var(--contrast-color); + font-family: var(--font-family-ui); + font-size: var(--step-0); + font-variation-settings: "wght" 450; + letter-spacing: var(--wide-letter-spacing); + line-height: calc(var(--step-0) * 0.25 + var(--step-0)); + margin-block: 0 0.5lh; + text-transform: uppercase; + text-wrap: pretty; } h3 { - font-size: var(--step-1); - line-height: calc(var(--step-1) * 0.25 + var(--step-1)); + font-family: var(--font-family-ui); + font-size: var(--step--1); + font-variation-settings: "wght" 700; + letter-spacing: var(--wide-letter-spacing); + line-height: calc(var(--step--1) * 0.5 + var(--step--1)); + text-transform: uppercase; + text-wrap: pretty; + &::before { + color: var(--contrast-color); + content: "🢒"; + margin-left: calc(1em * -1); + } +} +h4 { + font-family: var(--font-family-ui); + font-size: var(--step--2); + font-variation-settings: "wght" 600; + letter-spacing: var(--wide-letter-spacing); + line-height: calc(var(--step--2) * 0.5 + var(--step--2)); + text-transform: uppercase; text-wrap: pretty; } -.logo { - filter: var(--logo-filter); +ul:not(.taglist) { + list-style-type: "◦"; + margin-left: -1.7em; + & ::marker { + color: var(--contrast-color); + } + & li { + line-height: calc(var(--step-1) * 0.5 + var(--step-1)); + padding-left: 0.5em; + } } main { display: grid; - grid-column: 1 / 12; - padding-top: var(--space-3xl); + flex: 1; + gap: var(--grid-gutter); + grid-template-columns: repeat(var(--grid-columns), 1fr); + margin: auto; + max-width: var(--grid-max-width); + margin-top: var(--space-5xl); + padding-bottom: var(--space-3xl); + width: 100%; } + main > p > img, main > p > a > img { width: 100%; @@ -361,21 +460,15 @@ li { line-height: calc(var(--step-0) * 0.5 + var(--step-0)); text-wrap: pretty; } - -th { - font-variation-settings: - "opsz" 25, - "wght" 500, - "SOFT" 40, - "WONK" 0; - padding-bottom: var(--space-2xs); - text-align: left; -} figure { - margin: 0; + margin: 0 calc(((100cqw - (var(--grid-gutter) * 11)) / 12) * -1); /* Expand beyond text grid */ margin-block: 1lh 1lh; - width: 100%; } + +figure > a > img { + cursor: zoom-in; +} + figure > a > img, figure > div > iframe { border-radius: 1em; @@ -406,7 +499,7 @@ button { color: var(--background-color); font-size: var(--step--2); font-variation-settings: var(--font-variation-ui); - letter-spacing: var(--ui-letter-spacing); + letter-spacing: var(--wide-letter-spacing); margin: var(--space-xs) 0 0 0; padding: 0 var(--space-xs); text-transform: uppercase; @@ -417,7 +510,6 @@ button > img { max-width: 1em; margin-right: 0.5em; margin-bottom: -0.1rem; - filter: var(--icon-filter); } a { &:has(button) { @@ -447,12 +539,58 @@ a[href]:active:not(.icon-button) { margin-top: var(--space-m); } +/* Tables */ table { - margin: 1em 0; + border: 2px solid var(--contrast-color); + border-collapse: separate; + border-left: 0; + border-radius: var(--space-xs); + border-spacing: 0px; + margin-block: 0 1lh; + width: 100%; } -table td, -table th { - padding-right: 1em; +td { + border-top: 2px solid var(--contrast-color); +} +th, +td { + font-style: italic; + padding: var(--space-2xs); + text-align: left; + vertical-align: top; + border-left: 2px solid var(--contrast-color); +} +thead { + border-collapse: separate; + border-color: inherit; + color: var(--contrast-color); + display: table-header-group; + font-family: var(--font-family-ui); + font-size: var(--step--1); + font-variation-settings: "wght" 800; + letter-spacing: var(--wide-letter-spacing); + text-transform: uppercase; + vertical-align: middle; + & tr th { + background-color: var(--contrast-color-tint); + } + & th { + font-style: normal; + } +} +tr { + display: table-row; + vertical-align: inherit; + border-color: inherit; +} +thead tr th:first-child { + border-radius: var(--space-xs) 0 0 0; +} +tbody:last-child tr:last-child td:first-child { + border-radius: 0 0 0 var(--space-xs); +} +thead tr th:last-child { + border-radius: 0 var(--space-xs) 0 0; } /* Footnotes */ @@ -483,13 +621,43 @@ hr { } /* Header */ -header .home-link { - display: grid; - grid-column: 1 / 1; +header { + container-type: inline-size; } -.logo { - aspect-ratio: 1 / 1; - width: var(--space-l-xl); + +/* Post Metadata */ +article > .post-image, +.hero > a > .post-image { + border-radius: 1em; + border-top-left-radius: 0; + cursor: zoom-in; + height: 100%; + margin: 0 calc(((100cqw - (var(--grid-gutter) * 11)) / 12) * -1); /* Expand beyond text grid */ + margin-block: 1lh 1lh; + max-width: calc(((100cqw) / 12) * 14); + width: calc(((100cqw) / 12) * 14); +} + +.post-synopsis { + font-size: var(--step-1); +} + +.post-time-author, +.post-taglist { + color: var(--color-metadata); + display: block; + font-family: var(--font-family-metadata); + font-size: var(--font-size-metadata); + font-variation-settings: var(--font-variation-settings-metadata); + letter-spacing: var(--letter-spacing-metadata); + line-height: var(--line-height-metadata); + text-transform: var(--text-transform-metadata); + & a[href], + a[href]:hover, + a[href]:visited { + color: var(--contrast-color); + text-decoration: none; + } } /* Info Box */ @@ -505,78 +673,226 @@ header .home-link { } } +/* Author / Profile Pic */ +.author { + align-items: flex-start; + display: flex; + background-color: var(--contrast-color-tint); + border-radius: var(--large-rounded-radius); + border-top-left-radius: 0; + margin-block: 0 1lh; + margin-left: 0; + margin-right: 0; + padding: var(--space-m) var(--space-l) var(--space-s) var(--space-l); + & a { + text-decoration: none; + & .authorName { + color: var(--contrast-color); + display: block; + font-family: var(--font-family-ui); + font-size: var(--step--1); + font-variation-settings: "wght" 600; + letter-spacing: var(--wide-letter-spacing); + text-transform: uppercase; + } + } + & .profilePic { + border-radius: var(--large-rounded-radius); + border-top-left-radius: 0; + height: var(--space-3xl); + margin-right: var(--space-s); + width: var(--space-3xl); + } + & p { + font-family: var(--font-family-ui); + font-size: var(--step--2); + font-variation-settings: "wght" 400; + line-height: calc(var(--step--2) * 0.25 + var(--step--2)); + } +} + /* Nav */ -.nav { - padding: 0; - margin: 0; - list-style: none; -} -nav ul { - align-items: end; - display: flex; - justify-content: flex-end; - gap: var(--space-xs-s); - flex-flow: row wrap; -} -.nav-icon { - fill: var(--color-gray-90); - height: var(--space-2xs); - margin-right: 0.25rem; - transition: var(--transition-normal); - width: var(--space-2xs); -} -.nav-item { - align-items: baseline; - border-top: var(--border-nav); - display: flex; - font-size: var(--step--2); - font-variation-settings: var(--font-variation-ui); - height: var(--space-l-xl); - margin-bottom: 0; - padding-top: var(--space-m); - text-transform: uppercase; - transition: var(--transition-normal); - letter-spacing: var(--ui-letter-spacing); -} -.nav-item a { - color: var(--text-color); - margin-top: calc(var(--space-xs-s) * -1); /* Compensate for padding */ - padding-top: var(--space-xs-s); /* Give a larger click area */ -} -.nav-item:hover { - border-top: var(--border-nav-hover); /* Increase border thickness */ -} -.nav-item:hover a { - margin-top: calc( - var(--space-xs-s) * -2 - ); /* Compensate for border thickness */ -} -.nav-item a[href]:visited { - color: var(--text-color); -} -.nav-item:hover a[href] { - color: var(--text-color); - text-decoration: none; -} -.nav-item a[href]:not(:hover) { - text-decoration: none; -} -.nav-item[data-currentpage="true"] { - border-top: var(--border-nav-currentpage); -} -.nav-item[data-currentpage="true"] a, -.nav-item[data-currentpage="true"] a[href]:visited, -.nav-item[data-currentpage="true"]:hover a { - color: var(--contrast-color); - margin-top: calc( - var(--space-xs-s) * -2 - ); /* Compensate for border thickness */ +nav { + background-color: var(--nav-footer-color); + border-bottom: var(--border-header-footer); + left: 0; + margin-left: calc(var(--grid-gutter) * -1); + margin-right: calc(var(--grid-gutter) * -1); + padding-inline: calc(var(--grid-gutter) * 2); + position: fixed; + top: 0; + width: calc(100% + var(--grid-gutter) * 2); + z-index: 10; + & .nav-elements-grid-container { + container-type: inline-size; + display: grid; + gap: var(--grid-gutter); + grid-template-columns: repeat(var(--grid-columns), 1fr); + margin: auto; + max-width: var(--grid-max-width); + & .nav-elements-container { + grid-column: 1 / span 12; + color: var(--contrast-color); + display: flex; + align-items: center; + justify-content: space-between; + & .blog-name { + align-self: center; + color: var(--contrast-color); + font-family: var(--font-family); + font-size: var(--step-1); + font-variation-settings: + "opsz" 80, + "wght" 450, + "SOFT" 0, + "WONK" 1; + text-align: center; + text-decoration: none; + } + & .home-link { + & .logo { + aspect-ratio: 1 / 1; + fill: var(--contrast-color); + width: var(--space-m-l); + height: var(--space-m-l); + margin: var(--space-2xs) 0; + } + } + & ul { + display: flex; + gap: var(--space-xs-s); + flex-flow: row wrap; + justify-content: flex-end; + list-style: none; + margin: 0; + padding: 0; + & .nav-item { + align-items: baseline; + font-size: var(--step--2); + font-variation-settings: var(--font-variation-ui); + text-transform: uppercase; + letter-spacing: var(--wide-letter-spacing); + & a[href], + a[href]:visited, + a[href]:hover { + color: var(--contrast-color); + text-decoration: none; + } + & .nav-icon { + fill: var(--contrast-color); + height: var(--space-2xs); + margin-right: 0.25rem; + width: var(--space-2xs); + } + } + } + } + } } sup { line-height: 0; } +/* Post list */ +.postlist { + & .postlist-item-container { + display: flex; + flex-flow: column nowrap; + gap: var(--space-s); + margin-top: var(--space-xl); + & .postlist-item { + align-items: flex-start; + display: flex; + flex-flow: row nowrap; + justify-content: flex-start; + width: 100%; + & .post-copy { + display: flex; + flex-flow: column wrap; + flex: 1; + padding-right: var(--space-xl); + & > p { + margin: var(--space-xs) 0; + } + & p { + } + & .post-metadata { + & .post-metadata-copy { + & p, + p a { + color: var(--color-metadata); + font-family: var(--font-family-metadata); + font-size: var(--font-size-metadata); + letter-spacing: var(--letter-spacing-metadata); + text-decoration: none; + text-transform: var(--text-transform-metadata); + } + } + } + } + & .postlist-link { + font-size: var(--step-5); + padding-right: 0.5em; + text-decoration: none; + & h3 { + color: var(--contrast-color); + font-family: var(--font-family-ui); + font-size: var(--step--1); + font-variation-settings: "wght" 700; + letter-spacing: var(--wide-letter-spacing); + line-height: calc(var(--step--1) * 0.5 + var(--step--1)); + text-transform: uppercase; + &:before { + content: ""; + margin-left: 0; + } + } + & .post-image-container { + border-radius: 0.25em; + border-top-left-radius: 0; + box-shadow: var(--box-shadow); + height: var(--space-5xl); + max-height: var(--space-5xl); + overflow: hidden; + width: var(--space-5xl); + & .post-image { + width: var(--space-5xl); + height: var(--space-5xl); + object-fit: cover; + object-position: 50% 50%; + } + } + } + } + } +} +.postlist-header { + margin-top: var(--space-2xl); +} +/* XML Feed Preview */ +h1.feed-preview { + grid-column: var(--span-grid); +} +.postlist-date { + color: var(--color-metadata); + font-family: var(--font-family-metadata); + font-size: var(--font-size-metadata); + letter-spacing: var(--letter-spacing-metadata); + text-decoration: none; + text-transform: var(--text-transform-metadata); +} + +h3.postlist-link { + color: var(--contrast-color); + font-family: var(--font-family-ui); + font-size: var(--step--1); + font-variation-settings: "wght" 700; + letter-spacing: var(--wide-letter-spacing); + line-height: calc(var(--step--1) * 0.5 + var(--step--1)); + text-transform: uppercase; +} + /* Site Settings */ #siteSettings { border: 1.5px solid var(--color-gray-20); @@ -594,11 +910,11 @@ sup { @starting-style { opacity: 0; } - } - &[open]::backdrop { - opacity: 1; - @starting-style { - opacity: 0; + &::backdrop { + opacity: 1; + @starting-style { + opacity: 0; + } } } } /* TODO: figure out why exit animation doesn't work */ @@ -613,7 +929,7 @@ sup { font-size: var(--step--2); font-variation-settings: var(--font-variation-ui); text-transform: uppercase; - letter-spacing: var(--ui-letter-spacing); + letter-spacing: var(--wide-letter-spacing); font-family: var(--font-family-ui); & label { display: inline; @@ -635,7 +951,6 @@ sup { /* Direct Links / Markdown Headers */ a.header-anchor { font-style: normal; - margin-left: 0.1em; text-decoration: none; } a[href].header-anchor, @@ -655,19 +970,6 @@ h2 + .header-anchor { } /* Components */ -#buttonsAndStuffContainer { - /* This lives in the footer*/ - display: flex; - grid-column: var(--span-grid); - width: 100%; - & a, - img, - div { - display: inline-block; - height: var(--space-m-l); - margin-right: var(--space-3xs); - } -} .card { align-items: flex-start; background-color: var(--card-color); @@ -681,6 +983,16 @@ h2 + .header-anchor { width: 100%; } +ul.taglist { + & li { + & a[href], + a[href]:hover, + a[href]:visited { + color: var(--contrast-color); + } + } +} + /* Utilities */ .grid-container { max-width: var(--grid-max-width); @@ -695,3 +1007,135 @@ h2 + .header-anchor { .hidden { display: none !important; } + +/* Dark mode overrides */ +@media (prefers-color-scheme: dark) { + .isso-preview { + background: repeating-linear-gradient( + -45deg, + rgb(50, 50, 70), + rgb(50, 50, 70) 10px, + var(--background-color) 10px, + var(--background-color) 20px + ) !important; + } + .logo { + fill: var(--text-color); + } +} + +/* Small Screen Overrides */ +@media (max-width: 900px) { + figure, + .hero > a > .post-image { + margin-left: auto; + margin-right: auto; + max-width: var(--grid-max-width); + width: 100%; + } +} + +@media (max-width: 540px) { + .author { + display: flex; + flex-flow: column nowrap; + justify-content: center; + text-align: center; + & a { + display: flex; + justify-content: center; + width: 100%; + & img.profilePic { + aspect-ratio: 1/1; + margin-bottom: var(--space-s); + margin-right: 0; + } + } + } + .continue-discussion a { + display: flex; + justify-content: center; + width: 100%; + } + nav { + & > .nav-elements-grid-container { + & > .nav-elements-container { + & > .blog-name { + font-size: var(--step-0); + } + & > .home-link { + } + & > ul.nav { + flex-flow: column nowrap; + gap: 0; + & li { + line-height: calc(var(--step-0) * 0.25 + var(--step-0)); + } + } + } + } + } + .postlist { + & .postlist-item-container { + margin-top: var(--space-s); + & .postlist-item { + flex-flow: column wrap; + & .post-copy { + & .post-metadata { + padding-bottom: 0; + } + } + & .postlist-link { + padding: 0; + & h3 { + padding-top: 0; + } + & p { + margin-top: var(--space-xs); + } + & .post-image-container { + margin-left: 0; + min-height: var(--space-10xl); + width: 100%; + & .post-image { + width: 100cqw; + height: var(--space-10xl); + } + } + } + } + } + } + .postlist-header { + margin-top: var(--space-l); + } +} + + +@container (width < 540px) { + .footerContainer { + & p { + margin-bottom: 0 !important; + } + } + .webringsContainer { + grid-column: 1 / span 12 !important; + grid-row: 2 / 2; + } + .linksContainer { + grid-column: 1 / span 12 !important; + grid-row: 3 / 3; + } +} + +@container (width < 400px) { + blockquote { + padding: var(--space-s) var(--space-s); + & p { + margin-block: 0 !important; + margin-bottom: 0; + padding-left: 0; + padding-top: var(--space-xl); + } + } +} diff --git a/public/css/me.css b/public/css/me.css index bccc220..f680a2f 100644 --- a/public/css/me.css +++ b/public/css/me.css @@ -16,16 +16,27 @@ justify-content: center; width: 100%; margin: 0 0 var(--space-s) 0; - & > img { - max-width: var(--space-s); + & > svg { + fill: var(--background-color); + margin-right: var(--space-xs); + width: var(--space-s); + height: var(--space-s); } } h1.socialTitle { padding: 0; - margin: 0; - font-size: var(--step-4); - line-height: calc(var(--step-4) * 0.5 + var(--step-4)); + margin-top: var(--space-m);; + + color: var(--contrast-color); + font-family: var(--font-family-ui); + font-size: var(--step-0); + font-style: normal; + font-variation-settings: "wght" 450; + letter-spacing: var(--wide-letter-spacing); + line-height: calc(var(--step-0) * 0.25 + var(--step-0)); + text-transform: uppercase; + text-wrap: pretty; } .links-container p { @@ -37,5 +48,5 @@ h1.socialTitle { img.profilePic { max-width: var(--space-6xl); border-radius: 50%; - border: solid 2px var(--text-color); + border: solid 2px var(--contrast-color); } diff --git a/public/css/metadata.css b/public/css/metadata.css deleted file mode 100644 index 16f2e53..0000000 --- a/public/css/metadata.css +++ /dev/null @@ -1,32 +0,0 @@ -.post-metadata { - display: flex; - flex-flow: row nowrap; - padding: 0 0 var(--space-l) 0; -} - -.post-metadata-copy { - display: flex; - flex-flow: column nowrap; - justify-content: center; -} - -.post-metadata p, -.post-metadata ul, -.post-metadata ul li, -time, -.metadata { - display: flex; - flex-flow: row wrap; - font-family: var(--meta-font-family); - font-size: var(--meta-font-size); - font-style: var(--meta-font-style); - font-variation-settings: var(--meta-font-variation-settings); - line-height: calc(var(--meta-font-size) * 0.5 + var(--meta-font-size)); - list-style: none; - margin: 0; - padding-left: 0em; -} - -.post-metadata { - padding-left: 0.15rem; -} diff --git a/public/css/microblog.css b/public/css/microblog.css index da81b66..9809784 100644 --- a/public/css/microblog.css +++ b/public/css/microblog.css @@ -1,5 +1,5 @@ .microblog-comment { - p { + & p { font-style: italic; margin: 0; padding: var(--space-s) 0 0 0; @@ -12,20 +12,42 @@ } .microblog-icon { - filter: var(--logo-filter); + fill: var(--contrast-color); height: var(--space-4xl); padding-right: var(--space-s); width: var(--space-2xl); } .microblog-list { - .post-metadata { + & .postlist-item-container { + display: flex; + flex-flow: column nowrap; + gap: var(--space-s); + & .postlist-item { + & .post-copy { + & .post-metadata { + & .post-metadata-copy { + & p { + margin-bottom: 0; + } + } + } + & h3 { + &:before { + content: ""; + margin-left: 0; + } + } + } + } + } + & .post-metadata { padding: 0; } } .microblog-post { display: flex; - .microblog-comment { - p { + & .microblog-comment { + & p { padding-top: 0; padding-bottom: var(--space-2xs); } @@ -37,25 +59,28 @@ align-items: center; padding: var(--space-s); } - .microblog-status-copy { + & h2 { + margin-top: var(--space-m); + } + & .microblog-status-copy { align-items: center; display: flex; flex-flow: column nowrap; p { margin: 0; } - .status-metadata { - font-family: var(--meta-font-family); - font-size: var(--meta-font-size); - font-style: var(--meta-font-style); - font-variation-settings: var(--meta-font-variation-settings); - line-height: calc(var(--meta-font-size) * 0.5 + var(--meta-font-size)); + & .status-metadata { + color: var(--color-metadata); + font-family: var(--font-family-metadata); + font-size: var(--font-size-metadata); + font-variation-settings: var(--font-variation-settings-metadata); + letter-spacing: var(--letter-spacing-metadata); + line-height: calc(var(--font-size-metadata) * 0.5 + var(--font-size-metadata)); + text-transform: var(--text-transform-metadata); + & a[href] { + color: var(--color-metadata); + text-decoration: none; + } } } } - -.postlist-item-container { - display: flex; - flex-flow: column nowrap; - gap: var(--space-s); -} diff --git a/public/css/navigator.css b/public/css/navigator.css index bea63d1..0f174de 100644 --- a/public/css/navigator.css +++ b/public/css/navigator.css @@ -2,43 +2,45 @@ display: grid; gap: var(--space-2xs) var(--space-2xs); grid-template-columns: repeat(auto-fill, minmax(var(--space-6xl), 1fr)); + margin-bottom: var(--space-xl); + margin-top: var(--space-xl); width: 100%; .navigatorItem { background-color: var(--background-color); - border: 1.5px solid var(--color-gray-20); + border: var(--border-header-footer); border-radius: var(--border-radius); color: var(--text-color); display: flex; - flex-flow: column wrap; + flex-flow: row nowrap; height: var(--space-3xl); text-align: center; - a { + & a[href] { height: 100%; padding: var(--space-s) var(--space-xs); text-decoration: none; width: 100%; - img { + & p { + font-family: var(--font-family-ui); + font-size: var(--step--2); + font-variation-settings: var(--font-variation-ui); + text-transform: uppercase; + letter-spacing: var(--wide-letter-spacing); + } + & svg { aspect-ratio: 1 / 1; - filter: var(--logo-filter); + fill: var(--text-color); + max-height: var(--space-m); width: var(--space-m); } } &:hover { - background-color: var(--text-color); - border: 1.25px solid var(--text-color); + background-color: var(--contrast-color); transition: var(--transition-normal); - a { + & a { color: var(--background-color); transition: var(--transition-normal); - img { - filter: none; - transition: var(--transition-normal); - } - @media (prefers-color-scheme: dark) { - img { - filter: brightness(0) saturate(100%) invert(16%) sepia(0%) - saturate(1024%) hue-rotate(177deg) brightness(99%) contrast(88%); - } + & svg { + fill: var(--background-color); } } } diff --git a/public/css/post-list.css b/public/css/post-list.css deleted file mode 100644 index 337c681..0000000 --- a/public/css/post-list.css +++ /dev/null @@ -1,91 +0,0 @@ -/* Posts list */ -.postlist, -.links-nextprev { - container: postlist / inline-size; -} -.postlist-item { - align-items: flex-start; - display: flex; - flex-flow: row nowrap; - justify-content: flex-start; - width: 100%; -} -.postlist-item-container { - display: flex; - flex-flow: column nowrap; - gap: var(--space-s); -} -.post-image { - width: var(--space-4xl); - height: var(--space-4xl); - object-fit: cover; - object-position: 50% 50%; -} -.post-image-container { - border-radius: var(--border-radius); - box-shadow: var(--box-shadow); - height: var(--space-4xl); - max-height: var(--space-4xl); - overflow: hidden; - width: var(--space-4xl); -} - -.postlist-date, -.postlist-item:before { - color: var(--color-gray-90); - font-size: var(--meta-font-size); -} -.postlist-date { - word-spacing: -0.5px; -} -.postlist-link { - font-size: var(--step-5); - padding-right: 0.5em; - text-decoration: none; -} - -.postlist-link p { - background-color: var(--color-gray-90); - border-radius: 100px; - color: var(--background-color); - font-family: var(--font-family-ui); - font-size: var(--step--2); - font-variation-settings: var(--font-variation-ui); - letter-spacing: var(--ui-letter-spacing); - margin-top: calc(var(--space-3xs) * -1); - padding-left: var(--space-xs); - padding-right: var(--space-xs); - text-transform: uppercase; - width: max-content; -} -.post-copy { - display: flex; - flex-flow: column wrap; -} - -@container postlist (max-width: 500px) { - .postlist-item { - flex-flow: column wrap; - } - .post-image-container { - margin-left: 0; - min-height: var(--space-10xl); - width: 100%; - } - .post-image-container img.post-image { - width: 100cqw; - height: var(--space-10xl); - } - .postlist-link { - padding: 0; - } - .postlist-link h3 { - padding-top: var(--space-m); - } - .postlist-link p { - margin-top: var(--space-xs); - } - .post-metadata { - padding-bottom: 0; - } -} diff --git a/public/css/profile-pic.css b/public/css/profile-pic.css deleted file mode 100644 index 26e06a1..0000000 --- a/public/css/profile-pic.css +++ /dev/null @@ -1,6 +0,0 @@ -.profilePic:not(.links-container > img.profilePic) { - border-radius: 100%; - height: var(--space-xl); - margin-right: var(--space-s); - width: var(--space-xl); -} diff --git a/public/css/quiz.css b/public/css/quiz.css index 69b6913..b5b604d 100644 --- a/public/css/quiz.css +++ b/public/css/quiz.css @@ -18,7 +18,7 @@ details:not(.toc) { font-size: var(--step--2); font-variation-settings: var(--font-variation-ui); text-transform: uppercase; - letter-spacing: var(--ui-letter-spacing); + letter-spacing: var(--wide-letter-spacing); font-family: var(--font-family-ui); ::marker { @@ -40,7 +40,7 @@ details:not(.toc) { font-size: var(--step--2); font-variation-settings: var(--font-variation-ui); text-transform: uppercase; - letter-spacing: var(--ui-letter-spacing); + letter-spacing: var(--wide-letter-spacing); font-family: var(--font-family-ui); } } diff --git a/public/css/search.css b/public/css/search.css index 494a608..6bb8dfa 100644 --- a/public/css/search.css +++ b/public/css/search.css @@ -28,13 +28,44 @@ mark { font-family: var(--font-family-ui) !important; font-size: var(--step--2) !important; font-variation-settings: var(--font-variation-ui) !important; - letter-spacing: var(--ui-letter-spacing) !important; + letter-spacing: var(--wide-letter-spacing) !important; margin: var(--space-xs) 0 0 0 !important; padding: 0 var(--space-xs) !important; text-transform: uppercase !important; transition: var(--transition-normal) !important; white-space: nowrap !important; } +.pagefind-ui__results-area { + .pagefind-ui__message { + font-family: var(--font-family-ui); + font-size: var(--step--2); + font-variation-settings: "wght" 500; + letter-spacing: var(--wide-letter-spacing); + padding-top: 0; + text-transform: uppercase; +} + .pagefind-ui__results { + & .pagefind-ui__result { + & .pagefind-ui__result-inner { + & .pagefind-ui__result-excerpt { + font-size: var(--step-0); + line-height: calc(var(--step-0) * 0.5 + var(--step-0)); + } + & .pagefind-ui__result-title { + font-family: var(--font-family-ui); + font-size: var(--step--1); + font-variation-settings: "wght" 700; + letter-spacing: var(--wide-letter-spacing); + line-height: calc(var(--step--1) * 0.5 + var(--step--1)); + text-transform: uppercase; + & a[href] { + color: var(--contrast-color); + } + } + } + } + } +} .pagefind-ui__search-clear { font-family: var(--meta-font-family) !important; diff --git a/public/css/tags.css b/public/css/tags.css index a13598d..93bb6c1 100644 --- a/public/css/tags.css +++ b/public/css/tags.css @@ -1,31 +1,27 @@ a.post-tag { - background-color: var(--color-gray-20); - border-radius: 1rem; - color: var(--text-color); + color: var(--background-color); font-family: var(--meta-font-family); font-variation-settings: "wght" 300; - margin-top: var(--space-3xs); - margin-right: var(--space-3xs); - padding: 0 var(--space-3xs); + text-decoration: none; } a.post-tag:before { content: "#"; } a.post-tag:visited { - color: var(--text-color); + color: var(--background-color); } -a.post-tag:hover { - color: var(--text-color); +a[href].post-tag:hover { + color: var(--background-color); } .tag-feed-icon { fill: var(--rss-orange); - height: var(--space-m); + height: var(--space-s); transition: var(--transition-normal); - width: var(--space-m); + width: var(--space-s); &.small { - height: var(--space-s); - width: var(--space-s); + height: var(--space-xs); + width: var(--space-xs); } } .taglist { diff --git a/public/css/toc.css b/public/css/toc.css index 0d57c18..07fc7a6 100644 --- a/public/css/toc.css +++ b/public/css/toc.css @@ -1,11 +1,46 @@ -details.toc { - padding-bottom: var(--space-m); -} - .toc { + padding-bottom: var(--space-m); + & div.toc { + background-color: var(--contrast-color-tint); + border-radius: var(--large-rounded-radius); + border-top-left-radius: 0; + color: var(--contrast-color); + font-family: var(--font-family-ui); + font-variation-settings: "wght" 360; + margin-left: 0; + margin-right: 0; + padding: var(--space-s) var(--space-l) var(--space-m) var(--space-m); + } & ol { margin-bottom: 0; margin-top: 0; padding-left: var(--space-m); + & li { + font-size: var(--step--1); + & a { + text-decoration: none; + } + } + } + &[open] { + & summary::marker { + content: "✸ "; + font-size: var(--step--1); + } + } + & summary { + cursor: pointer; + font-family: var(--font-family-ui); + font-size: var(--step--2); + font-variation-settings: "wght" 700; + letter-spacing: var(--wide-letter-spacing); + margin-left: -1.5em; + text-transform: uppercase; + &::marker { + color: var(--contrast-color); + content: "✸ "; + font-size: var(--step--1); + padding-top: 1em; + } } } diff --git a/public/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-1.webp b/public/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-1.webp new file mode 100644 index 0000000..aaee160 Binary files /dev/null and b/public/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-1.webp differ diff --git a/public/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-2.webp b/public/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-2.webp new file mode 100644 index 0000000..d8a2430 Binary files /dev/null and b/public/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-2.webp differ diff --git a/public/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-3.webp b/public/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-3.webp new file mode 100644 index 0000000..1eae6f3 Binary files /dev/null and b/public/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-3.webp differ diff --git a/public/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-4.webp b/public/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-4.webp new file mode 100644 index 0000000..0ccf0ac Binary files /dev/null and b/public/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-4.webp differ diff --git a/public/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-5.webp b/public/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-5.webp new file mode 100644 index 0000000..49401ec Binary files /dev/null and b/public/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-5.webp differ diff --git a/public/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-6.webp b/public/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-6.webp new file mode 100644 index 0000000..d0f9524 Binary files /dev/null and b/public/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-6.webp differ diff --git a/public/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-7.webp b/public/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-7.webp new file mode 100644 index 0000000..1bd50d1 Binary files /dev/null and b/public/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-7.webp differ diff --git a/public/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-8.webp b/public/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-8.webp new file mode 100644 index 0000000..8c4511b Binary files /dev/null and b/public/img/gallery/wild-berry-fizzy-pop/wild-berry-fizzy-pop-powder-8.webp differ diff --git a/public/img/ranch/vegan-ranch-dressing.webp b/public/img/ranch/vegan-ranch-dressing.webp new file mode 100644 index 0000000..68ff991 Binary files /dev/null and b/public/img/ranch/vegan-ranch-dressing.webp differ diff --git a/public/img/what-would-you-do-if-you-didnt-have-to-work/ducc.webp b/public/img/what-would-you-do-if-you-didnt-have-to-work/ducc.webp new file mode 100644 index 0000000..6377d04 Binary files /dev/null and b/public/img/what-would-you-do-if-you-didnt-have-to-work/ducc.webp differ diff --git a/public/img/wild-berry-fizzy-pop-powder/diabolical.webp b/public/img/wild-berry-fizzy-pop-powder/diabolical.webp new file mode 100644 index 0000000..81c384e Binary files /dev/null and b/public/img/wild-berry-fizzy-pop-powder/diabolical.webp differ diff --git a/public/xsl/basic.xsl b/public/xsl/basic.xsl index 1b95702..98c476e 100644 --- a/public/xsl/basic.xsl +++ b/public/xsl/basic.xsl @@ -11,14 +11,12 @@ -
-

RSS Feed Preview

+

RSS Feed Preview

This is an RSS feed. Subscribe by copying the URL from the address bar into your newsreader. Don’t have a newsreader? Learn more and get started. It’s free. Below is a preview of what you’ll see in your newsreader when you subscribe. Done here? Go back to nathanupchurch.com

-

Posts

@@ -40,7 +38,7 @@ -

+