Add max width for room and space options menu

Signed-off-by: Ajay Bura <ajbura@gmail.com>

diff --git a/src/app/molecules/room-options/RoomOptions.jsx b/src/app/molecules/room-options/RoomOptions.jsx
index 83a94827e46c0bd9cffb225488f240bbcd8ad758..734f93bd28a2dfce04cdf99a8cafacd342b95e4c 100644 (file)
--- a/src/app/molecules/room-options/RoomOptions.jsx
+++ b/src/app/molecules/room-options/RoomOptions.jsx
@@ -38,7 +38,7 @@ function RoomOptions({ roomId, afterOptionSelect }) {
   };
 
   return (
-    <>
+    <div style={{ maxWidth: '256px' }}>
       <MenuHeader>{twemojify(`Options for ${initMatrix.matrixClient.getRoom(roomId)?.name}`)}</MenuHeader>
       <MenuItem iconSrc={TickMarkIC} onClick={handleMarkAsRead}>Mark as read</MenuItem>
       <MenuItem
@@ -51,7 +51,7 @@ function RoomOptions({ roomId, afterOptionSelect }) {
       <MenuItem iconSrc={LeaveArrowIC} variant="danger" onClick={handleLeaveClick}>Leave</MenuItem>
       <MenuHeader>Notification</MenuHeader>
       <RoomNotification roomId={roomId} />
-    </>
+    </div>
   );
 }
 

diff --git a/src/app/molecules/space-options/SpaceOptions.jsx b/src/app/molecules/space-options/SpaceOptions.jsx
index cfa8012d7e65ab4208da41bbf788cec8bc19bbab..a1f0c6bb5437f73691111ae48db1200703ca5bae 100644 (file)
--- a/src/app/molecules/space-options/SpaceOptions.jsx
+++ b/src/app/molecules/space-options/SpaceOptions.jsx
@@ -44,7 +44,7 @@ function SpaceOptions({ roomId, afterOptionSelect }) {
   };
 
   return (
-    <>
+    <div style={{ maxWidth: 'calc(var(--navigation-drawer-width) - var(--sp-normal))' }}>
       <MenuHeader>{twemojify(`Options for ${initMatrix.matrixClient.getRoom(roomId)?.name}`)}</MenuHeader>
       <MenuItem
         onClick={handlePinClick}
@@ -67,7 +67,7 @@ function SpaceOptions({ roomId, afterOptionSelect }) {
       >
         Leave
       </MenuItem>
-    </>
+    </div>
   );
 }
 

diff --git a/src/app/organisms/room/RoomSettings.jsx b/src/app/organisms/room/RoomSettings.jsx
index 4c4fc2fa2e81f968b3d853d6d2ac91b5a7e9c6ea..d5e5c165c08e6ddfca8eb25db98176ba80f87b91 100644 (file)
--- a/src/app/organisms/room/RoomSettings.jsx
+++ b/src/app/organisms/room/RoomSettings.jsx
@@ -170,7 +170,7 @@ function RoomSettings({ roomId }) {
                   <span style={{ color: 'var(--tc-surface-low)' }}> — room settings</span>
                 </Text>
               </TitleWrapper>
-              <RawIcon src={ChevronTopIC} />
+              <RawIcon size="small" src={ChevronTopIC} />
             </button>
           </Header>
           <RoomProfile roomId={roomId} />