From 3c2e0f169b703bd8b1203c8f2a5cc80a68c2ad82 Mon Sep 17 00:00:00 2001
From: michaelschal <35957947-michaelschal@users.noreply.replit.com>
Date: Tue, 14 Oct 2025 07:56:18 +0000
Subject: [PATCH] Improve media grid layout for better visibility on smaller
 screens

Adjust the `NewPost` component's media grid to use a responsive column layout, defaulting to 2 columns on small screens and 3 on larger screens.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: ae4037a0-2a6f-4530-9bac-79b543286bda
Replit-Commit-Checkpoint-Type: intermediate_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/397bca8c-984f-43ff-841a-10897aeb8140/ae4037a0-2a6f-4530-9bac-79b543286bda/F3F3s9V
---
 client/src/pages/new-post.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/client/src/pages/new-post.tsx b/client/src/pages/new-post.tsx
index 37b1a31..c841d79 100644
--- a/client/src/pages/new-post.tsx
+++ b/client/src/pages/new-post.tsx
@@ -481,7 +481,7 @@ export default function NewPost() {
                           Toutes les photos
                         </div>
                         <div className="max-h-[500px] overflow-y-auto">
-                          <div className="grid grid-cols-3 gap-2">
+                          <div className="grid grid-cols-2 sm:grid-cols-3 gap-2">
                             {mediaList.slice(0, visibleMediaCount).map((media) => {
                               const isSelected = selectedMedia.includes(media.id);