From 6d277cd1d8220e3738fe8fcc4884b5aeacbcc1d5 Mon Sep 17 00:00:00 2001
From: Zamitto <167933696+zamitto@users.noreply.github.com>
Date: Tue, 16 Jul 2024 22:07:17 -0300
Subject: [PATCH] feat: adjust ui

---
 .../shared-modals/user-friend-modal/user-friend-modal.css.ts  | 2 +-
 src/renderer/src/pages/user/user-content.tsx                  | 4 ++--
 src/renderer/src/pages/user/user.css.ts                       | 4 ++++
 3 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/renderer/src/pages/shared-modals/user-friend-modal/user-friend-modal.css.ts b/src/renderer/src/pages/shared-modals/user-friend-modal/user-friend-modal.css.ts
index b5b29963..0d6e8643 100644
--- a/src/renderer/src/pages/shared-modals/user-friend-modal/user-friend-modal.css.ts
+++ b/src/renderer/src/pages/shared-modals/user-friend-modal/user-friend-modal.css.ts
@@ -61,7 +61,7 @@ export const friendListButton = style({
   flexDirection: "row",
   color: vars.color.body,
   gap: `${SPACING_UNIT + SPACING_UNIT / 2}px`,
-  padding: "0 8px",
+  padding: `0 ${SPACING_UNIT}px`,
 });
 
 export const friendRequestItem = style({
diff --git a/src/renderer/src/pages/user/user-content.tsx b/src/renderer/src/pages/user/user-content.tsx
index e560a50b..69ab27c3 100644
--- a/src/renderer/src/pages/user/user-content.tsx
+++ b/src/renderer/src/pages/user/user-content.tsx
@@ -362,8 +362,8 @@ export function UserContent({
                     <button
                       key={friend.id}
                       className={cn(
-                        styles.friendListContainer,
-                        styles.profileContentBox
+                        styles.profileContentBox,
+                        styles.friendListContainer
                       )}
                       onClick={() => handleOnClickFriend(friend.id)}
                     >
diff --git a/src/renderer/src/pages/user/user.css.ts b/src/renderer/src/pages/user/user.css.ts
index 34e7b670..fb0aee21 100644
--- a/src/renderer/src/pages/user/user.css.ts
+++ b/src/renderer/src/pages/user/user.css.ts
@@ -11,6 +11,7 @@ export const wrapper = style({
 
 export const profileContentBox = style({
   display: "flex",
+  cursor: "pointer",
   gap: `${SPACING_UNIT * 3}px`,
   alignItems: "center",
   borderRadius: "4px",
@@ -192,8 +193,11 @@ export const gameListItem = style({
 });
 
 export const friendListContainer = style({
+  color: vars.color.body,
   width: "100%",
   height: "54px",
+  padding: `0 ${SPACING_UNIT}px`,
+  gap: `${SPACING_UNIT + SPACING_UNIT / 2}px`,
   transition: "all ease 0.2s",
   position: "relative",
   ":hover": {