highperfocused/grimoire
1
0
Fork 0
mirror of https://github.com/purrgrammer/grimoire.git synced 2026-04-11 07:56:50 +02:00
Code Issues Packages Projects Releases Wiki Activity

style: unify progress indicator styles

Browse Source 
- Update user menu and welcome page progress indicators to match
  goal renderer style: bar on top, progress/total below with percentage
- Remove "sats" suffix from progress displays
- Make goal zap button primary variant and full-width
This commit is contained in:
Claude
2026-01-20 16:08:54 +00:00
parent 5b9713f0ae
commit 50183099a8
4 changed files with 27 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/components/GrimoireWelcome.tsx
View File

@@ -136,15 +136,20 @@ export function GrimoireWelcome({
{description}
</div>
{showProgress && (
<div className="mt-2 space-y-1">
<div className="flex items-center justify-between text-[10px] text-muted-foreground">
<span>Monthly goal</span>
<span>
{formatSats(monthlyDonations)} /{" "}
{formatSats(MONTHLY_GOAL_SATS)} sats
<div className="mt-2 flex flex-col gap-1">
<Progress value={goalProgress} className="h-1" />
<div className="flex items-center justify-between text-[10px]">
<span className="text-muted-foreground">
<span className="text-foreground font-medium">
{formatSats(monthlyDonations)}
</span>
{" / "}
{formatSats(MONTHLY_GOAL_SATS)}
</span>
<span className="text-muted-foreground">
{goalProgress.toFixed(0)}%
</span>
</div>
<Progress value={goalProgress} className="h-1" />
</div>
)}
</button>

4
src/components/nostr/kinds/GoalDetailRenderer.tsx
View File

@@ -164,8 +164,8 @@ export function GoalDetailRenderer({ event }: { event: NostrEvent }) {
{/* Zap Button */}
{!closed && (
<Button variant="outline" onClick={handleZap} className="w-fit">
<Zap className="size-4 text-zap" />
<Button onClick={handleZap} className="w-full">
<Zap className="size-4" />
Zap this Goal
</Button>
)}

4
src/components/nostr/kinds/GoalRenderer.tsx
View File

@@ -142,8 +142,8 @@ export function GoalRenderer({ event }: BaseEventProps) {
{/* Zap Button */}
{!closed && (
<Button variant="outline" size="sm" onClick={handleZap}>
<Zap className="size-4 text-zap" />
<Button onClick={handleZap} className="w-full">
<Zap className="size-4" />
Zap this Goal
</Button>
)}

17
src/components/nostr/user-menu.tsx
View File

@@ -434,14 +434,19 @@ export default function UserMenu() {
<Zap className="size-4 text-yellow-500" />
<span className="text-sm font-medium">Support Grimoire</span>
</div>
<div className="flex items-center justify-between text-xs mb-1">
<span className="text-muted-foreground">Monthly goal</span>
<span className="font-medium">
{formatSats(monthlyDonations)} /{" "}
{formatSats(MONTHLY_GOAL_SATS)} sats
<Progress value={goalProgress} className="h-1.5 mb-1" />
<div className="flex items-center justify-between text-xs">
<span className="text-muted-foreground">
<span className="text-foreground font-medium">
{formatSats(monthlyDonations)}
</span>
{" / "}
{formatSats(MONTHLY_GOAL_SATS)}
</span>
<span className="text-muted-foreground">
{goalProgress.toFixed(0)}%
</span>
</div>
<Progress value={goalProgress} className="h-1.5" />
</div>
</DropdownMenuGroup>