-
Notifications
You must be signed in to change notification settings - Fork 1.9k
Description
The vertical padding (Y-axis spacing) inside the Course Sidebar Drawer appears too tight on screens below the 2xl (1536px) breakpoint.
As a result, the content touches the bottom edge, and the last element becomes partially or completely hidden
To Reproduce
Steps to reproduce the behavior:
1.Open any course page (e.g.,https://app.100xdevs.com/courses/1). or any url having more elements in courses
2.Click the Course Content button to open the right sidebar.
3.Resize the browser window to a width below 1536px (e.g., 1440px or 1280px).
4.Scroll to the bottom of the sidebar.
5.Observe that the last module item is clipped or not fully visible.
Expected behavior
1.Consistent vertical padding (py) should be applied across all breakpoints, not just on 2xl.
2.The last element in the sidebar should be fully visible regardless of screen width.
Screenshots or GIFs
before
after
Info (please complete the following information):
Environment
Framework: Next.js
Styling: Tailwind CSS
Browser: Chrome / Edge
OS: Windows 11
Screen Width: < 1536px (before 2xl breakpoint)
Additional context
This is a UI layout issue only. The functionality of the drawer works as expected, but the user experience is affected on smaller screens due to missing vertical spacing.