From 2a6f7745c819056c4a0f73c518db1f9344a5b4be Mon Sep 17 00:00:00 2001
From: Masataka Yakura <masataka.yakura@gmail.com>
Date: Tue, 2 Apr 2024 19:54:05 +0900
Subject: [PATCH] use `tabular-nums` for percentages in ModelCancelDownload
 (#2553)

with this patch numbers in percentages have the same width so all the component widths stay the same

https://tailwindcss.com/docs/font-variant-numeric#tabular-figures
---
 web/containers/ModalCancelDownload/index.tsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/web/containers/ModalCancelDownload/index.tsx b/web/containers/ModalCancelDownload/index.tsx
index d52fbe5e9f..05543e0492 100644
--- a/web/containers/ModalCancelDownload/index.tsx
+++ b/web/containers/ModalCancelDownload/index.tsx
@@ -65,7 +65,9 @@ const ModalCancelDownload: React.FC<Props> = ({ model, isFromList }) => {
                   }) as number
                 }
               />
-              <span>{formatDownloadPercentage(downloadState.percent)}</span>
+              <span className="tabular-nums">
+                {formatDownloadPercentage(downloadState.percent)}
+              </span>
             </div>
           </Button>
         )}