From aea0b22a4f5905e0968f1a6cf879261e58350c67 Mon Sep 17 00:00:00 2001
From: Sucukdeluxe <259325684+Sucukdeluxe@users.noreply.github.com>
Date: Fri, 21 Aug 2026 00:38:48 +0200
Subject: [PATCH] fix: center update metric separators

Place both metric separators in identical fixed-width grid columns and center them explicitly so size, speed, and ETA maintain balanced spacing.
---
 renderer/styles.css            | 7 ++++---
 tests/startup-renderer.test.js | 3 ++-
 2 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/renderer/styles.css b/renderer/styles.css
index 2779847..1c82022 100644
--- a/renderer/styles.css
+++ b/renderer/styles.css
@@ -2527,9 +2527,9 @@ select.hs-input { max-width: none; width: auto; min-width: 140px; }
 #updateProgressDetails {
   min-width: 0;
   display: grid;
-  grid-template-columns: 19ch auto 11ch auto 10ch;
+  grid-template-columns: 19ch 2ch 11ch 2ch 10ch;
   align-items: baseline;
-  gap: 5px;
+  column-gap: 0;
   color: var(--text-dim);
   font-size: 11px;
   font-variant-numeric: tabular-nums;
@@ -2542,7 +2542,8 @@ select.hs-input { max-width: none; width: auto; min-width: 140px; }
 }
 
 .update-progress-separator {
-  text-align: center;
+  display: grid;
+  place-items: center;
 }
 
 #updateProgressSpeed,
diff --git a/tests/startup-renderer.test.js b/tests/startup-renderer.test.js
index 55ee7da..1ca593b 100644
--- a/tests/startup-renderer.test.js
+++ b/tests/startup-renderer.test.js
@@ -177,6 +177,7 @@ test('header occupies its final geometry before asynchronous initialization', ()
   assert.match(css, /\.update-dialog\s*\{[^}]*width:\s*min\(576px,\s*100%\);/su);
   assert.match(css, /\.update-release-notes\s*\{[^}]*height:\s*min\(264px,\s*48vh\);/su);
   assert.match(html, /class="update-progress-footer"[\s\S]*id="updateProgressDetails"[\s\S]*id="updateProgressSize"[\s\S]*id="updateProgressSpeed"[\s\S]*id="updateProgressEta"[\s\S]*id="updateProgressText"/u);
-  assert.match(css, /#updateProgressDetails\s*\{[^}]*display:\s*grid;[^}]*grid-template-columns:\s*19ch auto 11ch auto 10ch;[^}]*font-variant-numeric:\s*tabular-nums;/su);
+  assert.match(css, /#updateProgressDetails\s*\{[^}]*display:\s*grid;[^}]*grid-template-columns:\s*19ch 2ch 11ch 2ch 10ch;[^}]*column-gap:\s*0;[^}]*font-variant-numeric:\s*tabular-nums;/su);
+  assert.match(css, /\.update-progress-separator\s*\{[^}]*display:\s*grid;[^}]*place-items:\s*center;/su);
   assert.match(css, /#updateProgressDetails\[hidden\]\s*\{[^}]*display:\s*none;/su);
 });