From 7f871c2425717253ca86dfde33746f508c816f15 Mon Sep 17 00:00:00 2001 From: Vishal Kumar Singh Date: Thu, 23 Apr 2026 15:02:04 +0530 Subject: [PATCH] fix(platforms): let the Web framework grid reflow on narrow viewports The `.frameworks` grid in the Add Web Platform wizard is pinned at `repeat(3, 1fr)` regardless of available width, so the framework cards get squeezed below their natural content size on narrow viewports (phones / split layouts), with icons, titles, and descriptions overflowing or wrapping awkwardly. Switch the track definition to `repeat(auto-fit, minmax(160px, 1fr))` so the wizard collapses to two columns and then one column as the viewport shrinks, matching how the other wizards (Flutter, etc.) already render. Desktop behaviour is preserved because the cards still flow into three 1fr tracks once the container is wide enough for three 160px cells. Fixes #2889. --- .../overview/platforms/createWeb.svelte | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/routes/(console)/project-[region]-[project]/overview/platforms/createWeb.svelte b/src/routes/(console)/project-[region]-[project]/overview/platforms/createWeb.svelte index 8227718082..afb6d0d09d 100644 --- a/src/routes/(console)/project-[region]-[project]/overview/platforms/createWeb.svelte +++ b/src/routes/(console)/project-[region]-[project]/overview/platforms/createWeb.svelte @@ -494,7 +494,7 @@ APPWRITE_ENDPOINT = "${sdk.forProject(page.params.region, page.params.project).c .frameworks { display: grid; - grid-template-columns: repeat(3, 1fr); + grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: var(--gap-l, 16px); }