Sidebar mobile view

[hdbv95]

Hey team, I'm having this weird behaviour with the sidebar on mobile.

Screen.Recording.2023-06-22.at.15.33.22.mov

I'm using this configuration at CustomizationProvider:

elements={{
        SIDEBAR: {
          height: ['auto', 'auto', `calc(100vh - ${HEIGHT}rem)`],
          overflowY: 'auto',
          position: 'sticky',
          color: 'colorText',
          backgroundColor: 'colorBackgroundDecorative10Weakest',
        },
        ANCHOR: {
          color: 'colorText',
          textDecoration: 'none',
          ':hover': {
            color: 'colorTextPrimary',
          },
        },
        BUTTON: {
          color: 'colorText',
          textDecoration: 'none',
          textTransform: 'capitalize',
          ':hover': {
            color: 'colorTextPrimary',
            textDecoration: 'none',
          },
        },
      }}

and this is the component
<Sidebar aria-label="Site sidebar" variant="compact"></Sidebar>

[SiTaggart]

Hey @hdbv95

It's going to be pretty hard for us to figure out what is going on from a video unfortunately. If you can create a minimal reproduction in Codesandbox that would be awesome.

You're also really early in using the Sidebar too, there might be additions or fixes that we're currently working on that will get released soon. It's going to be a little rough round the edges until will officially "launch it".

We'd recommend popping into Office hours and grabbing 20 minutes with us so we can riff on it with you.

[hdbv95]

Hi @SiTaggart , here's the Codesandbox url, unfortunately I couldn't reproduce the exact behaviour of the video for the porpouse to keep it short but it does kind of the same from inwards.

[SiTaggart]

OK yeah, this is actually potentially been fixed already, you're just a little bit early and we haven't merged in and released the updated package.

[hdbv95]

Ok, thanks for the info. I'm closing this discussion