Fix layout, spacing, and typography issues on EPR Policy page

[sm-28601]

Fixes #2703

Overview

This PR improves the overall layout, readability, and visual consistency of the EPR (E-Waste Recycling Policy) page.

Changes Made

• Improved typography and paragraph justification for better readability
• Fixed spacing and alignment issues across headings, paragraphs, and lists
• Standardized subheading styles for consistent design
• Enhanced bullet formatting and indentation
• Optimized container width to improve reading experience
• Refined content structure to maintain a professional policy format

Result

These changes enhance the visual hierarchy and provide a cleaner, more user-friendly reading experience.

I have also attached a short video clip demonstrating the updated UI for easier review.
If the changes look good, please feel free to merge the PR. Thank you!

vigybag.mp4

Summary by CodeRabbit

Release Notes

• Style
  • Refreshed the EPR page with an improved card-based layout and centered design for better visual presentation.
  • Enhanced readability through optimized spacing, updated typography, and a refined color scheme with green accents.
  • Adjusted margins and list formatting to improve visual hierarchy and content organization.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[vercel]

@sm-28601 is attempting to deploy a commit to the Vivek Prajapati's projects Team on Vercel.

A member of the Team first needs to authorize it.

[coderabbitai]

Caution

Review failed

An error occurred during the review process. Please try again later.

📝 Walkthrough

Walkthrough

The PR refactors the EPR page layout and styling to fix visual inconsistencies, including restructuring the container, adjusting margins and spacing, correcting list item alignment, and applying consistent color utilities and typography updates.

Changes

Cohort / File(s)	Summary
EPR Page Styling and Layout src/User/pages/EPRPage/EPR_Page.jsx	Restructured outer container with simplified white card design; updated heading colors to green-800; tightened margins (mb-4→mb-2, added mt-2); fixed list styling from list-inside to list-outside with pl-6; removed explicit line breaks; applied text-justify for paragraphs; normalized spacing with space-y-2 on list items.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Possibly related PRs

• #1582: Modifies EPR_Page component's JSX structure and styling (layout, classes, headings, lists).

Suggested labels

FrontEnd, level2, OSCI

Suggested reviewers

• codervivek5

Poem

🐰 ✨ A hop through cards so clean and bright,
Green accents dancing in the light,
Lists aligned with proper grace,
Spacing balanced—just the right place!
The EPR page now feels so right. 🌿

✨ Finishing touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[Copilot]

Pull request overview

This PR refines the EPR (E-Waste Recycling Policy) page layout to better match other policy pages and improve readability and visual consistency. The main focus is on typography, spacing, bullet alignment, and container sizing.

Changes:

• Adjusted outer and inner container spacing (top padding, bottom padding, min-height, and max width) to improve alignment with the navbar and overall page layout.
• Standardized headings and subheadings (color, font size, spacing) and added justified text for paragraphs to enhance readability and visual hierarchy.
• Reworked list styling (list position, padding, spacing, removal of in-text hyphen markers) so bullets are properly aligned within the content container and text is easier to scan.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[Copilot]

The text node on this line is indented one level deeper than the surrounding paragraph lines, which makes the JSX formatting inconsistent with the rest of the component and can be flagged by linters/formatters. Please align this line's indentation with the other paragraph text lines in this block.

Suggested change

	To deal with this ever-rising problem of E-Waste, the government of
	To deal with this ever-rising problem of E-Waste, the government of

[sm-28601]

Hi @codervivek5 , pls review my PR

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
vigybag	Ready	Preview, Comment	Feb 8, 2026 6:46pm

[github-actions]

Congratulations, Your pull request has been successfully merged 🥳🎉 Thank you for your valuable contribution to the project 🚀 Keep contributing!! ✨

📢 Don’t forget to share your VigyBag PR on LinkedIn and tag @VigyBag and me — we’d love to celebrate your achievement with you! 🔗💡