From c52a07e3fa738135eaa5272d9f115e4740b60c61 Mon Sep 17 00:00:00 2001
From: SayaAndy <saya.andy@posteo.com>
Date: Tue, 4 Nov 2025 13:23:33 +0300
Subject: fix: correctly pack galleries on mobiles feat: switch masonry to
 packery debug: log app shutdown more

---
 views/layouts/general-page.html | 36 +++++++++++++++++++++++++++++++++++-
 1 file changed, 35 insertions(+), 1 deletion(-)

(limited to 'views')

diff --git a/views/layouts/general-page.html b/views/layouts/general-page.html
index 62360ad..5c1867a 100644
--- a/views/layouts/general-page.html
+++ b/views/layouts/general-page.html
@@ -137,6 +137,7 @@
                         document.body.append(frame);
                     }
                     break;
+                case "lilac": break;
             }
         }
 
@@ -267,7 +268,40 @@
     <script src="https://f003.backblazeb2.com/file/sayana-static/libs/htmx/2.0.6/htmx.min.js"></script>
     <script src="https://f003.backblazeb2.com/file/sayana-static/libs/leaflet/1.9.4/leaflet.js"></script>
     <script src="https://f003.backblazeb2.com/file/sayana-static/libs/imagesloaded/5.0.0/imagesloaded.pkgd.min.js"></script>
-    <script src="https://f003.backblazeb2.com/file/sayana-static/libs/masonry-layout/4.2.2/masonry.pkgd.min.js"></script>
+    <script src="https://f003.backblazeb2.com/file/sayana-static/libs/packery/3.0.0/dist/packery.pkgd.js"></script>
+
+    <script>
+        // Enable fitWidth-like attribute for Packery. Source: https://codepen.io/desandro/pen/kVmLYz
+        var __resetLayout = Packery.prototype._resetLayout;
+        Packery.prototype._resetLayout = function() {
+            __resetLayout.call( this );
+            var parentSize = getSize( this.element.parentNode );
+            var colW = this.columnWidth + this.gutter;
+            this.fitWidth = Math.floor( ( ( parentSize.innerWidth + this.gutter ) / colW ) * 1.01 ) * colW;
+            this.packer.width = this.fitWidth;
+            this.packer.height = Number.POSITIVE_INFINITY;
+            this.packer.reset();
+        };
+
+        Packery.prototype._getContainerSize = function() {
+            var emptyWidth = 0;
+            for ( var i=0, len = this.packer.spaces.length; i < len; i++ ) {
+                var space = this.packer.spaces[i];
+                if ( space.y === 0 && space.height === Number.POSITIVE_INFINITY ) {
+                    emptyWidth += space.width;
+                }
+            }
+
+            return {
+                width: this.fitWidth - this.gutter - emptyWidth,
+                height: this.maxY - this.gutter
+            };
+        };
+
+        Packery.prototype.needsResizeLayout = function() {
+            return true;
+        };
+    </script>
 
     <div id="general-page-bottom-embeds" class="flex"
         hx-get="/api/v1/general-page/bottom-embeds{{ if .QueryString }}?{{ .QueryString }}{{ end }}" hx-trigger="load" hx-target="this" hx-swap="innerHTML">
-- 
cgit v1.3.1+13


From 05d7fe78450219e85ebe9c4372a20f8edd264d8d Mon Sep 17 00:00:00 2001
From: SayaAndy <saya.andy@posteo.com>
Date: Tue, 4 Nov 2025 14:43:52 +0300
Subject: feat: move published date info from header into start of the body
 feat: show action date on any screen feat: show short description together
 with dates in page's body refactor: use minified packery dist

---
 internal/router/handlers/lang-blog-title.go |  3 +--
 views/layouts/general-page.html             |  4 ++--
 views/pages/blog-page.html                  | 12 +++++++++---
 views/pages/language-pick.html              |  2 +-
 views/partials/general-page-header.html     |  4 +---
 5 files changed, 14 insertions(+), 11 deletions(-)

(limited to 'views')

diff --git a/internal/router/handlers/lang-blog-title.go b/internal/router/handlers/lang-blog-title.go
index f1be2cd..0f4f564 100644
--- a/internal/router/handlers/lang-blog-title.go
+++ b/internal/router/handlers/lang-blog-title.go
@@ -74,6 +74,7 @@ func (r *BlogPageHandler) RenderBody(c *fiber.Ctx, supplements *router.Supplemen
 	templateMap["ParsedMarkdown"] = template.HTML(parsedMarkdown)
 	templateMap["PublishedDate"] = metadata.PublishedTime.Format("2006-01-02 15:04:05 -07:00")
 	templateMap["ActionDate"] = metadata.ActionDate
+	templateMap["ShortDescription"] = metadata.ShortDescription
 
 	go supplements.ClientCache.View(c.IP(), pathParts[2])
 
@@ -92,8 +93,6 @@ func (r *BlogPageHandler) RenderHeader(c *fiber.Ctx, supplements *router.Supplem
 	}
 
 	templateMap["Title"] = metadata.Title
-	templateMap["PublishedDate"] = metadata.PublishedTime.Format("2006-01-02 15:04:05 -07:00")
-	templateMap["ActionDate"] = metadata.ActionDate
 
 	return fiber.StatusOK, nil
 }
