Make ShareNav full width on mobile
Some checks are pending
Node.js CI / build (push) Waiting to run

- Remove fixed width, position, and border on mobile
- Use 100% width when onItemClick is provided (mobile context)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Mike Cao 2026-01-29 00:44:18 -08:00
parent b43e7fd3a7
commit 489c2712d1
2 changed files with 8 additions and 6 deletions

View file

@ -137,15 +137,17 @@ export function ShareNav({
.flatMap(e => e.items) .flatMap(e => e.items)
.find(({ path }) => path && pathname.endsWith(path.split('?')[0]))?.id; .find(({ path }) => path && pathname.endsWith(path.split('?')[0]))?.id;
const isMobile = !!onItemClick;
return ( return (
<Column <Column
position="fixed" position={isMobile ? undefined : 'fixed'}
padding="3" padding="3"
width={collapsed ? '60px' : '240px'} width={isMobile ? '100%' : collapsed ? '60px' : '240px'}
maxHeight="100vh" maxHeight="100vh"
height="100vh" height="100vh"
border="right" border={isMobile ? undefined : 'right'}
borderColor="4" borderColor={isMobile ? undefined : '4'}
> >
<Row as="header" gap alignItems="center" paddingY="3" justifyContent="space-between"> <Row as="header" gap alignItems="center" paddingY="3" justifyContent="space-between">
{!collapsed && ( {!collapsed && (

View file

@ -9,8 +9,8 @@ export function MobileMenuButton(props: DialogProps) {
<Menu /> <Menu />
</Icon> </Icon>
</Button> </Button>
<Modal placement="left" offset="80px"> <Modal placement="left">
<Dialog variant="sheet" {...props} /> <Dialog variant="sheet" {...props} style={{ width: 'auto' }} />
</Modal> </Modal>
</DialogTrigger> </DialogTrigger>
); );