mirror of
https://github.com/we-promise/sure.git
synced 2026-05-31 16:29:03 +00:00
`Goals::CardComponent#ring_color` and `goals/_status_callout` reached into the Tailwind palette directly (`text-yellow-700`, `var(--color-green-600)`, etc.) for status-coded colors. The sure-design-system already exposes the matching semantic tokens (`text-warning`, `text-success`, `--color-success`, `--color-warning`), which theme-swap correctly in dark mode and survive palette renames without view edits. - `ring_color`: collapse `:reached` / `:on_track` to `--color-success` (the status pill already differentiates them via icon — completed star vs check) and `:behind` to `--color-warning`. The `:no_target_date` fallback keeps `--color-gray-400` for now since there's no semantic neutral token; that gets cleaned up alongside the DS::ProgressRing extraction. - `_status_callout`: drop `text-yellow-700 theme-dark:text-yellow-300` and `text-green-700 theme-dark:text-green-300` for the equivalent semantic `text-warning` / `text-success` utilities. No visual regression in light mode (success collapses two adjacent greens into one); dark mode now properly inverts via the design system's theme variants instead of hand-rolled overrides. The `stroke="var(--budget-unused-fill)"` track on the inline card ring stays for now — that's a token-rename refactor that touches budget code outside this PR's scope and lands cleanest with the DS::ProgressRing primitive that consolidates the three ring implementations.
29 lines
1.0 KiB
Plaintext
29 lines
1.0 KiB
Plaintext
<%
|
|
context = goal.status_callout_context
|
|
return if context.blank?
|
|
|
|
variant_classes = case goal.status
|
|
when :behind
|
|
"bg-warning/10 border-warning/20 text-warning"
|
|
when :on_track
|
|
"bg-success/10 border-success/20 text-success"
|
|
else
|
|
"bg-surface-inset border-secondary text-secondary"
|
|
end
|
|
|
|
icon_glyph = case goal.status
|
|
when :behind then "triangle-alert"
|
|
when :on_track then "circle-check"
|
|
when :no_target_date then "infinity"
|
|
else "info"
|
|
end
|
|
|
|
label = t("goals.status.#{goal.status}", default: goal.status.to_s.titleize)
|
|
%>
|
|
<div class="rounded-lg border px-3 py-2 text-sm flex items-center gap-2 <%= variant_classes %>">
|
|
<span class="shrink-0"><%= icon(icon_glyph, size: "sm") %></span>
|
|
<span class="font-medium"><%= label %></span>
|
|
<span class="opacity-60">·</span>
|
|
<span class="opacity-90"><%= context %></span>
|
|
</div>
|