diff --git a/CLAUDE.md b/CLAUDE.md index 67ab791..25171d3 100644 --- a/CLAUDE.md +++ b/CLAUDE.md @@ -779,15 +779,17 @@ For ActivityPub federated posts and thumbnails: - [x] Heart rate chart over time on activity details (Chart.js line chart, elapsed time x-axis, heart rate y-axis) - [x] Speed/pace chart over time on activity details (Chart.js line chart with smoothing, displays speed in km/h with pace in tooltip) - [x] Notifications system (Notification entity, NotificationRepository, NotificationService, NotificationController REST API, notifications.html UI, notification bell in nav with unread count, polling every 30s, mark as read/delete, all/unread filter tabs) +- [x] Custom 404 Not Found page (error/404.html with animated compass icon, suggestions, gradient background) +- [x] Custom 403 Forbidden page (error/403.html with shield-lock icon, auth-aware login button, gradient background) +- [x] Custom 500 Internal Server Error page (error/500.html with tools icon, recovery suggestions) +- [x] Generic error page (error/error.html with dynamic error code display, technical details toggle) +- [x] Empty state illustrations (reusable CSS classes in fitpub.css, floating animation, variant colors for activities/notifications/timeline/users/search, updated all timeline pages, notifications page, and discover page) - [ ] Enhanced privacy controls UI - [ ] Follow/unfollow buttons on user profiles - [ ] Activity visibility to followers (implement FOLLOWERS visibility enforcement) - [ ] Breadcrumb navigation - [ ] Active route highlighting in navigation - [ ] Global error boundary/handler -- [ ] Custom 404 Not Found page -- [ ] Custom 403 Forbidden page -- [ ] Empty state illustrations ### Phase 3: Advanced Analytics - [ ] Personal records tracking diff --git a/src/main/resources/static/css/fitpub.css b/src/main/resources/static/css/fitpub.css index 29c0792..9c33986 100644 --- a/src/main/resources/static/css/fitpub.css +++ b/src/main/resources/static/css/fitpub.css @@ -290,6 +290,68 @@ body { color: var(--danger-color); } +/* Empty State Illustrations */ +.empty-state { + text-align: center; + padding: 4rem 2rem; + color: #6b7280; +} + +.empty-state-icon { + font-size: 5rem; + color: #d1d5db; + margin-bottom: 1.5rem; + display: inline-block; + animation: float-gentle 3s ease-in-out infinite; +} + +@keyframes float-gentle { + 0%, 100% { + transform: translateY(0); + } + 50% { + transform: translateY(-10px); + } +} + +.empty-state-title { + font-size: 1.5rem; + font-weight: 600; + color: #374151; + margin-bottom: 0.5rem; +} + +.empty-state-message { + font-size: 1rem; + color: #6b7280; + margin-bottom: 1.5rem; +} + +.empty-state-action { + margin-top: 1.5rem; +} + +/* Empty state variants */ +.empty-state-activities .empty-state-icon { + color: #93c5fd; +} + +.empty-state-notifications .empty-state-icon { + color: #fbbf24; +} + +.empty-state-timeline .empty-state-icon { + color: #a78bfa; +} + +.empty-state-users .empty-state-icon { + color: #86efac; +} + +.empty-state-search .empty-state-icon { + color: #fda4af; +} + /* Responsive adjustments */ @media (max-width: 768px) { .map-container { @@ -303,4 +365,16 @@ body { .metric-value { font-size: 1.5rem; } + + .empty-state { + padding: 3rem 1rem; + } + + .empty-state-icon { + font-size: 4rem; + } + + .empty-state-title { + font-size: 1.25rem; + } } diff --git a/src/main/resources/templates/error/403.html b/src/main/resources/templates/error/403.html new file mode 100644 index 0000000..910d64f --- /dev/null +++ b/src/main/resources/templates/error/403.html @@ -0,0 +1,184 @@ + + + + + + 403 - Access Denied - FitPub + + + + + + +
+
+
+ +
+ +

403

+

Access Denied

+

+ You don't have permission to access this resource. This area is restricted. +

+ +
+
Why am I seeing this?
+
    +
  • You may need to log in to access this page
    • +
  • Your account may not have the required permissions
    • +
  • This content may be private or restricted
    • +
  • The resource owner hasn't shared it with you
    • +
+
+ +
+ + Back to Home + + +
+ +
+ + Error Code: 403 | Forbidden + +
+
+
+ + + + + + diff --git a/src/main/resources/templates/error/404.html b/src/main/resources/templates/error/404.html new file mode 100644 index 0000000..13476da --- /dev/null +++ b/src/main/resources/templates/error/404.html @@ -0,0 +1,161 @@ + + + + + + 404 - Page Not Found - FitPub + + + + + + +
+
+
+ +
+ +

404

+

Page Not Found

+

+ Oops! Looks like you've ventured off the trail. The page you're looking for doesn't exist. +

