From e9c0904bee84d11adad840d7152d2cf7e8ab0577 Mon Sep 17 00:00:00 2001 From: Calum Muir Date: Fri, 12 Jun 2026 10:37:54 +0000 Subject: [PATCH] Fix CTA cards on mobile: touch triggers :hover which overrides flex:none causing layout shift MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit On touchscreens, tapping a card fires :hover which changed flex from none to 1.3, expanding the card mid-tap and shifting subsequent cards up — so the touch-up registered on the wrong card. Fix: flex: none !important + transition: none on mobile. Co-Authored-By: Claude Sonnet 4.6 --- src/pages/index.astro | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/pages/index.astro b/src/pages/index.astro index 2f87686..50c61b5 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -118,7 +118,8 @@ const sponsors = cms?.sponsors?.length ? cms.sponsors : DEFAULTS.sponsor @media (max-width: 767px) { .cta-editorial { flex-direction: column; height: auto; overflow: visible; } - .cta-card { flex: none; height: 280px; } + .cta-card { flex: none !important; height: 280px; transition: none; } + .cta-card:hover .cta-card-img { transform: none; } .cta-sub { opacity: 1 !important; } .cta-more { opacity: 1 !important; } }