Fix menus congestion and improve thread reply layout (#2402)

* make menus more spacious

* improve threaded reply layout

* fix search filter button spacing
This commit is contained in:
Ajay Bura 2025-07-27 17:50:23 +05:30 committed by GitHub
parent 9183fd66b2
commit d8d4714370
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
37 changed files with 82 additions and 83 deletions

View file

@ -234,9 +234,9 @@ export function HierarchyItemMenu({
escapeDeactivates: stopPropagation,
}}
>
<Menu style={{ maxWidth: toRem(150), width: '100vw' }}>
<Menu style={{ minWidth: toRem(200) }}>
{joined && (
<Box direction="Column" gap="100" style={{ padding: config.space.S100 }}>
<Box direction="Column" gap="100" style={{ padding: config.space.S200 }}>
{onTogglePin && (
<MenuItem
size="300"
@ -296,7 +296,7 @@ export function HierarchyItemMenu({
<Line size="300" variant="Surface" direction="Horizontal" />
)}
{canEditChild && (
<Box direction="Column" gap="100" style={{ padding: config.space.S100 }}>
<Box direction="Column" gap="100" style={{ padding: config.space.S200 }}>
<SuggestMenuItem item={item} requestClose={handleRequestClose} />
<RemoveMenuItem item={item} requestClose={handleRequestClose} />
</Box>

View file

@ -60,8 +60,8 @@ const LobbyMenu = forwardRef<HTMLDivElement, LobbyMenuProps>(
};
return (
<Menu ref={ref} style={{ maxWidth: toRem(160), width: '100vw' }}>
<Box direction="Column" gap="100" style={{ padding: config.space.S100 }}>
<Menu ref={ref} style={{ minWidth: toRem(200) }}>
<Box direction="Column" gap="100" style={{ padding: config.space.S200 }}>
<MenuItem
onClick={handleInvite}
variant="Primary"
@ -87,7 +87,7 @@ const LobbyMenu = forwardRef<HTMLDivElement, LobbyMenuProps>(
</MenuItem>
</Box>
<Line variant="Surface" size="300" />
<Box direction="Column" gap="100" style={{ padding: config.space.S100 }}>
<Box direction="Column" gap="100" style={{ padding: config.space.S200 }}>
<UseStateProvider initial={false}>
{(promptLeave, setPromptLeave) => (
<>

View file

@ -271,7 +271,7 @@ function AddRoomButton({ item }: { item: HierarchyItem }) {
escapeDeactivates: stopPropagation,
}}
>
<Menu style={{ padding: config.space.S100 }}>
<Menu style={{ padding: config.space.S200 }}>
<MenuItem
size="300"
radii="300"
@ -333,7 +333,7 @@ function AddSpaceButton({ item }: { item: HierarchyItem }) {
escapeDeactivates: stopPropagation,
}}
>
<Menu style={{ padding: config.space.S100 }}>
<Menu style={{ padding: config.space.S200 }}>
<MenuItem
size="300"
radii="300"