+ +
+
What can you do?
+
    +
  • Check the URL for typos
    • +
  • Go back to the previous page
    • +
  • Visit our homepage and start fresh
    • +
  • Use the navigation menu to find what you need
    • +
+
+ +
+ + Back to Home + + + Go Back + +
+ +
+ + Error Code: 404 | Not Found + +
+
+
+ + + + diff --git a/src/main/resources/templates/error/500.html b/src/main/resources/templates/error/500.html new file mode 100644 index 0000000..30d8089 --- /dev/null +++ b/src/main/resources/templates/error/500.html @@ -0,0 +1,161 @@ + + + + + + 500 - Internal Server Error - FitPub + + + + + + +
+
+
+ +
+ +

500

+

Internal Server Error

+

+ Oops! Something went wrong on our end. Our team has been notified and we're working on it. +

+ +
+
What can you do?
+
    +
  • Try refreshing the page
    • +
  • Wait a few moments and try again
    • +
  • Go back to the previous page
    • +
  • Visit our homepage
    • +
+
+ +
+ + Back to Home + + + Go Back + +
+ +
+ + Error Code: 500 | Internal Server Error + +
+
+
+ + + + diff --git a/src/main/resources/templates/error/error.html b/src/main/resources/templates/error/error.html new file mode 100644 index 0000000..9cd767b --- /dev/null +++ b/src/main/resources/templates/error/error.html @@ -0,0 +1,129 @@ + + + + + + Error - FitPub + + + + + + +
+
+
+ +
+ +

500

+

Something Went Wrong

+

+ We encountered an unexpected error while processing your request. + +

+ +
+ + Back to Home + + + Go Back + +
+ +
+ + Error Code: 500 + + | timestamp + + +
+ +
+
+ Show Technical Details + 

+                

+            

+        

+    

+
+    
+
+
diff --git a/src/main/resources/templates/notifications.html b/src/main/resources/templates/notifications.html
index 3c983fc..e66cc5f 100644
--- a/src/main/resources/templates/notifications.html
+++ b/src/main/resources/templates/notifications.html
@@ -1,12 +1,10 @@
 
-
+
 
-    
-    
     Notifications - FitPub
-    
-    
-    
     
 
 
-    

-
-    

+    

+        

         

             

                 

@@ -249,10 +236,12 @@
 
                 if (data.content.length === 0) {
                     container.innerHTML = `
-                        

-                            
-                            
No notifications

-                            
You're all caught up!

+                        

+                            

+                                
+                            

+                            
No notifications

+                            
You're all caught up! Check back later for updates.

                         

                     `;
                     return;
diff --git a/src/main/resources/templates/timeline/federated.html b/src/main/resources/templates/timeline/federated.html
index fb5244b..5c6b9f3 100644
--- a/src/main/resources/templates/timeline/federated.html
+++ b/src/main/resources/templates/timeline/federated.html
@@ -54,13 +54,20 @@
                 

 
                 
-                

-                    
-                    
No Activities Yet

-                    
Follow other athletes to see their activities here!

-                    
-                         Explore Public Timeline
-                    
+                

+                    

+                        
+                    

+                    
No Activities Yet

+                    
Follow other athletes to see their activities here!

+                    

+                        
+                             Discover Athletes
+                        
+                        
+                             Public Timeline
+                        
+                    

                 

 
                 
diff --git a/src/main/resources/templates/timeline/public.html b/src/main/resources/templates/timeline/public.html
index 0c5a06d..8b9d10e 100644
--- a/src/main/resources/templates/timeline/public.html
+++ b/src/main/resources/templates/timeline/public.html
@@ -54,13 +54,17 @@
                 

 
                 
-                

-                    
-                    
No Activities Yet

-                    
Be the first to share your fitness activities!

-                    
+                

+                    

+                        
+                    

+                    
No Activities Yet

+                    
Be the first to share your fitness activities with the community!

+                    

+                        
+                    

                 

 
                 
diff --git a/src/main/resources/templates/timeline/user.html b/src/main/resources/templates/timeline/user.html
index 6459f57..372db89 100644
--- a/src/main/resources/templates/timeline/user.html
+++ b/src/main/resources/templates/timeline/user.html
@@ -54,13 +54,17 @@
                 

 
                 
-                

-                    
-                    
No Activities Yet

-                    
Upload your first FIT file to get started!

-                    
-                         Upload Activity
-                    
+                

+                    

+                        
+                    

+                    
No Activities Yet

+                    
Upload your first FIT file to start tracking your fitness journey!

+                    

+                        
+                             Upload Activity
+                        
+                    

                 

 
                 
diff --git a/src/main/resources/templates/users/discover.html b/src/main/resources/templates/users/discover.html
index ca875e7..25a516c 100644
--- a/src/main/resources/templates/users/discover.html
+++ b/src/main/resources/templates/users/discover.html
@@ -86,10 +86,12 @@
             

 
             
-            

-                
-                
No users found

-                
Try adjusting your search or browse all users

+            

+                

+                    
+                

+                
No Users Found

+                
Try adjusting your search or browse all users in the community