[FEATURE] Modernize Course Content Layout for Improved Readability and Navigation

[Nilamma19]

Feature Description

Modernize the course content page layout to improve readability, navigation, and overall user experience. The current interface uses a large sidebar, a vertical "CHAPTERS" section, and a content layout that does not efficiently utilize available screen space. The feature should introduce a cleaner, more structured, and responsive design while preserving existing functionality.

Problem It Solves

The current layout makes navigation and content consumption less efficient by dedicating excessive space to the sidebar and displaying chapter navigation in a visually outdated format. As a result:

• Course content appears cramped and harder to read.
• Chapter navigation is less intuitive and difficult to scan.
• Screen space is not utilized effectively.
• The interface feels inconsistent with modern educational platforms.
• User experience is negatively affected, especially on smaller screens and tablets.

Proposed Solution

• Redesign the chapter navigation sidebar with a cleaner and more compact structure.
• Replace the vertical "CHAPTERS" label with a modern horizontal section header.
• Optimize sidebar width to provide more space for course content.
• Improve spacing, alignment, and typography across the page.
• Enhance the visual hierarchy of chapter items and course content.
• Refine the placement and styling of navigation controls such as "Next" and "Save".
• Ensure the layout is fully responsive across desktop, tablet, and mobile devices.
• Maintain compatibility with the existing design system and functionality.

[Nilamma19]

Hi @pushkarscripts I would like to work on this issue under GSSoC 2026 assign me.

[Stewartsson]

Hi, I am a contributor under GSSoC'26 and would like to work on this issue. Could you please assign it to me as my system is ready to work on it