UI improvements: bordered feedback, centered titles, cloud animation, Tesla margins

weather_icons.py

@@ -54,31 +54,31 @@ def _draw_cloud_shape(canvas, x, y, color):
         graphics.DrawCircle(canvas, x + 12, y + 7, r, color)
 
 
-def draw_partly_cloudy(canvas, x, y):
-    """Draw sun partially covered by cloud."""
+def draw_partly_cloudy(canvas, x, y, cloud_offset=0):
+    """Draw sun partially covered by cloud. Cloud can be animated."""
     sun_color = graphics.Color(255, 200, 0)
     ray_color = graphics.Color(255, 140, 0)
     cloud_color = graphics.Color(220, 220, 220)
     
-    # Draw partial sun
+    # Draw partial sun (stays in place)
     graphics.DrawLine(canvas, x + 8, y + 2, x + 8, y + 4, ray_color)
     graphics.DrawLine(canvas, x + 2, y + 8, x + 4, y + 8, ray_color)
     graphics.DrawLine(canvas, x + 3, y + 3, x + 5, y + 5, ray_color)
     for r in range(4, 0, -1):
         graphics.DrawCircle(canvas, x + 8, y + 8, r, sun_color)
     
-    # Draw cloud
-    _draw_cloud_shape(canvas, x + 6, y + 10, cloud_color)
+    # Draw cloud (with animation offset)
+    _draw_cloud_shape(canvas, x + 6 + cloud_offset, y + 10, cloud_color)
 
 
-def draw_partly_cloudy_night(canvas, x, y):
+def draw_partly_cloudy_night(canvas, x, y, cloud_offset=0):
     """Draw moon partially covered by cloud."""
     moon_color = graphics.Color(255, 255, 200)
     cloud_color = graphics.Color(180, 180, 200)
     
     for r in range(4, 0, -1):
         graphics.DrawCircle(canvas, x + 8, y + 8, r, moon_color)
-    _draw_cloud_shape(canvas, x + 6, y + 10, cloud_color)
+    _draw_cloud_shape(canvas, x + 6 + cloud_offset, y + 10, cloud_color)
 
 
 def draw_cloudy(canvas, x, y):
@@ -218,16 +218,40 @@ WEATHER_ICONS = {
 }
 
 
-def draw_weather_icon(canvas, x, y, weather_state):
-    """Draw weather icon based on state string."""
+def draw_weather_icon(canvas, x, y, weather_state, cloud_offset=0):
+    """Draw weather icon based on state string.
+    
+    Args:
+        canvas: The LED matrix canvas
+        x, y: Position to draw at
+        weather_state: Weather condition string
+        cloud_offset: Animation offset for cloud movement (optional)
+    """
     weather_lower = weather_state.lower() if weather_state else ''
     
-    # Try exact match
+    # Icons with cloud animation support
+    ANIMATED_ICONS = {
+        'partlycloudy': draw_partly_cloudy,
+        'partly-cloudy-day': draw_partly_cloudy,
+        'partly-cloudy-night': draw_partly_cloudy_night,
+    }
+    
+    # Try animated icons first
+    if weather_lower in ANIMATED_ICONS:
+        ANIMATED_ICONS[weather_lower](canvas, x, y, cloud_offset)
+        return
+    
+    # Try exact match for static icons
     if weather_lower in WEATHER_ICONS:
         WEATHER_ICONS[weather_lower](canvas, x, y)
         return
     
     # Try partial match
+    for key, draw_func in ANIMATED_ICONS.items():
+        if key in weather_lower or weather_lower in key:
+            draw_func(canvas, x, y, cloud_offset)
+            return
+    
     for key, draw_func in WEATHER_ICONS.items():
         if key in weather_lower or weather_lower in key:
             draw_func(canvas, x, y)