From ba7ed37f671c92424a3058fb26465652fad3a131 Mon Sep 17 00:00:00 2001 From: Paul Buetow Date: Wed, 24 Jun 2026 10:04:47 +0300 Subject: Make the generated album mobile friendly Pure CSS/HTML, no JavaScript: - Add a tag to the two display heads (header.tmpl and splash.tmpl) so phones stop rendering at a zoomed-out desktop width. - Make the overview grid responsive: minmax(min(THUMBHEIGHT, 100%), 1fr) so a column never overflows a narrow screen, plus a max-width:700px media query that shows exactly two square columns on phones (2x2 feature tiles become full-width heroes). aspect-ratio keeps cells square at every width. - Add overflow-x:hidden to body so the slam/glitch entry animations (translateX +/-80vw) cannot make a phone scroll sideways. - Make the menus touch friendly on phones: the navigator/footer/splash links become large rounded buttons (~44px tap targets) and the "|" separators (now wrapped in ) are hidden on mobile while still showing on desktop. - Fix a pre-existing W3C error: the stats filter view-page image was missing an alt attribute (and carried an obsolete border attribute). Verified with headless screenshots at phone width and the W3C Nu HTML checker + CSS validator (zero errors). Co-Authored-By: Claude Opus 4.8 --- src/lib/stats-filter-album.source.sh | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) (limited to 'src') diff --git a/src/lib/stats-filter-album.source.sh b/src/lib/stats-filter-album.source.sh index eedb474..c1c1e1c 100644 --- a/src/lib/stats-filter-album.source.sh +++ b/src/lib/stats-filter-album.source.sh @@ -154,7 +154,8 @@ _stats_build_filterview_body() { fi view_page=$(album_view_page_for_photo "$photo") if [ -n "$view_page" ]; then - details_link=$(printf ' Details |' \ + details_link=$(printf \ + ' Details |' \ "$backhref_html" "$view_page") fi _stats_print_filterview_body "$backhref_html" "$photo_html" \ @@ -178,11 +179,11 @@ _stats_print_filterview_body() { cat < - + $photo_html -- cgit v1.2.3