inputnoise/youclonedl
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Consistency sweep: fix switcher layout, gaps, buttons, empty states

Browse Source 
- Home: mode switcher moved to its own row (no longer crammed next to
  title on mobile), hide-watched simplified to text-only toggle
- Home/History/Discovery: pagination buttons text-sm → text-xs, page
  counter text-sm → text-xs
- Liked/Downloads/SearchResults: top-level gap-8 → gap-6
- Liked: refresh button px-4 py-2 text-sm → px-3 py-1.5 text-xs
- Empty states: standardize to text-zinc-500 text-sm across Queue,
  ContinueWatching, History, Following, Discovery, Liked
- Following: "Latest uploads" tab label → "Feed"
- Home: remove -mt-3 hacks from mode description rows

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Mattias Tall
2026-05-26 17:21:02 +02:00
parent f422d754b9
commit 94f74215e2
9 changed files with 57 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
frontend/src/pages/History.jsx
View File

@@ -30,7 +30,7 @@ export default function History() {
</div>
) : videos.length === 0 ? (
<div className="flex flex-col items-center gap-3 py-20 text-center">
<p className="text-zinc-400 text-sm">No watch history yet. Start watching some videos!</p>
<p className="text-zinc-500 text-sm">No watch history yet. Start watching some videos!</p>
</div>
) : (
<>
@@ -43,15 +43,15 @@ export default function History() {
<button
onClick={() => { setPage(p => p - 1); scrollToTop(); }}
disabled={page === 0}
className="px-4 py-2 rounded-lg bg-zinc-800 text-zinc-300 text-sm font-medium hover:bg-zinc-700 disabled:opacity-30 disabled:cursor-not-allowed transition-colors"
className="px-3 py-1.5 rounded-lg bg-zinc-800 text-zinc-300 text-xs font-medium hover:bg-zinc-700 disabled:opacity-30 disabled:cursor-not-allowed transition-colors"
>
← Prev
</button>
<span className="text-zinc-500 text-sm tabular-nums">Page {page + 1}</span>
<span className="text-zinc-500 text-xs tabular-nums">Page {page + 1}</span>
<button
onClick={() => { setPage(p => p + 1); scrollToTop(); }}
disabled={!hasNext}
className="px-4 py-2 rounded-lg bg-zinc-800 text-zinc-300 text-sm font-medium hover:bg-zinc-700 disabled:opacity-30 disabled:cursor-not-allowed transition-colors"
className="px-3 py-1.5 rounded-lg bg-zinc-800 text-zinc-300 text-xs font-medium hover:bg-zinc-700 disabled:opacity-30 disabled:cursor-not-allowed transition-colors"
>
Next →
</button>