diff --git a/views/layouts/general-page.html b/views/layouts/general-page.html
index 5c1867a..fe6bc78 100644
--- a/views/layouts/general-page.html
+++ b/views/layouts/general-page.html
@@ -268,7 +268,7 @@
     <script src="https://f003.backblazeb2.com/file/sayana-static/libs/htmx/2.0.6/htmx.min.js"></script>
     <script src="https://f003.backblazeb2.com/file/sayana-static/libs/leaflet/1.9.4/leaflet.js"></script>
     <script src="https://f003.backblazeb2.com/file/sayana-static/libs/imagesloaded/5.0.0/imagesloaded.pkgd.min.js"></script>
-    <script src="https://f003.backblazeb2.com/file/sayana-static/libs/packery/3.0.0/dist/packery.pkgd.js"></script>
+    <script src="https://f003.backblazeb2.com/file/sayana-static/libs/packery/3.0.0/dist/packery.pkgd.min.js"></script>
 
     <script>
         // Enable fitWidth-like attribute for Packery. Source: https://codepen.io/desandro/pen/kVmLYz
@@ -277,7 +277,7 @@
             __resetLayout.call( this );
             var parentSize = getSize( this.element.parentNode );
             var colW = this.columnWidth + this.gutter;
-            this.fitWidth = Math.floor( ( ( parentSize.innerWidth + this.gutter ) / colW ) * 1.01 ) * colW;
+            this.fitWidth = Math.floor( ( parentSize.innerWidth + this.gutter ) / colW ) * colW;
             this.packer.width = this.fitWidth;
             this.packer.height = Number.POSITIVE_INFINITY;
             this.packer.reset();
diff --git a/views/pages/blog-page.html b/views/pages/blog-page.html
index 7170ad8..f95c23b 100644
--- a/views/pages/blog-page.html
+++ b/views/pages/blog-page.html
@@ -1,9 +1,15 @@
 {{ define "body" }}
 <div class="bg-background-light flex flex-col inset-shadow-[0_0_0.4rem_black] px-8 py-4 overflow-y-auto">
     <p class="max-xs:block [@media(max-height:32rem)]:block hidden font-andika text-2xl font-bold italic text-main-hard tracking-[.0125rem] mb-1">{{ .Title }}</p>
-    <p class="max-xs:block [@media(max-height:32rem)]:block hidden grow text-lg font-andika text-secondary">{{ .L.Metadata.Published }}: {{ .PublishedDate }}</p>
-    <p class="max-xs:block [@media(max-height:32rem)]:block hidden grow text-lg font-andika text-secondary">{{ .L.Metadata.Action }}: {{ .ActionDate }}</p>
-    <hr class="max-xs:block [@media(max-height:32rem)]:block hidden border-t-2 border-dotted border-main-hard mt-1 mb-2 w-full ml-auto mr-auto">
+    <p class="block grow text-lg font-andika text-secondary">
+        <b>{{ .L.Metadata.Published }}</b>: 
+        <span hx-get="/api/v1/tz" hx-vals='js:{timestamp: "{{ .PublishedDate }}", tz: clientTimeZone}' hx-target="this" hx-swap="innerHTML" hx-trigger="load">
+            {{ .PublishedDate }}
+        </span>
+    </p>
+    <p class="block grow text-lg font-andika text-secondary"><b>{{ .L.Metadata.Action }}</b>: {{ .ActionDate }}</p>
+    <p class="block grow text-md font-andika italic text-main-hard">{{ .ShortDescription }}</p>
+    <hr class="block border-t-2 border-dotted border-main-hard mt-1 mb-2 w-full ml-auto mr-auto">
     {{ .ParsedMarkdown }}
 {{- if .MapLocationX }}
     <hr class="border-t-3 border-dotted border-main-hard mt-1 mb-2 w-[80%] ml-auto mr-auto">
diff --git a/views/pages/language-pick.html b/views/pages/language-pick.html
index 5a9d229..775c18e 100644
--- a/views/pages/language-pick.html
+++ b/views/pages/language-pick.html
@@ -1,5 +1,5 @@
 {{ define "body" }}
-<div class="flex flex-col justify-center text-3xl h-[100%]">
+<div class="flex flex-col justify-center text-3xl h-full">
     {{- range .AvailableLanguages }}
     <hr class="border-t-2 border-dotted border-main-hard">
     <div class="nth-[2n+1_of_div]:bg-(--background-medium-color)/50 nth-[2n_of_div]:bg-(--background-light-color)/50 p-2.5 flex flex-row justify-center justify-items-center">
diff --git a/views/partials/general-page-header.html b/views/partials/general-page-header.html
index 90180de..83a1058 100644
--- a/views/partials/general-page-header.html
+++ b/views/partials/general-page-header.html
@@ -1,7 +1,5 @@
 <title>{{ .Title }} // SAYA TODAY</title>
-<div {{ if .PublishedDate }} hx-get="/api/v1/tz" hx-vals='js:{timestamp: "{{ .PublishedDate }}", tz: clientTimeZone}' hx-target="#published-date" hx-swap="innerHTML" hx-trigger="load" {{ end }}
-    class="flex flex-row mb-2">
+<div class="flex flex-row mb-2">
     <p class="text-4xl font-andika font-light italic text-shadow-[0_2px_2px_var(--main-soft-color)] text-left mt-auto">{{ .Title }}</p>
-    <p id="published-date" class="grow text-2xl font-andika italic text-secondary text-right mt-auto">{{ .PublishedDate }}</p>
 </div>
 {{ block "header" . }}{{ end }}
-- 
cgit v1.3.1+13