FJurmanovic/acc-server-manager-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: restyle leaderboard tab — pill nav, unsaved changes bar

Browse Source
This commit is contained in:
Fran Jurmanović
2026-03-21 21:45:21 +01:00
parent db0b1491bd
commit 8a7299fba2
1 changed files with 10 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/components/leaderboard/LeaderboardManager.tsx
View File

@@ -135,19 +135,19 @@ export function LeaderboardManager({ serverId, initialData }: LeaderboardManager
return ( return (
<div className="space-y-4"> <div className="space-y-4">
{dirty && ( {dirty && (
<div className="flex items-center justify-between rounded-lg bg-yellow-900/40 px-4 py-2 text-sm text-yellow-300"> <div className="flex items-center justify-between rounded-lg border border-gh-yellow/30 bg-gh-yellow-bg px-4 py-2 text-sm text-gh-yellow">
<span>Unsaved changes</span> <span>Unsaved changes</span>
<div className="flex gap-2"> <div className="flex gap-2">
<button <button
onClick={() => setDraft(saved)} onClick={() => setDraft(saved)}
className="rounded px-2 py-1 text-xs text-yellow-400 hover:text-yellow-200" className="rounded px-2 py-1 text-xs text-gh-yellow hover:text-gh-primary"
> >
Discard Discard
</button> </button>
<button <button
onClick={handleSave} onClick={handleSave}
disabled={isSubmitting} disabled={isSubmitting}
className="rounded bg-yellow-600 px-3 py-1 text-xs font-semibold text-white hover:bg-yellow-500 disabled:opacity-50" className="rounded bg-gh-yellow px-3 py-1 text-xs font-semibold text-gh-base hover:opacity-90 disabled:opacity-40"
> >
{isSubmitting ? 'Saving…' : 'Save'} {isSubmitting ? 'Saving…' : 'Save'}
</button> </button>
@@ -156,7 +156,9 @@ export function LeaderboardManager({ serverId, initialData }: LeaderboardManager
)} )}
{error && ( {error && (
<div className="rounded-lg bg-red-900/40 px-4 py-2 text-sm text-red-300">{error}</div> <div className="rounded-lg border border-gh-red/30 bg-gh-red-bg px-4 py-2 text-sm text-gh-red">
{error}
</div>
)} )}
<div className="flex flex-wrap gap-2"> <div className="flex flex-wrap gap-2">
@@ -164,10 +166,10 @@ export function LeaderboardManager({ serverId, initialData }: LeaderboardManager
<button <button
key={s.id} key={s.id}
onClick={() => setActiveSection(s.id)} onClick={() => setActiveSection(s.id)}
className={`rounded-lg px-3 py-1.5 text-sm font-medium transition-colors ${ className={`rounded-md px-3 py-1.5 text-sm font-medium transition-colors ${
activeSection === s.id activeSection === s.id
? 'bg-blue-600 text-white' ? 'bg-gh-blue text-white'
: 'bg-gray-700 text-gray-300 hover:bg-gray-600' : 'bg-gh-overlay text-gh-secondary hover:bg-gh-border'
}`} }`}
> >
{s.label} {s.label}
@@ -182,7 +184,7 @@ export function LeaderboardManager({ serverId, initialData }: LeaderboardManager
<button <button
onClick={handleSave} onClick={handleSave}
disabled={isSubmitting} disabled={isSubmitting}
className="rounded-lg bg-blue-600 px-4 py-2 text-sm font-semibold text-white hover:bg-blue-500 disabled:opacity-50" className="rounded-lg border border-gh-btn-green bg-gh-btn-green px-4 py-2 text-sm font-semibold text-white hover:bg-gh-btn-green-hover disabled:opacity-40"
> >
{isSubmitting ? 'Saving…' : 'Save Leaderboard'} {isSubmitting ? 'Saving…' : 'Save Leaderboard'}
</button> </button>