mirror of
https://github.com/we-promise/sure.git
synced 2026-06-01 08:49:01 +00:00
8a9f4b1a67
- StatusPill: use functional `text-success` / `text-warning` tokens with matching icon colors and `px-2 py-1`, mirroring `app/views/budget_categories/_budget_category.html.erb:29-43`. - ProgressRing: rework center text to match `_budget_donut.html.erb` (small "Saved" label, `text-3xl font-medium` headline, "of $X" underline). Stroke color now derives from goal.status (yellow when behind, blue on track, green reached, gray for no-date). - GoalCard bar: track height + transition match budget category bar (`h-1.5`, `transition-all duration-500`, `inline-size`). - Index/show layouts: render page header inline (`<h1>` + actions). The default application layout doesn't yield `:page_actions`, so the CTA + kebab menu wouldn't appear when emitted via `content_for`. - Stepper review summary: target the actual form inputs by `name` rather than relying on the `data-target` Stimulus attribute, since `money_field` puts the attribute on the wrapper. Step 1 validation scoped to the step 1 panel. - Demo generator: filter Depository accounts via `where(accountable_type: "Depository")` — Rails delegated_type generates the `depository?` predicate, not a `.depository` scope.
29 lines
1.4 KiB
Plaintext
29 lines
1.4 KiB
Plaintext
<%= link_to savings_goal_path(goal), class: "block bg-container rounded-xl shadow-border-xs hover:shadow-border-sm p-4 transition-shadow" do %>
|
|
<div class="flex items-start gap-3">
|
|
<%= render Savings::GoalAvatarComponent.new(goal: goal, size: "md") %>
|
|
<div class="min-w-0 flex-1">
|
|
<div class="flex items-center justify-between gap-2">
|
|
<p class="text-sm font-medium text-primary truncate"><%= goal.name %></p>
|
|
<%= render Savings::StatusPillComponent.new(goal: goal) %>
|
|
</div>
|
|
<p class="text-xs text-secondary truncate mt-0.5"><%= linked_accounts_label %></p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mt-4">
|
|
<div class="flex items-center justify-between gap-2 text-xs tabular-nums">
|
|
<span class="text-secondary"><%= goal.current_balance_money.format %></span>
|
|
<span class="text-secondary">/ <%= goal.target_amount_money.format %></span>
|
|
</div>
|
|
<div class="mt-2 h-1.5 w-full rounded-full bg-container-inset overflow-hidden">
|
|
<div class="h-full <%= bar_color_class %> rounded-full transition-all duration-500" style="inline-size: <%= progress_percent %>%"></div>
|
|
</div>
|
|
<div class="mt-1 flex items-center justify-between text-xs text-secondary tabular-nums">
|
|
<span><%= progress_percent %>%</span>
|
|
<% if goal.target_date %>
|
|
<span><%= I18n.l(goal.target_date, format: :long) %></span>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
<% end %>
|