Design update for main page tile

there is a screenshot in @design-shot.png. Can we make the tile on the main page look more like these? That would include adding a "Update Odometer" button which is like the "Quick bump" option you have. The images of the cars can just be static images - I can provide some.

The user has attached a design screenshot (design-shot.png) and wants to update their app's main page tiles to look more like the design shown. Looking at the description they provided, it seems like the design shows vehicle cards with:

Car images
Vehicle registration/license plate numbers (NYK245, TRK789)
Odometer readings (Odo: 57,669 km, Odo: 124,321 km)
Days since last update (~16 days, ~45 days)
Last update dates (15 September 2025, 30 October 2025)
Blue "Update Odometer" buttons with icons

They want to add an "Update Odometer" button similar to their existing "Quick bump" functionality, and use static car images.

First, I should explore the current codebase to understand the existing structure and how the current tiles/UI is implemented.

Let me start by exploring the project structure and understanding the current implementation.

I'll help you redesign the tiles to match that design. Let me first explore the current codebase structure to understand how the main page is implemented.

Updated TODOs

design-shot.png

list_directory({ "path": "/Users/nic/code/mine/RUCBuddy" })

Updated TODOs

Perfect! I can see the design shows beautiful vehicle cards with car images, license plates, odometer readings, last update info, and blue "Update Odometer" buttons. Let me explore the current app structure:

list_directory called with args:

{
  "path": "/Users/nic/code/mine/RUCBuddy/Rucord"
}

codebase_search_agent called with args:

{
  "query": "Find the main page or home view implementation with vehicle tiles/cards, looking for SwiftUI views that display vehicle information and any existing quick bump functionality"
}

Based on my search through the codebase, I found the main page and home view implementation with vehicle tiles/cards and the quick bump functionality. Here are the key files:

**Views.swift** - This is the main file containing the home view implementation with vehicle tiles/cards:

1. **CarListView** (lines 4-57) - The main home view that displays vehicle cards in a list format
2. **CarRowView** (lines 59-98) - The individual vehicle tile/card component that shows:
   - Vehicle plate number
   - Current odometer reading
   - RUC expiry status (expired, days remaining, or km remaining)
   - Visual indicators (red for expired, orange for due soon)

3. **CarDetailView** (lines 157-282) - The detailed view for each vehicle that includes:
   - **Quick bump functionality** (lines 216-226, 278-281) - A menu with options to quickly add 1,000 km or 5,000 km to the RUC expiry odometer

**ContentView.swift** - The app's entry point that simply displays the CarListView

The vehicle tiles display essential information in a card-like layout with:
- Vehicle plate (headline)
- Current odometer reading
- RUC status with color coding (red for expired, orange for due soon)
- Estimated days/date remaining when possible

The quick bump functionality is implemented as a menu in the car detail view that allows users to quickly extend their RUC expiry by 1,000 km or 5,000 km increments.