mirror of
https://github.com/we-promise/sure.git
synced 2026-05-29 23:39:03 +00:00
880ca69657
Behavioural + RUI audit follow-ups.
The yellow overload finding flagged three concurrent yellow surfaces
on the show page: the "Behind" status pill, the catch-up alert, and
the open-pledge banner(s). Demoting the alert to outline ownership
of the primary CTA addressed one layer, but the pill kept fighting
the alert for hue attention. "Behind" is a state, not a call to
action; the alert owns the action signal.
Switch the pill's classes from `bg-yellow-500/10 text-yellow-700`
to `bg-surface-inset text-yellow-700` (with the same dark-mode
override). Background goes neutral (matches paused/archived chips);
the text keeps the warning hue and the triangle-alert icon stays.
Signal preserved, weight reduced. The yellow alert below now reads
as the primary nudge instead of one of three matching tones.
Also: copy/em-dash sweep across goal surfaces. User-facing strings
that contained em-dashes ("Reaches 70% — $X of $Y", "into your
linked account — Sure will catch it", "You're at 80% — $X of $Y")
read as a stylistic tic; replace with comma/period/period
respectively. Form-stepper review placeholders "—" become "…"
(ellipsis reads as "not yet set" without the typographic weight).
Code comments + log messages also scrubbed for consistency; awkward
sed artifacts (//. its...) restored to readable English.
No locale-key shape changes; pure string-content edits + one
component-style tweak.
61 lines
1.5 KiB
Ruby
61 lines
1.5 KiB
Ruby
class Goals::AvatarComponent < ApplicationComponent
|
|
SIZES = {
|
|
"sm" => { box: "w-6 h-6", text: "text-[10px]", radius: "rounded-md" },
|
|
"md" => { box: "w-9 h-9", text: "text-sm", radius: "rounded-lg" },
|
|
"lg" => { box: "w-11 h-11", text: "text-base", radius: "rounded-xl" },
|
|
"xl" => { box: "w-16 h-16", text: "text-2xl", radius: "rounded-2xl" }
|
|
}.freeze
|
|
|
|
PALETTE = Goal::COLORS
|
|
|
|
# Deterministic color pick from the palette so the same string maps to
|
|
# the same color across processes (Ruby's String#hash is randomized per
|
|
# boot for DoS protection. not stable enough for visual identity).
|
|
def self.color_for(name)
|
|
return PALETTE.first if name.blank?
|
|
PALETTE[Digest::MD5.hexdigest(name).to_i(16) % PALETTE.size]
|
|
end
|
|
|
|
def initialize(goal: nil, name: nil, color: nil, icon: nil, size: "md")
|
|
@goal = goal
|
|
@name = name || goal&.name
|
|
@color = color || goal&.color || Goal::COLORS.first
|
|
@icon = icon || goal&.icon
|
|
@size = SIZES.key?(size) ? size : "md"
|
|
end
|
|
|
|
attr_reader :color
|
|
|
|
# Don't expose @icon via attr_reader. `icon` collides with the global
|
|
# icon helper used inside the template.
|
|
def icon_name
|
|
@icon
|
|
end
|
|
|
|
def initial
|
|
return "?" if @name.blank?
|
|
@name.strip.first&.upcase || "?"
|
|
end
|
|
|
|
def icon_size
|
|
case @size
|
|
when "sm" then "xs"
|
|
when "md" then "sm"
|
|
when "lg" then "md"
|
|
when "xl" then "xl"
|
|
end
|
|
end
|
|
|
|
def box_classes
|
|
SIZES[@size][:box]
|
|
end
|
|
|
|
def text_classes
|
|
SIZES[@size][:text]
|
|
end
|
|
|
|
def radius_classes
|
|
SIZES[@size][:radius]
|
|
end
|
|
end
|