react.dev icon indicating copy to clipboard operation
react.dev copied to clipboard

BUG - Hidden "FAQ" menu items in sidebar on desktop screen

Open JrDevHarsh opened this issue 2 years ago • 1 comments
trafficstars

Issue

Hi, I have noticed an issue with the sidebar section on the desktop screen. The FAQ menu contains two items(Versioning Policy and Virtual DOM and Internals) that are hidden or not shown properly scroll down to the bottom.

Steps To Reproduce

Although there may be different approaches to fix this issue I have found one of them mentioned below. Link of the following code to update.

  • from
    [media.greaterThan('small')]: {
                  position: 'fixed',
                  zIndex: 2,
                  // previous code
                  // height: 'calc(100vh - 60px)',
                  // updated code
                  height: calc(100vh - 110px);
                  overflowY: 'auto',
                  WebkitOverflowScrolling: 'touch',
                  marginRight: -999,
                  paddingRight: 999,
                  backgroundColor: '#f7f7f7',
                  opacity: '1 !important',
                },
    
                [media.size('small')]: {
                 // previous code
                  // height: 'calc(100vh - 40px)',
                  // updated code
                  height: calc(100vh - 110px);
                },
    
                [media.between('medium', 'large')]: {
                 // previous code
                  // height: 'calc(100vh - 50px)',
                  // updated code
                  height: calc(100vh - 110px);
                },
    

The current behavior

react_sidebar

The expected behavior

react_sidebar_e

JrDevHarsh avatar Feb 10 '23 09:02 JrDevHarsh

Hey I just submitted a PR for this. I'm new to open source, what is the procedure to get this reviewed?

mkotik avatar Feb 15 '23 15:02 mkotik