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

@@ -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);