mirror of
https://github.com/we-promise/sure.git
synced 2026-05-30 07:49:01 +00:00
263ccbf5cc
Five small audit follow-ups bundled because they were each one-line swaps and individually wouldn't earn their own commit. Card text scale (vs Sure house style — budget_category h3 ≈ text-base, budget _actuals_summary value text-xl, account row text-sm subtype): - goal card title text-sm → text-base - goal card balance text-lg → text-xl - goal card pace/footer/subtitle text-[11px] → text-xs - funding row subtype subtitle text-xs → text-sm - funding row "last 30d / last 90d" labels text-[10px] → text-xs Chart label scale (projection chart was an outlier at font-size: 10 while time_series_chart_controller uses 12): - every `font-size: 10` in goal_projection_chart_controller.js → 12 - tooltip cssText font-size: 11 → 12 Color-picker pen toggle on the new-goal avatar was w-6 h-6 (24px circle, ~55% of the lg 44px avatar). Shrink to w-5 h-5 + add a w-3 h-3 class on the inner icon so it scales down with it. Graph continuity bug: the saved-line endpoint and the projection-line start point could disagree by tens of $thousands. Saved came from `Balance::ChartSeriesBuilder` (daily snapshot in `balances`), projection started at `currentAmount = goal.current_balance.to_f` (live `linked_accounts.sum(:balance)`). When the snapshot lagged the live read, the chart showed a vertical gap at the "today" marker. Filter any same-day-or-later points out of the raw saved series, always extend the saved series to `(today, currentAmount)`. Saved line now closes at exactly the projection's start. The recent balance-drop story is still honestly shown (the line dips toward the live value rather than ending at the stale snapshot). Ring card focal-point (RUI audit): the left ring card on goals#show sat at the same `shadow-border-xs` elevation as the projection chart and funding card. "When every card is raised, nothing's primary." Drop the shadow + container background — the ring now reads as a status panel sitting on the page surface, not a content card competing with its neighbours. Paused/archived/celebration/empty right-slot variants keep elevation since they ARE content cards. Deferred: light-mode pink distribution-bar contrast. The fix needs a DS token decision (hairline outline vs darker step on the palette entries); rolling it into a polish PR risks dragging in DS changes unrelated to goals. Logged for a follow-up.
65 lines
3.0 KiB
Plaintext
65 lines
3.0 KiB
Plaintext
<% if rows.empty? %>
|
|
<div class="text-center py-6">
|
|
<p class="text-sm text-secondary"><%= t("goals.show.funding_accounts.empty.heading") %></p>
|
|
<p class="text-xs text-subdued mt-1"><%= t("goals.show.funding_accounts.empty.body") %></p>
|
|
</div>
|
|
<% else %>
|
|
<div class="space-y-4">
|
|
<h2 class="text-lg font-medium text-primary"><%= t("goals.show.funding_accounts_heading") %></h2>
|
|
|
|
<%# Distribution bar. proportional weight of each account in this goal.
|
|
Color encoding is shared with the row avatar so the bar reads as a
|
|
legend by itself; no separate dot/name/% strip needed. %>
|
|
<% if rows.size > 1 && total.positive? %>
|
|
<div class="flex gap-1">
|
|
<% rows.each do |row| %>
|
|
<% next if row[:balance].to_d.zero? %>
|
|
<div class="h-1.5 rounded-sm" style="width: <%= percent_for(row[:balance]) %>%; background-color: <%= color_for(row[:account]) %>;"></div>
|
|
<% end %>
|
|
</div>
|
|
<% end %>
|
|
|
|
<%# Per-account detail. avatar / name+type / % / last-30d + last-90d %>
|
|
<div class="bg-container-inset rounded-xl p-1">
|
|
<div class="rounded-lg bg-container">
|
|
<% rows.each_with_index do |row, idx| %>
|
|
<% account = row[:account] %>
|
|
<% color = color_for(account) %>
|
|
<div class="px-4 py-3 grid grid-cols-[24px_minmax(0,1fr)_auto] sm:grid-cols-[24px_minmax(0,1fr)_48px_120px] items-center gap-3">
|
|
<%= render Goals::AvatarComponent.new(name: account.name, color: color, size: "sm") %>
|
|
|
|
<div class="min-w-0">
|
|
<p class="text-sm font-medium text-primary truncate"><%= account.name %></p>
|
|
<p class="text-sm text-subdued tabular-nums privacy-sensitive">
|
|
<%= accountable_label(account) %> · <%= row[:balance_money].format(precision: 0) %>
|
|
</p>
|
|
</div>
|
|
|
|
<% if rows.size > 1 %>
|
|
<p class="hidden sm:block text-sm text-secondary tabular-nums text-right privacy-sensitive">
|
|
<%= percent_for(row[:balance]) %>%
|
|
</p>
|
|
<% else %>
|
|
<span class="hidden sm:block"></span>
|
|
<% end %>
|
|
|
|
<div class="text-right space-y-0.5">
|
|
<div class="flex items-baseline justify-end gap-1.5">
|
|
<p class="text-sm font-medium text-primary tabular-nums privacy-sensitive"><%= row[:last_30_money].format(precision: 0) %></p>
|
|
<p class="text-xs text-subdued"><%= t("goals.show.funding_last_30d") %></p>
|
|
</div>
|
|
<div class="flex items-baseline justify-end gap-1.5">
|
|
<p class="text-xs text-secondary tabular-nums privacy-sensitive"><%= row[:last_90_money].format(precision: 0) %></p>
|
|
<p class="text-xs text-subdued"><%= t("goals.show.funding_last_90d") %></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<% if idx < rows.size - 1 %>
|
|
<%= render "shared/ruler", classes: "mx-4" %>
|
|
<% end %>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<% end %>
|