From b0f55db56bb0ddf3d8de8c7ed60da7859c3a852a Mon Sep 17 00:00:00 2001
From: RachelElysia <71795832+RachelElysia@users.noreply.github.com>
Date: Wed, 24 Jun 2026 16:29:46 -0400
Subject: [PATCH] Fleet UI: Add software progress bar stops jittering as
 percentage digits change (#48187)

---
 frontend/components/FileDetails/_styles.scss | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/frontend/components/FileDetails/_styles.scss b/frontend/components/FileDetails/_styles.scss
index f71d116598..2cf46fb0c6 100644
--- a/frontend/components/FileDetails/_styles.scss
+++ b/frontend/components/FileDetails/_styles.scss
@@ -43,10 +43,11 @@
 
   &__progress-wrapper {
     display: flex;
-    width: 184px; // using fixed width to prevent jitter when text changes: 144px + $pad-medium + 24px for text
+    width: 184px; // 144px bar + $pad-small gap + 32px text
+    flex-shrink: 0; // don't let the sibling __info collapse this wrapper to its min-content (#47539)
     justify-content: space-between;
     align-items: center;
-    gap: $pad-small; // shouldn't be necessary, but just in case
+    gap: $pad-small;
   }
 
   &__progress-bar {
@@ -64,6 +65,9 @@
   }
 
   &__progress-text {
+    width: 32px; // fixed width so "1%" → "100%" doesn't shift the bar (#47539)
+    flex-shrink: 0;
+    text-align: right;
     font-size: $x-small;
     color: $ui-fleet-black-50;
   }