From 991708db3e0bcee356bbcc8d3b39cb7723d2365b Mon Sep 17 00:00:00 2001
From: jiohjung98 <ckaquz98@naver.com>
Date: Sun, 9 Jun 2024 21:55:53 +0900
Subject: [PATCH] =?UTF-8?q?design:=20=EB=AA=A8=EB=B0=94=EC=9D=BC=EC=97=90?=
 =?UTF-8?q?=EC=84=9C=20=EC=B4=88=EB=8C=80=20=EC=9D=B4=EB=AF=B8=EC=A7=80=20?=
 =?UTF-8?q?=EC=95=88=EB=B3=B4=EC=9D=B4=EB=8A=94=20=EB=B6=80=EB=B6=84=20?=
 =?UTF-8?q?=EC=9D=B4=EB=AF=B8=EC=A7=80=20=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 public/reservation/CanInviteUser.png          | Bin 0 -> 1820 bytes
 .../meetingRoom/MeetingRoomInfo.tsx           |  34 ++++++++----------
 2 files changed, 15 insertions(+), 19 deletions(-)
 create mode 100644 public/reservation/CanInviteUser.png

diff --git a/public/reservation/CanInviteUser.png b/public/reservation/CanInviteUser.png
new file mode 100644
index 0000000000000000000000000000000000000000..4492942e69ab72e5d9afa4fe08a055af96ddd646
GIT binary patch
literal 1820
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
KMNUMnLSTXru|kjl

literal 0
HcmV?d00001

diff --git a/src/components/reservation/meetingRoom/MeetingRoomInfo.tsx b/src/components/reservation/meetingRoom/MeetingRoomInfo.tsx
index 3abb6ec..f38fb8a 100644
--- a/src/components/reservation/meetingRoom/MeetingRoomInfo.tsx
+++ b/src/components/reservation/meetingRoom/MeetingRoomInfo.tsx
@@ -313,25 +313,21 @@ const MeetingRoomInfo = () => {
                 {showSearch && (
                     <>
                     {addedMembers.length > 0 && (
-    <div className="mt-4 flex w-full overflow-x-auto">
-        <div className="flex flex-nowrap">
-            {addedMembers.map(member => (
-                <div key={member.memberId} className="flex items-center mr-2.5 flex-shrink-0">
-                    <div className='px-2.5 py-1 rounded-xl border border-zinc-400 justify-start items-center inline-flex'>
-                        <div className="text-neutral-400 text-sm font-medium font-['Pretendard'] mt-[2px] whitespace-nowrap mr-2 flex-shrink-0">
-                            {member.memberName}
+                        <div className="mt-4 flex w-full overflow-x-auto">
+                            <div className="flex flex-nowrap">
+                                {addedMembers.map(member => (
+                                    <div key={member.memberId} className="flex items-center mr-2.5 flex-shrink-0">
+                                        <div className='px-2.5 py-1 rounded-xl border border-zinc-400 justify-start items-center inline-flex'>
+                                            <div className="text-neutral-400 text-sm font-medium font-['Pretendard'] mt-[2px] whitespace-nowrap mr-2 flex-shrink-0">
+                                                {member.memberName}
+                                            </div>
+                                            <Image src={'/reservation/deleteBtn.svg'} width={10} height={10} alt="delete user" className="cursor-pointer flex-shrink-0" onClick={() => handleRemoveMember(member)} />
+                                        </div>
+                                    </div>
+                                ))}
+                            </div>
                         </div>
-                        <Image src={'/reservation/deleteBtn.svg'} width={10} height={10} alt="delete user" className="cursor-pointer flex-shrink-0" onClick={() => handleRemoveMember(member)} />
-                    </div>
-                </div>
-            ))}
-        </div>
-    </div>
-)}
-
-
-
-
+                    )}
                         <div className="relative w-full mt-[20px]">
                             <input
                                 type="text"
@@ -356,7 +352,7 @@ const MeetingRoomInfo = () => {
                                     {invitedMemberIds.includes(member.memberId) ? (
                                       <Image src="/reservation/InvitedUser.svg" width={28} height={28} alt="invited user" className="ml-auto rounded-full cursor-not-allowed" />
                                     ) : (
-                                      <Image src="/reservation/InviteUser.svg" width={28} height={28} alt="invite user" className="ml-auto rounded-full cursor-pointer" onClick={() => handleAddMember(member)} />
+                                      <Image src="/reservation/CanInviteUser.png" width={28} height={28} alt="invite user" className="ml-auto rounded-full cursor-pointer" onClick={() => handleAddMember(member)} />
                                     )}
                                   </li>
                                 ))}