From 32578bc9c3f64c747c3699bf10aed26d9bcc8aec Mon Sep 17 00:00:00 2001
From: jarvis2f <137974272+jarvis2f@users.noreply.github.com>
Date: Wed, 25 Dec 2024 18:52:56 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=92=84=20feat:=20Optimize=20mobile=20styl?=
 =?UTF-8?q?e.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/src/components/file-card.tsx     | 5 +++--
 web/src/components/file-control.tsx  | 2 +-
 web/src/components/file-progress.tsx | 8 ++++++--
 3 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/web/src/components/file-card.tsx b/web/src/components/file-card.tsx
index a774683..d9edaa4 100644
--- a/web/src/components/file-card.tsx
+++ b/web/src/components/file-card.tsx
@@ -55,8 +55,9 @@ export function FileCard({ file }: FileCardProps) {
 
           <div className="flex-1">
             <h3 className="mb-1 font-medium">{file.name}</h3>
-            <div className="mb-2 text-sm text-muted-foreground">
-              {prettyBytes(file.size)} • {file.type} • {file.downloadStatus}
+            <div className="mb-2 flex justify-between items-center text-sm text-muted-foreground">
+              <span>{prettyBytes(file.size)} • {file.type}</span>
+              <span>{file.downloadStatus}</span>
             </div>
             <div className="mb-2 w-full overflow-hidden">
               <FileProgress file={file} />
diff --git a/web/src/components/file-control.tsx b/web/src/components/file-control.tsx
index 87d8447..6e42c1b 100644
--- a/web/src/components/file-control.tsx
+++ b/web/src/components/file-control.tsx
@@ -28,7 +28,7 @@ export default function FileControl({ file }: { file: TelegramFile }) {
                 {starting ? (
                   <Loader2 className="h-4 w-4 animate-spin" />
                 ) : (
-                  <ArrowDown className="h-4 w-4 stroke-1" />
+                  <ArrowDown className="h-4 w-4" />
                 )}
               </Button>
             </TooltipTrigger>
diff --git a/web/src/components/file-progress.tsx b/web/src/components/file-progress.tsx
index a35f6d0..12050d8 100644
--- a/web/src/components/file-progress.tsx
+++ b/web/src/components/file-progress.tsx
@@ -21,7 +21,11 @@ export default function FileProgress({ file }: { file: TelegramFile }) {
     return file.downloadStatus === "completed" ? 100 : 0;
   }, [file.downloadStatus, file.downloadedSize, file.size, downloadProgress]);
 
-  if (file.downloadStatus === "idle" || file.downloadStatus === "completed" || file.size === 0) {
+  if (
+    file.downloadStatus === "idle" ||
+    file.downloadStatus === "completed" ||
+    file.size === 0
+  ) {
     return null;
   }
 
@@ -35,7 +39,7 @@ export default function FileProgress({ file }: { file: TelegramFile }) {
           </span>
         </div>
       )}
-      <div className="flex min-w-32 items-center gap-1 bg-gray-100 px-1">
+      <div className="hidden min-w-32 items-center gap-1 bg-gray-100 px-1 md:flex">
         <Zap className="h-3 w-3" />
         <span className="text-nowrap text-xs">
           {file.downloadStatus === "downloading"