diff --git a/Status.md b/Status.md index 3b22d2db..1b7d0eb2 100644 --- a/Status.md +++ b/Status.md @@ -1,8 +1,8 @@ # HVAC Community Events - Project Status **Last Updated:** February 9, 2026 -**Current Session:** Map Tile Drift Fix & Event Cost Display -**Version:** 2.2.13 (Deployed to Production) +**Current Session:** Mobile Find Training Scroll Fix +**Version:** 2.2.14 (Deployed to Production) --- @@ -20,7 +20,44 @@ --- -## 🎯 CURRENT SESSION - MAP TILE DRIFT FIX & EVENT COST DISPLAY (Feb 9, 2026) +## 🎯 CURRENT SESSION - MOBILE FIND TRAINING SCROLL FIX (Feb 9, 2026) + +### Status: ✅ **COMPLETE - Deployed to Production (v2.2.14)** + +**Objective:** Fix mobile scrolling on the Find Training page — users could not scroll down to see the trainer, venue, and event lists. + +### Issue Found & Fixed + +1. **Mobile Page Not Scrollable** (`assets/css/find-training-map.css`) + - **Symptom:** On mobile, the Find Training page rendered correctly but users could not scroll down past the map to browse trainer/venue/event cards + - **Root Cause:** The page used a fixed-viewport layout (`height: 100vh; overflow: hidden`) with nested scrolling. On mobile, the sidebar content area was only 158px tall (out of 940px of content) — touch scrolling in such a tiny nested region was unreliable/impossible on real phones + - **Fix:** On screens ≤991px, switched from fixed-viewport to natural page scrolling: + - Page container: `height: auto; overflow: visible` (was `100vh; hidden`) + - Map layout grid: `overflow: visible`, sidebar row `auto` (was `1fr`) + - Sidebar: `overflow: visible; max-height: none` (was `hidden; 50vh`) + - Filter bar: `position: sticky` so it stays visible while scrolling + - Desktop layout (>991px) unchanged + +2. **Version Bump for Cache Busting** (`includes/class-hvac-plugin.php`) + - Bumped `HVAC_VERSION` and `HVAC_PLUGIN_VERSION` from `2.2.13` to `2.2.14` + +### Files Modified + +| File | Change | +|------|--------| +| `assets/css/find-training-map.css` | Mobile layout: natural page scrolling, sticky filter bar, removed overflow constraints | +| `includes/class-hvac-plugin.php` | Version bump `2.2.13` → `2.2.14` | + +### Verification + +- ✅ Production mobile (375x812): page scrollable, all 42 trainer cards accessible +- ✅ Production mobile: filter bar stays sticky at top while scrolling +- ✅ Production mobile: sidebar content 940px fully visible (was 158px) +- ✅ Production desktop (1400x900): side-by-side layout unchanged, no regression + +--- + +## 📋 PREVIOUS SESSION - MAP TILE DRIFT FIX & EVENT COST DISPLAY (Feb 9, 2026) ### Status: ✅ **COMPLETE - Deployed to Production (v2.2.13)** diff --git a/assets/css/find-training-map.css b/assets/css/find-training-map.css index 9b9b9fc2..a9548ea3 100644 --- a/assets/css/find-training-map.css +++ b/assets/css/find-training-map.css @@ -1229,19 +1229,48 @@ body .hvac-find-training-page { --hvac-sidebar-width: 320px; } + /* On mobile/tablet, allow natural page scrolling instead of fixed viewport */ + .hvac-find-training-page { + height: auto !important; + overflow: visible !important; + } + + /* Keep filter bar visible while scrolling */ + .hvac-filter-bar { + position: sticky; + top: 0; + z-index: 100; + } + + .admin-bar .hvac-filter-bar { + top: 46px; + } + /* Switch to stacked layout - map on top, sidebar below */ .hvac-map-layout { grid-template-areas: "map" "sidebar" !important; grid-template-columns: 1fr !important; - grid-template-rows: 55vh 1fr !important; + grid-template-rows: 55vh auto !important; + overflow: visible !important; + } + + /* Map needs explicit height since page no longer constrains it */ + .hvac-map-container { + min-height: 300px; } .hvac-sidebar { border-right: none; border-top: 1px solid var(--hvac-border); - max-height: 45vh; + overflow: visible !important; + max-height: none !important; + } + + /* Sidebar content scrolls with page, not independently */ + .hvac-sidebar-content { + overflow-y: visible !important; } /* Show sidebar toggle on tablet/mobile */ @@ -1252,7 +1281,7 @@ body .hvac-find-training-page { /* Collapsible sidebar */ .hvac-sidebar.collapsed { max-height: 80px; - overflow: hidden; + overflow: hidden !important; } .hvac-sidebar.collapsed .hvac-sidebar-content { @@ -1318,11 +1347,7 @@ body .hvac-find-training-page { @media (max-width: 767px) { .hvac-map-layout { - grid-template-rows: 50vh 1fr; - } - - .hvac-sidebar { - max-height: 50vh; + grid-template-rows: 50vh auto; } /* Filter bar adjustments */ @@ -1452,11 +1477,7 @@ body .hvac-find-training-page { @media (max-width: 480px) { .hvac-map-layout { - grid-template-rows: 45vh 1fr; - } - - .hvac-sidebar { - max-height: 55vh; + grid-template-rows: 45vh auto; } .hvac-map-legend { diff --git a/includes/class-hvac-plugin.php b/includes/class-hvac-plugin.php index dd76d590..df1d34a4 100644 --- a/includes/class-hvac-plugin.php +++ b/includes/class-hvac-plugin.php @@ -112,10 +112,10 @@ final class HVAC_Plugin { */ private function defineConstants(): void { if (!defined('HVAC_PLUGIN_VERSION')) { - define('HVAC_PLUGIN_VERSION', '2.2.13'); + define('HVAC_PLUGIN_VERSION', '2.2.14'); } if (!defined('HVAC_VERSION')) { - define('HVAC_VERSION', '2.2.13'); + define('HVAC_VERSION', '2.2.14'); } if (!defined('HVAC_PLUGIN_FILE')) { define('HVAC_PLUGIN_FILE', dirname(__DIR__) . '/hvac-community-events.php');