bug: Logout button overflow on intermediate sized screens

[rayyan21d]

Logout button overflow while changing screen sizes from mobile to desktop The logout button is overflowing out of the navbar during an intermediate screen size. Mobile and desktop responsiveness is fine but the section between looks messy while transitioning

To Reproduce Steps to reproduce the behavior:

1. Open the current production version of the website
2. Try changing the screen window size and you'll notice this immediately

Expected behavior Either apply the overflow hidden as on mobile screens or adjust the padding on intermediate screen size in the navbar

Screenshots or GIFs

Info (please complete the following information):

• Browser: Brave
• Version 1.65.130 Chromium: 124.0.6367.159 (Official Build) (64-bit) ]

[SaiDevaHarshaR]

we can use overflow property to manage the issue, using "overflow:hidden" to hide overflow content.

[Ratangulati]

Hey, @rayyan21d are you working on this?

[rayyan21d]

Hey, @rayyan21d are you working on this?

Haven't looked into it, I have to set it up locally first

[Sidd-013]

I was able to fix the overflow issue and also the vertical alignment. result looks like this

Was able to achieve this by adding a custom breakpoint where the logout button goes below and changed the height of the button according to it.

[aryan-17]

I was able to fix the overflow issue and also the vertical alignment. result looks like this

Was able to achieve this by adding a custom breakpoint where the logout button goes below and changed the height of the button according to it.

Adding bottom margin might help.