From 747e0007e0f1fe5cae9d9645d8b9c334f3698645 Mon Sep 17 00:00:00 2001 From: yyamashita Date: Thu, 7 May 2026 22:51:40 +0900 Subject: Fix mobile layout for iPhone-sized viewports - Stack header vertically on mobile (flex-col sm:flex-row) to prevent logo+nav overflow - Hide venue and price columns in list/row views on mobile to give title room - Shrink date/time columns on mobile (w-24 sm:w-32, w-20 sm:w-28) - Make keyword filter input full-width on mobile (w-full sm:w-52) Co-Authored-By: Claude Sonnet 4.6 --- app/components/FilterBar.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'app/components/FilterBar.tsx') diff --git a/app/components/FilterBar.tsx b/app/components/FilterBar.tsx index 266865d..fd7be72 100644 --- a/app/components/FilterBar.tsx +++ b/app/components/FilterBar.tsx @@ -20,7 +20,7 @@ export default function FilterBar({ venues, defaultDateFrom, defaultDateTo }: Pr type="text" defaultValue={searchParams.get("keyword") ?? ""} placeholder="アーティスト名、イベント名..." - className="rounded-md bg-gray-800 border border-gray-700 px-3 py-1.5 text-sm focus:outline-none focus:ring-1 focus:ring-indigo-500 w-52" + className="rounded-md bg-gray-800 border border-gray-700 px-3 py-1.5 text-sm focus:outline-none focus:ring-1 focus:ring-indigo-500 w-full sm:w-52" /> -- cgit v1.2.3