Skip to content

fix(dashboard): resolve scrollbar, header, footer, and theme toggle UI inconsistencies#1702

Merged
omroy07 merged 2 commits intoomroy07:mainfrom
nur-hasin:fix/dashboard-ui-scrollbar-header-footer
Mar 7, 2026
Merged

fix(dashboard): resolve scrollbar, header, footer, and theme toggle UI inconsistencies#1702
omroy07 merged 2 commits intoomroy07:mainfrom
nur-hasin:fix/dashboard-ui-scrollbar-header-footer

Conversation

@nur-hasin
Copy link
Copy Markdown
Contributor

Which issue does this PR close?

Rationale for this change

Multiple dashboard pages (Organic, Disease, Weather, Shopkeeper, Plantation, Crop Price Tracker, Yield Prediction, and Schemes) had inconsistent UI compared to the main pages. These issues affected the visual polish and usability of the dashboard, including broken scrollbar styling, navbar bottom border artifacts, incomplete footers, clipped page headings, duplicate scroll-to-top buttons, missing theme toggler, and a narrower header layout on certain pages.

What changes are included in this PR?

  • Custom Scrollbar: Replaced .sidebar-scoped scrollbar with a global html-level custom scrollbar on Schemes, Yield Prediction, Weather, and Disease pages. Also resolved undefined CSS variables (--bg-tertiary, --text-muted) that were preventing the scrollbar from rendering correctly.
  • Navbar Bottom Border: Removed the unnecessary empty horizontal bar appearing directly below the header navbar on Organic, Shopkeeper, and Plantation pages.
  • Footer: Updated the footer on Yield Prediction, Plantation, and Crop Price Tracker pages to include navigation links, social links, branding, and copyright - matching the footer structure of the main pages.
  • Page Heading Clip: Added sufficient padding-top to the Organic page main content so the Organic Farming Excellence heading is no longer clipped behind the fixed navbar.
  • Duplicate Scroll-to-Top Button: Removed the duplicate scroll-to-top button on the Plantation page, keeping only one consistently positioned in the bottom-right corner.
  • Theme Toggler: Added the missing theme toggle button to the Yield Prediction page, matching the placement and behavior on all other pages.
  • Header Layout: Updated the Yield Prediction page header to use the full-width AgriTech navbar with logo and navigation links, replacing the narrower standalone header.

Are these changes tested?

  • Manually tested all 8 affected dashboard pages in both light and dark modes across Chrome and Edge browsers.
  • Verified scrollbar rendering on Schemes, Yield Prediction, Weather, and Disease pages.
  • Confirmed no duplicate scroll-to-top buttons remain on the Plantation page.
  • Confirmed theme toggle works correctly on the Yield Prediction page after fix.
  • Confirmed footer displays complete information on all fixed pages.
  • No automated tests are included as these are purely visual/CSS and HTML structural fixes.

Are there any user-facing changes?

Yes. The following user-facing improvements are included:

  • A consistent custom styled scrollbar is now visible across all dashboard pages.
  • The navbar no longer shows an unwanted bottom border gap on affected pages.
  • Footers on all dashboard pages now display complete navigation links, social links, and branding.
  • Page headings are fully visible and no longer hidden behind the fixed navbar.
  • Only one scroll-to-top button appears per page.
  • The theme toggle is available and functional on all dashboard pages.
  • All dashboard pages now use a consistent full-width header matching the main pages.

Screenshots

Screenshot 2026-03-06 162505 Screenshot 2026-03-06 174203 Screenshot 2026-03-06 162529 Screenshot 2026-03-06 162757 Screenshot 2026-03-06 163533 Screenshot 2026-03-06 163914 Screenshot 2026-03-06 164916 Screenshot 2026-03-06 180648

@vercel
Copy link
Copy Markdown

vercel bot commented Mar 6, 2026

@nur-hasin is attempting to deploy a commit to the Om Roy's projects Team on Vercel.

A member of the Team first needs to authorize it.

@github-actions
Copy link
Copy Markdown

github-actions bot commented Mar 6, 2026

Thanks for creating a PR for your Issue! ☺️

We'll review it as soon as possible.
In the meantime, please double-check the file changes and ensure that all commits are accurate.

If there are any unresolved review comments, feel free to resolve them. 🙌🏼

@nur-hasin
Copy link
Copy Markdown
Contributor Author

Hi @omroy07, kindly review and merge if approved. Let me know if any changes are required. Also, add the ECWoC26 SPRINT label to this PR - it's necessary for points to be added. Thank you!

@omroy07 omroy07 merged commit c0cc771 into omroy07:main Mar 7, 2026
0 of 3 checks passed
@github-actions
Copy link
Copy Markdown

github-actions bot commented Mar 7, 2026

🎉 Congrats @nur-hasin on getting your PR merged! 🙌
Thanks for the contribution — looking forward to more from you 🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Bug]: Dashboard Pages - Scrollbar, Header, Footer, and Navigation Inconsistencies

2 participants