idolpx/meatloaf-config
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(MediaManager): enhance filter and sort bar with transition effects

Browse Source
This commit is contained in:
Jaime Idolpx 2026-06-13 02:49:08 -04:00
parent b0134a9a46
commit 5ec57a1b27
1 changed files with 26 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/app/components/MediaManager.tsx
View File

@ -1107,7 +1107,8 @@ export default function MediaManager({ initialPath, rootPath, title, config, set
</div> </div>
{/* ── Filter + sort bar ── */} {/* ── Filter + sort bar ── */}
{showFilter && <div className="bg-neutral-50 border-b border-neutral-200 px-4 py-2 flex items-center gap-2 flex-shrink-0"> <div className={`overflow-hidden flex-shrink-0 transition-all duration-200 ease-in-out ${showFilter ? 'max-h-20 opacity-100' : 'max-h-0 opacity-0'}`}>
<div className="bg-neutral-50 border-b border-neutral-200 px-4 py-2 flex items-center gap-2">
<div className="relative flex-1 min-w-0"> <div className="relative flex-1 min-w-0">
<Search className="absolute left-2 top-1/2 -translate-y-1/2 w-3.5 h-3.5 text-neutral-400 pointer-events-none" /> <Search className="absolute left-2 top-1/2 -translate-y-1/2 w-3.5 h-3.5 text-neutral-400 pointer-events-none" />
<input <input
@ -1132,7 +1133,8 @@ export default function MediaManager({ initialPath, rootPath, title, config, set
{sortKey === k ? (sortAsc ? ' ↑' : ' ↓') : ''} {sortKey === k ? (sortAsc ? ' ↑' : ' ↓') : ''}
</button> </button>
))} ))}
</div>} </div>
</div>
{/* ── Selection / clipboard bar ── */} {/* ── Selection / clipboard bar ── */}
{(selCount > 0 || clipboard) && ( {(selCount > 0 || clipboard) && (