From ee88723057f94ad36c991a6fb322ecbf2d0320cc Mon Sep 17 00:00:00 2001
From: ALi Josheghani <ali.josheghani2005@gmail.com>
Date: Sat, 14 Sep 2024 22:02:52 +0330
Subject: [PATCH] Refactor: Update ProfileDetails component styles

---
 src/pages/profile/section/ProfileDetails.tsx | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/pages/profile/section/ProfileDetails.tsx b/src/pages/profile/section/ProfileDetails.tsx
index 22dc1cc..77f72bb 100644
--- a/src/pages/profile/section/ProfileDetails.tsx
+++ b/src/pages/profile/section/ProfileDetails.tsx
@@ -13,7 +13,7 @@ const ProfileDetails = ({
   error,
 }: ProfileDetailsProps) => {
   return (
-    <div className="relative z-[10] w-full h-32 max-md:h-20 flex flex-row-reverse justify-between glass items-center py-2 px-4">
+    <div className="relative z-[10] w-full min-h-32 max-md:min-h-20 flex flex-row-reverse max-[400px]:gap-3 justify-between flex-wrap-reverse glass items-center py-2 px-4">
       <EditProfile />
       <ProductDetails
         enable_config={data?.result?.enable_config}
@@ -32,7 +32,7 @@ const EditProfile = () => {
   // const [isOpen, setIsOpen] = useState(false);
   const dispatch = useDispatch();
   return (
-    <div className="w-full h-full flex justify-end items-center gap-2">
+    <div className="max-[400px]:w-full w-auto h-full flex justify-end items-center gap-2">
       {/* <ModalEditProfile isOpen={isOpen} setIsOpen={setIsOpen} /> */}
       {/* <Button
         extra="!py-4 max-md:!py-2 max-md:px-2"
@@ -41,10 +41,11 @@ const EditProfile = () => {
         <MdEdit className="scale-[1.4] max-md:scale-100" />
       </Button> */}
       <Button
-        extra="!py-4 max-md:!py-2 max-md:px-2 !bg-rose-600 !text-white"
+        extra="!py-4 max-[400px]:w-full max-md:!py-2 max-md:px-2 !bg-rose-600 flex gap-1 justify-center items-center !text-white"
         onClick={() => dispatch(setToken(""))}
       >
         <MdLogout className="scale-[1.4] max-md:scale-100" />
+        <span className="text-[11px] sm:text-xs md:text-sm lg:text-base">خروج از حساب کاربری</span>
       </Button>
     </div>
   );
@@ -64,7 +65,7 @@ const ProductDetails = ({
   error: Error | AxiosError | null;
 }) => {
   return (
-    <div className="w-full h-full flex justify-start items-center">
+    <div className="max-[400px]:w-full w-auto h-full flex max-[400px]:justify-center justify-start items-center">
       <div className="md:mr-4 w-auto h-auto flex flex-col max-md:text-[12px] text-lg md:gap-2">
         <div className="text-nowrap">
           کانفیگ های فعال :{" "}