Skip to content

Enhance Feedback Form UI with Card Layout and Reduced Spacing#875

Open
Aarya-Chaudhari wants to merge 3 commits intosayeeg-11:mainfrom
Aarya-Chaudhari:feedback-card
Open

Enhance Feedback Form UI with Card Layout and Reduced Spacing#875
Aarya-Chaudhari wants to merge 3 commits intosayeeg-11:mainfrom
Aarya-Chaudhari:feedback-card

Conversation

@Aarya-Chaudhari
Copy link
Contributor

📋 Description

This PR improves the Feedback page UI by wrapping the form inside a dedicated card container and fixing excessive spacing between the header and the form. Previously, the feedback form appeared visually disconnected due to large padding and default margins, creating an empty grey gap and a flat layout.
The update introduces a modern card-style design with hover effects, improved focus states, and optimized spacing for a cleaner and more consistent user experience aligned with the site’s design system.

Wrapped feedback form inside a styled card container (.feedback-card)
Reduced excessive bottom padding in .feedback-header to remove large visual gap
Removed default body margin causing unwanted grey space
Adjusted .feedback-container margin and padding for tighter layout
Added subtle hover elevation and shadow for better UI depth
Improved input focus styling for better accessibility and interaction feedback

📸 Screenshots (MANDATORY for UI/UX changes)

Screenshot 2026-02-18 194859
  • This PR includes UI/UX changes → Screenshots attached
  • This PR does NOT include UI/UX changes

Closes #858

@Aarya-Chaudhari
Copy link
Contributor Author

Hello @sayeeg-11
I have raised a PR resolving issue #858 and ahve also resolved merge conflicts.
Please review and let me know if any changes needed

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

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Feature]: Enhance Feedback Form UI with Card Layout and Hover Effects

1 participant

Comments