Feature #11647
openworking on individual side mobile responsiveness
100%
Description
today i have done the mobile responsiveness for individual side screens
1. Admin Dashboard Mobile UI Redesign
- Redesigned the Admin Dashboard for mobile screens (≤ 767.98px).
- Improved the layout of metrics, cards, charts, and status indicators.
- Preserved the existing desktop layout and functionality.
2. Custom Mobile Alert Modal
- Replaced default browser alert dialogs with a responsive custom modal.
- Styled the modal to match the application's purple theme.
- Improved mobile screen alignment and added smooth transitions without changing existing business logic.
3. Individual Home Dropdown UI Enhancement
- Improved dropdown styling with better border radius, spacing, and focus states.
- Removed unwanted default icons for a cleaner appearance.
4. Add Guest Modal Mobile Optimization
- Optimized the Add Guest modal in the Individual Home and Admin Home sections.
- Improved modal alignment, padding, input widths, and country flag dropdown positioning.
- Set a maximum width of 360px for better mobile usability while preserving desktop behavior.
5. RSVP Response Data Table Enhancement
- Converted the mobile RSVP response view from stacked cards to a horizontally scrollable table.
- Matched the table layout with the desktop view.
- Added a subtle scrollbar and optimized row spacing.
6. Contacts Tab Horizontal Overflow Fix
- Fixed the horizontal screen overflow issue in the Individual Home Contacts section.
- Restricted horizontal scrolling to the table container instead of the entire mobile screen.
7. Individual Events Table Enhancement
- Converted the mobile Individual Events view from cards to a horizontally scrollable table.
- Aligned the layout with the desktop and tablet views for a consistent user experience.
8. Campaign History Mobile Header Alignment
- Aligned the Campaign History title and Refresh button side by side in a single row on mobile screens.
9. Individual Bulk Email Contacts Table Enhancement
- Updated the HTML structure by wrapping the contacts table in a responsive container.
- Added `text-nowrap` to prevent unwanted text wrapping in table cells.
- Removed legacy mobile CSS rules that converted table rows into cards.
- Implemented smooth horizontal scrolling, subtle scrollbar styling, and single-row action icons.
- Ensured that desktop and tablet layouts remain unaffected.
after that i am addended the client meeting and note down the requirements those are
1. Add sponsorship amounts: 100, 200, 500, and 1,000 for Regular, VIP, and Gold categories.
2. If a user selects sponsorship, they should be able to skip the paid registration.
3. The sponsor should receive 4 free registrations for sponsoring the event.
Subtasks
Related issues