Hi I'm new to Grommet and development in general. I'm having some trouble with displaying a mobile menu.
When a screen hits a certain size the split view shows only the right side of the screen, giving you no access to the menu.
<App centered={false}>
<Split separator={true} flex='right' fixed={true} colorIndex='brand'>
<Sidebar colorIndex='brand' responsive={true}>
<Header pad='small' justify='between'>
<Title> brand </Title>
</Header>
<Box flex='grow' justify='start'>
<Menu primary={true}>
<Anchor key="home" path="/app" label="Home" />
</Menu>
</Box>
</Sidebar>
<Box>
{this.props.children}
</Box>
</Split>
</App>
From what I can tell you just need a title in a header on the right side that is set to responsive={true}. This will display your heading if your device is a mobile.
<div>
<Header pad='small' justify='between' responsive={true}>
<Title> brand </Title>
</Header>
<Cards />
</div>
This doesn't seem to work. The header displays the whole time. What I ideally want is to display the header from the sidebar.
Can anyone please help me achieve this?
