1
0
Fork 0
mirror of https://github.com/maybe-finance/maybe.git synced 2025-08-10 16:05:22 +02:00

Vehicle view (#1117)

This commit is contained in:
Zach Gollwitzer 2024-08-23 09:33:42 -04:00 committed by GitHub
parent e856691c86
commit 359bceb58e
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
15 changed files with 259 additions and 8 deletions

View file

@ -0,0 +1,49 @@
<%# locals: (account:) %>
<div class="grid grid-cols-3 gap-2">
<div class="rounded-xl bg-white shadow-xs border border-alpha-black-25 p-4">
<h4 class="text-gray-500 text-sm"><%= t(".make_model") %></h4>
<p class="text-xl font-medium text-gray-900">
<%= [account.vehicle.make, account.vehicle.model].compact.join(" ").presence || t(".unknown") %>
</p>
</div>
<div class="rounded-xl bg-white shadow-xs border border-alpha-black-25 p-4">
<h4 class="text-gray-500 text-sm"><%= t(".year") %></h4>
<p class="text-xl font-medium text-gray-900">
<%= account.vehicle.year || t(".unknown") %>
</p>
</div>
<div class="rounded-xl bg-white shadow-xs border border-alpha-black-25 p-4">
<h4 class="text-gray-500 text-sm flex items-center gap-1"><%= t(".mileage") %></h4>
<p class="text-xl font-medium text-gray-900">
<%= account.vehicle.mileage || t(".unknown") %>
</p>
</div>
<div class="rounded-xl bg-white shadow-xs border border-alpha-black-25 p-4">
<h4 class="text-gray-500 text-sm"><%= t(".purchase_price") %></h4>
<p class="text-xl font-medium text-gray-900">
<%= format_money account.vehicle.purchase_price %>
</p>
</div>
<div class="rounded-xl bg-white shadow-xs border border-alpha-black-25 p-4">
<h4 class="text-gray-500 text-sm"><%= t(".current_price") %></h4>
<p class="text-xl font-medium text-gray-900">
<%= format_money account.balance_money %>
</p>
</div>
<div class="rounded-xl bg-white shadow-xs border border-alpha-black-25 p-4">
<h4 class="text-gray-500 text-sm"><%= t(".trend") %></h4>
<div class="flex items-center gap-1" style="color: <%= account.vehicle.trend.color %>">
<p class="text-xl font-medium">
<%= account.vehicle.trend.value %>
</p>
<p>(<%= account.vehicle.trend.percent %>%)</p>
</div>
</div>
</div>