feat: add Reviews modal popup triggered from navbar - #1158
Open
tejask011 wants to merge 1 commit into
Open
Conversation
- Add <section id='reviews'> as a modal overlay (not inline section) - Reviews modal contains: existing reviews grid + submit form (name, star rating, review text) - Clicking REVIEWS navbar/footer link opens modal instead of scrolling - Intercept #reviews in smoothScroll() identical to #reservation pattern - Add openReviewsModal / closeReviewsModal / setupReviewsModal functions - Close on: X button, backdrop click, Escape key - Auto-close modal 1.5s after successful review submission - Add full CSS for .reviews-modal matching existing reservation modal style - Fix translation key: reviews.name_label -> reviews.name (matches locale files) - Add data-i18n-placeholder for name input Fixes anushkasark08#1127
✅ Deploy Preview for theelighthouse ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
📌 Summary
Implemented the Reviews section as a modal overlay instead of an inline section, matching the existing Reservation modal experience. Users can now view and submit reviews in a dedicated modal with improved accessibility and UX.
🎯 Related Issue
Fixes #1127
🛠️ Type of Change
Bug Fix
UI / UX Improvement
📋 What Changed?
Converted the Reviews section into a modal overlay.
Added review modal open/close functionality with backdrop, close button, and Escape key support.
Intercepted
#reviewsinsmoothScroll()similar to the reservation modal.Added automatic modal close after successful review submission.
Styled the reviews modal to match the existing reservation modal.
Fixed translation key from
reviews.name_labeltoreviews.name.Added
data-i18n-placeholderfor the name input.🧪 Testing
Tested locally
Tested on Chrome
Tested responsive layouts
Verified no console errors
Existing functionality still works
📸 Screenshots
Before | After-- | --
Inline Reviews Section | Reviews displayed in a modal overlay
♿ Accessibility
Semantic HTML maintained
Keyboard navigation tested
📝 Additional Notes
The Reviews modal follows the same interaction pattern and styling as the existing Reservation modal for a consistent user experience.
✅ Checklist
I have read the project's
CONTRIBUTING.md.My branch follows the naming convention.
My commit messages follow the recommended format.
I have tested my changes.
I have linked the related issue.
This PR is focused on a single change.