mirror of
https://github.com/we-promise/sure.git
synced 2026-05-30 15:59:02 +00:00
9b70f0385c
- Sparkline (`savings-sparkline` controller): dropped the `Math.max(0, yMin)` clamp on the y-axis domain so negative balances (or any series that dips into negative territory) render fully instead of being cropped off the canvas. - Hero card: padding `p-6` → `p-7`, column ratio `[minmax(0,1fr)_minmax(0,1.6fr)]` so the chart breathes, min height bumped to 220px, sparkline container `h-full min-h-[200px]` so it fills the card vertically. Stats row now sits at the bottom of the text column via `mt-auto pt-6`; labels promoted to `text-xs`, values to `text-lg`. - Section vertical rhythm: outer `space-y-6` → `space-y-8`. - Goal card: padding `p-[18px]` → `p-6`. Internal gap from header row to amount line `mt-3.5` → `mt-5`. Account-row gap `mt-3` → `mt-4`. - Account card: padding `p-5` → `p-6`. - Status pill "Behind" dot: `bg-yellow-500` → `bg-yellow-600` for a warmer/ambery tone matching the Claude Design reference. - Goal card donut "behind" stroke: `var(--color-yellow-500)` → `var(--color-yellow-600)` to match the pill.
60 lines
1.4 KiB
Ruby
60 lines
1.4 KiB
Ruby
class Savings::GoalCardComponent < ApplicationComponent
|
|
RING_SIZE = 64
|
|
RING_STROKE = 6
|
|
|
|
def initialize(goal:)
|
|
@goal = goal
|
|
end
|
|
|
|
attr_reader :goal
|
|
|
|
def progress_percent
|
|
goal.progress_percent
|
|
end
|
|
|
|
def ring_color
|
|
case goal.status
|
|
when :reached then "var(--color-green-600)"
|
|
when :behind then "var(--color-yellow-600)"
|
|
when :on_track then "var(--text-primary)"
|
|
else "var(--text-subdued)"
|
|
end
|
|
end
|
|
|
|
def linked_accounts
|
|
@linked_accounts ||= goal.linked_accounts.to_a
|
|
end
|
|
|
|
def linked_accounts_count_label
|
|
I18n.t("savings_goals.goal_card.accounts", count: linked_accounts.size)
|
|
end
|
|
|
|
def secondary_line
|
|
if goal.completed?
|
|
I18n.t("savings_goals.goal_card.completed")
|
|
elsif goal.target_date.nil?
|
|
I18n.t("savings_goals.goal_card.no_target_date")
|
|
else
|
|
days = (goal.target_date - Date.current).to_i
|
|
if days >= 0
|
|
I18n.t("savings_goals.goal_card.days_left_by", count: days, date: I18n.l(goal.target_date, format: :long))
|
|
else
|
|
I18n.t("savings_goals.goal_card.past_due")
|
|
end
|
|
end
|
|
end
|
|
|
|
def ring_circumference
|
|
@ring_circumference ||= 2 * Math::PI * ring_radius
|
|
end
|
|
|
|
def ring_radius
|
|
@ring_radius ||= (RING_SIZE - RING_STROKE) / 2.0
|
|
end
|
|
|
|
def ring_offset
|
|
pct = [ [ progress_percent.to_i, 0 ].max, 100 ].min
|
|
ring_circumference * (1 - pct / 100.0)
|
|
end
|
|
end
|