refactor: always having square cards

src/lib/components/community/Card.svelte

@@ -46,7 +46,7 @@
 <!-- svelte-ignore a11y-click-events-have-key-events -->
 {#if is_visible}
   <div
-    class="cursor-pointer group bg-neutral-700 rounded-xl h-[400px] relative flex items-start justify-between flex-col p-5 transition-all duration-200 brightness-90 hover:brightness-100 z-[1] overflow-hidden"
+    class="cursor-pointer group bg-neutral-700 rounded-xl h-[400px] max-w-[400px] md:h-[350px] md:max-w-[350px] w-full relative flex items-start justify-between flex-col p-5 transition-all duration-200 brightness-90 hover:brightness-100 z-[1] overflow-hidden"
     on:click={handleClick}
   >
     <div class="w-full h-full absolute top-0 left-0 -z-[1] rounded-xl overflow-hidden" class:!brightness-50={loading}>

src/routes/gallery/+page.svelte

@@ -86,7 +86,7 @@
 		<Input value={form.search} placeholder="Search an image" onChange={handleChangeSearch} />
 	</div>
 	<!-- mx-auto grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-3 xl:grid-cols-4 3xl:grid-cols-5 gap-5 mt-8 lg:mt-10 -->
-	<div class="mx-auto grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 2xl:grid-cols-4 gap-5 mt-8 lg:mt-10">
+	<div class="mx-auto flex flex-wrap gap-5 mt-8 lg:mt-10 justify-center md:justify-start">
 		{#each data.cards as card}
 			<Card card={card} form={form} displayDelete={user?.is_admin} />
 		{/each}