Implemented a professional loading screen for the PWA to eliminate the "hang and wait" experience during app initialization. Changes: - Added full-screen gradient loading overlay with TeleShop branding - Implemented animated triple-ring spinner with smooth animations - Added automatic removal after PWA initialization (500ms fade-out) - Included 5-second fallback timeout to prevent infinite loading - Updated service worker cache version to v2 - Enhanced JWT validation to detect test/temporary keys - Updated appsettings.json with secure JWT key Design Features: - Purple/blue gradient background matching brand colors - Pulsing logo animation for visual interest - Staggered spinner rings with cubic-bezier easing - Fade-in-out loading text animation - Mobile-responsive design (scales appropriately on all devices) Technical Implementation: - Loading screen visible by default (no FOUC) - Removed via JavaScript when PWA manager initialization completes - Graceful fade-out animation before DOM removal - Console logging for debugging 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com> |
||
|---|---|---|
| .. | ||
| blazor-integration.js | ||
| holographic-effects.js | ||
| modern-mobile.js | ||
| notifications.js | ||
| product-variants.js | ||
| pwa-fixed.js | ||
| pwa.js | ||