carlos/almeira-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update media upload button UI to show an active uploading state

Browse Source
This commit is contained in:
Carlos (Almeira) 2026-07-01 19:05:17 -05:00
parent df1df8a681
commit c90e842cad
1 changed files with 8 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/app/dashboard/media/new/page.tsx
View File

@ -154,9 +154,15 @@ export default function NewMediaPage() {
</div>
<div className="pt-4">
<button type="submit" disabled={isUploading || filePreviews.length === 0} className="w-full relative flex items-center gap-2 justify-center group overflow-hidden bg-slate-800 text-white font-black uppercase tracking-widest py-4 px-6 rounded-xl transition-all border border-pink-500/50 hover:border-pink-400 disabled:opacity-50 disabled:cursor-not-allowed">
<button type="submit" disabled={isUploading || filePreviews.length === 0} className={`w-full relative flex items-center gap-2 justify-center group overflow-hidden text-white font-black uppercase tracking-widest py-4 px-6 rounded-xl transition-all border disabled:cursor-not-allowed ${isUploading ? 'border-cyan-500/50 bg-cyan-900' : 'bg-slate-800 border-pink-500/50 hover:border-pink-400 disabled:opacity-50'}`}>
{isUploading ? (
<span className="relative z-10 animate-pulse">{progressMsg || `Preparando ${selectedFiles.length} archivos...`}</span>
<>
<div className="absolute inset-0 bg-gradient-to-r from-cyan-700 via-blue-600 to-cyan-700 bg-[length:200%_100%] animate-pulse opacity-90"></div>
<span className="relative z-10 flex items-center gap-2 drop-shadow-md">
<UploadCloud size={20} className="animate-bounce" />
Subiendo Archivos...
</span>
</>
) : (
<>
<div className="absolute inset-0 bg-gradient-to-r from-pink-600 to-purple-500 opacity-90 group-hover:opacity-100 transition-opacity"></div>