From b93aeeed04d40d63ecfcaacec7d1bfda1157effb Mon Sep 17 00:00:00 2001
From: Radiquum <kentai.waah@gmail.com>
Date: Sun, 24 Aug 2025 23:39:48 +0500
Subject: [PATCH] anix/style: change user card in search

---
 app/components/UserSection/UserSection.tsx | 15 +++++++--------
 1 file changed, 7 insertions(+), 8 deletions(-)

diff --git a/app/components/UserSection/UserSection.tsx b/app/components/UserSection/UserSection.tsx
index 4dc7bfe..896ebd2 100644
--- a/app/components/UserSection/UserSection.tsx
+++ b/app/components/UserSection/UserSection.tsx
@@ -12,20 +12,19 @@ export const UserSection = (props: { sectionTitle?: string; content: any }) => {
         </div>
       )}
       <div className="m-4">
-        <div className="flex flex-wrap gap-4">
+        <div className="grid grid-cols-1 gap-2 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4">
           {props.content.map((user) => {
             return (
-              <Link href={`/profile/${user.id}`} key={user.id} className="w-full max-w-[234px] h-full max-h-[234px] aspect-square flex-shrink-0">
-                <Card className="items-center justify-center w-full h-full">
-                  <Avatar img={user.avatar} alt={user.login || ""} size="lg" rounded={true} />
-                  <h5 className="mb-1 text-xl font-medium text-gray-900 dark:text-white">
-                    {user.login}
-                  </h5>
+              <Link href={`/profile/${user.id}`} key={user.id}>
+                <Card>
+                  <div className="flex items-center gap-4">
+                    <Avatar img={user.avatar} alt="" size="lg" rounded={true} />
+                    <p className="text-xl font-medium text-gray-900 dark:text-white">{user.login}</p>
+                  </div>
                 </Card>
               </Link>
             );
           })}
-          {props.content.length == 1 && <div></div>}
         </div>
       </div>
     </section>