Achievements UI: Clear Completion Indicator (Checkmark Instead of Reward)

[tajemniktv]

Summary

Improve the achievements completion screen/UI by replacing the reward/prize display (once earned) with a clear completion indicator (e.g., a checkmark), so completed achievements are immediately recognizable.

Motivation / Problem

In the current achievements list, it can be unclear at a glance which achievements are already completed. The reward icon/value remains visible even after completion, which doesn’t communicate “done” as strongly as it could.

A simple visual change would make the list easier to read and more satisfying.

Proposed Solution

• When an achievement is completed:
  • Replace the reward/prize UI element on the right with a checkmark (✅) or “Completed” badge.
• Optional: keep the reward accessible via tooltip/hover or a small secondary icon if needed.

UX Details (optional)

• Add subtle styling for completed achievements:
  • slightly dimmed background, or
  • green accent, or
  • “Completed” text under the title
• Ensure colorblind-friendly design (shape + color).

Acceptance Criteria

• Completed achievements show a clear checkmark (or equivalent) in the list.
• Incomplete achievements still show reward/prize as before.
• The UI is readable and consistent across resolutions.
• (Optional) Reward details remain accessible without clutter.