From a108cc750171f3274364b7112e8ea97cabbdea60 Mon Sep 17 00:00:00 2001
From: David Lapshin <ddaudix@gmail.com>
Date: Thu, 16 May 2024 17:20:34 +0300
Subject: [PATCH] Fancier hr, goatcounter analytics, simplify bg-color
 variable, add default value for the locale setting

---
 config.toml                      | 14 +++++++++++---
 content/_index.md                |  2 +-
 sass/_main.scss                  | 20 +++++++++++++++-----
 sass/_variables.scss             |  6 ++----
 templates/partials/comments.html |  2 +-
 templates/partials/head.html     |  5 +++++
 6 files changed, 35 insertions(+), 14 deletions(-)

diff --git a/config.toml b/config.toml
index 7f6c53a..4b333f3 100644
--- a/config.toml
+++ b/config.toml
@@ -103,12 +103,20 @@ show_source = false
 # These variables are also used for Mastodon verification,
 # the needed rel="me" link is set in the head based on these.
 [extra.comments]
-# Your Mastodon API host; instance that you have an account on
+# Your Mastodon API host; instance that you have an account on.
 host = "vmst.io"
-# Your Mastodon username; used to determine who the original poster is
+# Your Mastodon username; used to determine who the original poster is.
 user = "daudix"
 # Whether to show the QR code to Mastodon post
 show_qr = true
 # BCP 47 locale used for comment timestamps;
 # See https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry
-locale = "en-IE"
+# Default: "en-IE"
+# locale = "YOUR_LOCALE"
+
+# GoatCounter analytics; enabled only if present in config.
+[extra.goatcounter]
+# Your GoatCounter server; goatcounter.com is used by default.
+# host = "YOUR_SERVER"
+# Your GoatCounter username
+user = "daudix"
diff --git a/content/_index.md b/content/_index.md
index 707c1e2..963cd37 100644
--- a/content/_index.md
+++ b/content/_index.md
@@ -112,7 +112,7 @@ primary_color_alpha = "COLOR_CODE"
 - [alavi.me](https://alavi.me)
 - [bano.dev](https://bano.dev)
 - [blog.pansi21.xyz](https://blog.pansi21.xyz)
-- [daudix.codeberg.page](https://daudix.codeberg.page) (obviously)
+- [daudix.codeberg.page](https://daudix.codeberg.page) <small>(obviously)</small>
 - [daveparr.info](https://www.daveparr.info)
 - [digital-horror.com](https://digital-horror.com)
 - [enriquekesslerm.com](https://enriquekesslerm.com)
diff --git a/sass/_main.scss b/sass/_main.scss
index ff89742..d1a1cc9 100644
--- a/sass/_main.scss
+++ b/sass/_main.scss
@@ -62,8 +62,7 @@ body {
 
 // LAYOUT
 .container {
-	margin-right: auto;
-	margin-left: auto;
+	margin: 0 auto;
 	width: min(var(--container-width), 90%);
 }
 
@@ -125,9 +124,20 @@ dl {
 
 hr {
 	margin: 2rem auto;
-	border: 0;
-	border-top: 1px solid var(--fg-muted-2);
-	width: 100%;
+	border: none;
+	border-top: 3px double var(--fg-muted-2);
+	overflow: visible;
+	color: var(--fg-muted-4);
+	font-size: 1.5rem;
+	text-align: center;
+
+	&::after {
+		position: relative;
+		top: -1.5rem;
+		background: var(--bg-color);
+		padding: 0 0.25rem;
+		content: "☙❧";
+	}
 }
 
 blockquote {
diff --git a/sass/_variables.scss b/sass/_variables.scss
index 6919cd7..5e1c6f3 100644
--- a/sass/_variables.scss
+++ b/sass/_variables.scss
@@ -1,6 +1,6 @@
 :root {
 	// COLORS
-	--bg-color: var(--bg-color-l);
+	--bg-color: linear-gradient(rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.8)), var(--primary-color);
 	--fg-color: rgba(0, 0, 0, 0.8);
 	--fg-muted-1: rgba(0, 0, 0, 0.05);
 	--fg-muted-2: rgba(0, 0, 0, 0.1);
@@ -21,8 +21,6 @@
 
 	// VARIABLES
 	--active: 0.9;
-	--bg-color-d: linear-gradient(rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.9)), var(--primary-color);
-	--bg-color-l: linear-gradient(rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.8)), var(--primary-color);
 	--blur: saturate(180%) blur(10px);
 	--container-width: 720px;
 	--edge-highlight: inset 0 1px 0 rgba(255, 255, 255, 0.1);
@@ -39,7 +37,7 @@
 
 	@media (prefers-color-scheme: dark) {
 		// COLORS
-		--bg-color: var(--bg-color-d);
+		--bg-color: linear-gradient(rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.9)), var(--primary-color);
 		--fg-color: rgb(255, 255, 255);
 		--fg-muted-1: rgba(255, 255, 255, 0.05);
 		--fg-muted-2: rgba(255, 255, 255, 0.1);
diff --git a/templates/partials/comments.html b/templates/partials/comments.html
index a33b886..2bfab0d 100644
--- a/templates/partials/comments.html
+++ b/templates/partials/comments.html
@@ -185,7 +185,7 @@
 							permalink.setAttribute("rel", "external nofollow");
 							permalink.textContent = new Date(
 								status.created_at
-							).toLocaleString("{{ config.extra.comments.locale }}", {
+							).toLocaleString("{{ config.extra.comments.locale | default(value='en-IE') }}", {
 								dateStyle: "long",
 								timeStyle: "short",
 							});
diff --git a/templates/partials/head.html b/templates/partials/head.html
index aa06c38..48d8f07 100644
--- a/templates/partials/head.html
+++ b/templates/partials/head.html
@@ -37,6 +37,11 @@
 		<script src="{{ get_url(path='copy-button.js') }}"></script> 
 	{% endif %}
 
+	{% if config.extra.goatcounter %}
+		<script data-goatcounter="https://{{ config.extra.goatcounter.user }}.{{ config.extra.goatcounter.host | default(value='goatcounter.com') }}/count" async src="//gc.zgo.at/count.js"></script>
+		<noscript><img src="https://{{ config.extra.goatcounter.user }}.{{ config.extra.goatcounter.host | default(value='goatcounter.com') }}/count?p={{ current_path | default(value='/') | safe }}"></noscript>
+	{% endif %}
+
 	{% if config.extra.comments %}
 		<link rel="me" href="https://{{ config.extra.comments.host }}/@{{ config.extra.comments.user }}" />
 	{% endif %}