docs: add comprehensive UI/UX enhancement requirements for event creation form
- Added responsive field grouping requirements (same row -> columns) - Rich text editor specifications for event description - Featured image upload with preview/replace capabilities - Virtual event toggle functionality - Enhanced toggle controls for RSVP/Ticketing sections - Advanced multi-select components for organizer/categories - Single-select searchable venue field - Modal popup forms for creating new entities - Fixed missing form field labels documentation - Implementation priority and technical considerations 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
parent
c0175f51e3
commit
7010b8a30e
1 changed files with 95 additions and 1 deletions
|
|
@ -336,5 +336,99 @@ class HVAC_TEC_Tickets {
|
||||||
4. Form maintains existing functionality while adding new features
|
4. Form maintains existing functionality while adding new features
|
||||||
5. Integration works seamlessly with existing TEC Community Events
|
5. Integration works seamlessly with existing TEC Community Events
|
||||||
|
|
||||||
|
## Additional UI/UX Enhancement Requirements (September 2025)
|
||||||
|
|
||||||
|
### Form Layout Improvements
|
||||||
|
|
||||||
|
#### Field Grouping and Responsive Design
|
||||||
|
- **Same Row Fields (Desktop) → Column Layout (Mobile):**
|
||||||
|
- Ticket Price ($) & Ticket Capacity
|
||||||
|
- Ticket Sales Start & Ticket Sales End
|
||||||
|
- Start Date & Time & End Date & Time
|
||||||
|
|
||||||
|
#### Text Editor Enhancement
|
||||||
|
- **Event Description Field:**
|
||||||
|
- Increase size to 3x current dimensions
|
||||||
|
- Add rich text editing toolbar (bold, italic, lists, links)
|
||||||
|
- Support for formatted text input
|
||||||
|
|
||||||
|
#### Form Field Issues
|
||||||
|
- **Missing Label Issues:** Fix blank/unlabeled form sections:
|
||||||
|
- Blank box above "Enable Ticketing"
|
||||||
|
- Blank box above "Ticket Name"
|
||||||
|
- Two blank boxes above "Start Date & Time"
|
||||||
|
|
||||||
|
### New Feature Requirements
|
||||||
|
|
||||||
|
#### Featured Image Upload
|
||||||
|
- **Image Upload Component:**
|
||||||
|
- File upload interface with drag-and-drop
|
||||||
|
- Image preview functionality
|
||||||
|
- Replace/remove image capabilities
|
||||||
|
- Proper image optimization and sizing
|
||||||
|
|
||||||
|
#### Virtual Event Capability
|
||||||
|
- **Virtual Event Toggle:**
|
||||||
|
- Enable/disable virtual event mode
|
||||||
|
- When enabled, show virtual event specific fields
|
||||||
|
- Integration with existing venue system
|
||||||
|
|
||||||
|
#### Enhanced Toggle Controls
|
||||||
|
- **Interactive Toggles (show/hide subsections):**
|
||||||
|
- Virtual Event toggle → Virtual event configuration fields
|
||||||
|
- Enable RSVP toggle → RSVP configuration options
|
||||||
|
- Enable Ticketing toggle → Ticketing subsection fields
|
||||||
|
|
||||||
|
#### Advanced Selection Components
|
||||||
|
|
||||||
|
##### Multi-Select with Dynamic Search
|
||||||
|
- **Organizer Field:**
|
||||||
|
- Text input with autocomplete
|
||||||
|
- Dynamic dropdown showing all available options on focus
|
||||||
|
- Multi-select capability (up to 3 items)
|
||||||
|
- "Create New Organizer" option → Modal popup with organizer creation form
|
||||||
|
|
||||||
|
- **Categories Field (New):**
|
||||||
|
- Same functionality as Organizer field
|
||||||
|
- Text input with autocomplete search
|
||||||
|
- Multi-select up to 3 categories
|
||||||
|
- "Create New Category" option → Modal popup for category creation
|
||||||
|
|
||||||
|
##### Single-Select with Search
|
||||||
|
- **Venue Field Enhancement:**
|
||||||
|
- Convert to searchable single-select
|
||||||
|
- Text input with autocomplete
|
||||||
|
- Dynamic dropdown on focus
|
||||||
|
- Single selection only
|
||||||
|
- "Create New Venue" option → Modal popup with venue creation form
|
||||||
|
|
||||||
|
#### Modal Creation Forms
|
||||||
|
- **New Organizer Modal:**
|
||||||
|
- Name, email, phone, organization fields
|
||||||
|
- Save and apply to event functionality
|
||||||
|
|
||||||
|
- **New Category Modal:**
|
||||||
|
- Category name, description, parent category
|
||||||
|
- Save and apply to event functionality
|
||||||
|
|
||||||
|
- **New Venue Modal:**
|
||||||
|
- Venue name, address, capacity, facilities
|
||||||
|
- Save and apply to event functionality
|
||||||
|
|
||||||
|
### Implementation Priority
|
||||||
|
1. **Phase 1:** Fix existing form issues (missing labels, layout)
|
||||||
|
2. **Phase 2:** Implement responsive field grouping
|
||||||
|
3. **Phase 3:** Add rich text editor and featured image upload
|
||||||
|
4. **Phase 4:** Implement toggle controls and virtual event features
|
||||||
|
5. **Phase 5:** Create advanced selection components and modal forms
|
||||||
|
|
||||||
|
### Technical Considerations
|
||||||
|
- Maintain existing security measures and validation
|
||||||
|
- Ensure mobile responsiveness across all new components
|
||||||
|
- Integrate seamlessly with current TEC ticketing system
|
||||||
|
- Preserve existing template and autosave functionality
|
||||||
|
- Follow WordPress coding standards and accessibility guidelines
|
||||||
|
|
||||||
---
|
---
|
||||||
*Implementation plan generated during TEC integration and template system improvement project*
|
*Implementation plan generated during TEC integration and template system improvement project*
|
||||||
|
*Updated September 2025 with comprehensive UI/UX enhancement requirements*
|
||||||
Loading…
Reference in a new issue