From 389e5db0df5c6bc121e5b2d2259de8af05549e1f Mon Sep 17 00:00:00 2001
From: SayaAndy <saya.andy@posteo.com>
Date: Fri, 17 Oct 2025 19:38:05 +0700
Subject: fix: use only "backdrop-filter" attr and rm "webkit-"

---
 static/input.css | 2 --
 1 file changed, 2 deletions(-)

diff --git a/static/input.css b/static/input.css
index a983460..301f79a 100644
--- a/static/input.css
+++ b/static/input.css
@@ -432,13 +432,11 @@ a:hover, .linklike:hover {
 .goverlay {
     background: color-mix(in srgb, var(--background-light-color) 50%, transparent) !important;
     backdrop-filter: blur(1rem);
-    -webkit-backdrop-filter: blur(1rem);
 }
 
 .glightbox-clean .gslide-description {
     background: color-mix(in srgb, var(--background-dark-color) 50%, transparent) !important;
     backdrop-filter: blur(1rem);
-    -webkit-backdrop-filter: blur(1rem);
 }
 
 .glightbox-clean .gslide-title {
-- 
cgit v1.3.1+13


From f7698d65279e68d323bea42f604ec16b78e92db4 Mon Sep 17 00:00:00 2001
From: SayaAndy <saya.andy@posteo.com>
Date: Fri, 17 Oct 2025 19:57:05 +0700
Subject: feat: tighten up paddings of glightbox

---
 static/input.css | 17 +++++++++++++----
 1 file changed, 13 insertions(+), 4 deletions(-)

diff --git a/static/input.css b/static/input.css
index 301f79a..3c715a1 100644
--- a/static/input.css
+++ b/static/input.css
@@ -10,25 +10,25 @@ html {
     font-size: 12px;
 }
 
-@media screen and (width >= 640px) {
+@media screen and (min-width: 640px) and (min-height: 640px) {
     html {
         font-size: 14px;
     }
 }
 
-@media screen and (width >= 1200px) {
+@media screen and (min-width: 900px) and (min-height: 900px) {
     html {
         font-size: 16px;
     }
 }
 
-@media screen and (width >= 1920px) {
+@media screen and (min-width: 1400px) and (min-height: 1400px) {
     html {
         font-size: 20px;
     }
 }
 
-@media screen and (width >= 2560px) {
+@media screen and (min-width: 1920px) and (min-height: 1920px) {
     html {
         font-size: 24px;
     }
@@ -443,6 +443,7 @@ a:hover, .linklike:hover {
     font-family: var(--font-spectral) !important;
     font-weight: 600 !important;
     color: var(--main-light-color) !important;
+    padding-bottom: 1rem !important;
 }
 
 .glightbox-clean .gslide-desc {
@@ -452,6 +453,14 @@ a:hover, .linklike:hover {
     color: var(--main-medium-color) !important;
 }
 
+.glightbox-mobile .glightbox-container .gslide-description {
+    padding: 0 !important;
+}
+
+.glightbox-clean .gdesc-inner {
+    padding: 1rem 1rem !important;
+}
+
 .map-container .leaflet-container {
     width: 100% !important;
     height: 100% !important;
-- 
cgit v1.3.1+13


From 17ab0302643c534efb674a326772de2224e84734 Mon Sep 17 00:00:00 2001
From: SayaAndy <saya.andy@posteo.com>
Date: Fri, 17 Oct 2025 21:31:56 +0700
Subject: feat: count content width (desktop) by window width feat: raise a bit
 width conditions for column count

---
 static/input.css                | 14 ++++++++++++--
 views/layouts/general-page.html |  2 +-
 2 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/static/input.css b/static/input.css
index 3c715a1..803b0f8 100644
--- a/static/input.css
+++ b/static/input.css
@@ -409,7 +409,7 @@ a:hover, .linklike:hover {
     }
 }
 
-@media (width >= 40rem) {
+@media (width >= 48rem) {
     .grid-item, .grid-sizer {
         width: 25%;
     }
@@ -419,7 +419,7 @@ a:hover, .linklike:hover {
     }
 }
 
-@media (width >= 48rem) {
+@media (width >= 64rem) {
     .grid-item, .grid-sizer {
         width: 20%;
     }
@@ -444,6 +444,7 @@ a:hover, .linklike:hover {
     font-weight: 600 !important;
     color: var(--main-light-color) !important;
     padding-bottom: 1rem !important;
+    margin-bottom: 0 !important;
 }
 
 .glightbox-clean .gslide-desc {
@@ -461,6 +462,15 @@ a:hover, .linklike:hover {
     padding: 1rem 1rem !important;
 }
 
+.glightbox-container .ginner-container {
+    height: 100dvh !important;
+}
+
+.gslide-description {
+    flex-grow: 0;
+    flex-shrink: 1;
+}
+
 .map-container .leaflet-container {
     width: 100% !important;
     height: 100% !important;
diff --git a/views/layouts/general-page.html b/views/layouts/general-page.html
index c320666..ce6910b 100644
--- a/views/layouts/general-page.html
+++ b/views/layouts/general-page.html
@@ -197,7 +197,7 @@
         </div>
     </div>
 
-    <div class="bg-background-dark flex z-10 w-[min(90dvw,100dvh)] grow-0 ar-lt-0.8:w-[100dvw] h-[100dvh] ar-lt-0.8:max-h-[92dvh]">
+    <div class="bg-background-dark flex z-10 ar-lt-0.8:w-[100dvw] w-[90dvw] xs:w-[85dvw] sm:w-[80dvw] md:w-[75dvw] lg:w-[70dvw] xl:w-[60dvw] 2xl:w-[50dvw] grow-0 h-[100dvh] ar-lt-0.8:max-h-[92dvh]">
         <div class="pl-[0.5dvw] bg-background-dark border-r-2 border-dashed border-main-dark"></div>
 
         <div class="max-h-100% flex flex-col grow bg-background-dark relative pt-4 ml-8 pr-4">
-- 
cgit v1.3.1+13