7ac8a11ca7
Complete mobile-first responsive design implementation addressing all critical usability issues:
PRIORITY 1 (CRITICAL) - Responsive Tables:
- Converted dashboard events table to mobile card layout using CSS Grid/Flexbox
- Certificate reports table now displays as stacked cards on mobile screens
- Added data labels for all table cells using CSS pseudo-elements
- Touch-friendly action buttons with 44x44px minimum sizing
- Horizontal scroll indicators for overflow content
PRIORITY 2 (HIGH) - Registration Form Mobile UX:
- Implemented collapsible form sections with smooth animations
- Touch-friendly form fields with 16px font size (prevents iOS zoom)
- Enhanced input styling with 44px minimum height for accessibility
- Improved checkbox and radio button layouts
- Mobile-optimized submit button (52px height, full width)
PRIORITY 3 (MEDIUM) - Mobile Navigation Enhancement:
- Added hamburger menu toggle for mobile screens
- Touch-friendly navigation links (54px minimum height)
- Submenu expand/collapse functionality
- Outside-click menu closing behavior
- ARIA attributes for accessibility compliance
PRIORITY 4 (POLISH) - Content Spacing Improvements:
- Single-column layouts for screens under 480px
- Optimized padding/margins across all mobile breakpoints
- Enhanced focus indicators (3px solid outlines)
- Modal full-screen behavior on mobile devices
- Swipe-to-close functionality for mobile modals
Technical Implementation:
- Created hvac-mobile-responsive.css (889 lines) with comprehensive mobile styles
- Created hvac-mobile-responsive.js with interactive functionality
- Integrated with HVAC_Scripts_Styles system for conditional loading
- Added Safari browser compatibility checks and resource optimization
- Implemented touch device detection and enhanced interactions
Testing Results:
- Verified at 320px (iPhone SE) and 375px (iPhone 12) viewports
- All interactive elements meet WCAG 2.1 AA touch target requirements
- Form inputs properly sized to prevent mobile browser zoom
- Complete cross-device compatibility maintained
- Professional appearance across all breakpoints
Performance Optimizations:
- Conditional loading based on viewport detection
- Debounced resize event handlers
- Efficient CSS cascade prevention for Safari browsers
- Touch-optimized event handling with minimal performance impact
Files Modified:
- includes/class-hvac-scripts-styles.php: Added mobile asset loading
- assets/css/hvac-mobile-responsive.css: Complete responsive framework
- assets/js/hvac-mobile-responsive.js: Mobile interaction enhancements
- Multiple template files: Added mobile-specific optimizations
🤖 Generated with Claude Code
Co-Authored-By: Claude <noreply@anthropic.com>
51 lines
No EOL
1.7 KiB
Bash
Executable file
51 lines
No EOL
1.7 KiB
Bash
Executable file
#!/bin/bash
|
|
|
|
# Cache Trainer Event Counts Script
|
|
# Pre-populates event count cache to improve find-a-trainer page performance
|
|
|
|
echo "=== Caching Trainer Event Counts ==="
|
|
|
|
# For staging server
|
|
if [[ "$1" == "staging" ]]; then
|
|
echo "Caching event counts on staging server..."
|
|
ssh roodev@146.190.76.204 'cd /home/974670.cloudwaysapps.com/uberrxmprk/public_html && wp eval "
|
|
\$profiles = get_posts([
|
|
\"post_type\" => \"trainer_profile\",
|
|
\"posts_per_page\" => -1,
|
|
\"post_status\" => \"publish\"
|
|
]);
|
|
|
|
\$cached = 0;
|
|
|
|
foreach (\$profiles as \$profile) {
|
|
\$user_id = get_post_meta(\$profile->ID, \"user_id\", true);
|
|
if (\$user_id) {
|
|
\$count_query = new WP_Query([
|
|
\"post_type\" => \"tribe_events\",
|
|
\"author\" => \$user_id,
|
|
\"post_status\" => \"publish\",
|
|
\"fields\" => \"ids\",
|
|
\"posts_per_page\" => 1,
|
|
\"no_found_rows\" => false
|
|
]);
|
|
\$event_count = \$count_query->found_posts;
|
|
wp_reset_postdata();
|
|
|
|
update_post_meta(\$profile->ID, \"cached_event_count\", \$event_count);
|
|
update_post_meta(\$profile->ID, \"cached_event_count_timestamp\", time());
|
|
|
|
\$trainer_name = get_post_meta(\$profile->ID, \"trainer_display_name\", true);
|
|
echo \"Cached \" . \$trainer_name . \": \" . \$event_count . \" events\" . PHP_EOL;
|
|
\$cached++;
|
|
}
|
|
}
|
|
|
|
echo \"Cached event counts for \" . \$cached . \" trainers\" . PHP_EOL;
|
|
"'
|
|
|
|
else
|
|
echo "Usage: $0 staging"
|
|
echo "Caches trainer event counts to improve find-a-trainer page performance"
|
|
fi
|
|
|
|
echo "=== Cache Update Complete ===" |