Administrator/Multi-Hoster-Upload
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 47 Wiki Activity

fix: center update metric separators

Browse Source 
Place both metric separators in identical fixed-width grid columns and center them explicitly so size, speed, and ETA maintain balanced spacing.
This commit is contained in:
Sucukdeluxe
2026-08-21 00:38:48 +02:00
parent e7947f7486
commit aea0b22a4f
2 changed files with 6 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
renderer/styles.css
+4 -3
View File
@@ -2527,9 +2527,9 @@ select.hs-input { max-width: none; width: auto; min-width: 140px; }
#updateProgressDetails { #updateProgressDetails {
min-width: 0; min-width: 0;
display: grid; display: grid;
grid-template-columns: 19ch auto 11ch auto 10ch; grid-template-columns: 19ch 2ch 11ch 2ch 10ch;
align-items: baseline; align-items: baseline;
gap: 5px; column-gap: 0;
color: var(--text-dim); color: var(--text-dim);
font-size: 11px; font-size: 11px;
font-variant-numeric: tabular-nums; font-variant-numeric: tabular-nums;
@@ -2542,7 +2542,8 @@ select.hs-input { max-width: none; width: auto; min-width: 140px; }
} }
.update-progress-separator { .update-progress-separator {
text-align: center; display: grid;
place-items: center;
} }
#updateProgressSpeed, #updateProgressSpeed,
tests/startup-renderer.test.js
+2 -1
View File
@@ -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-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(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(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); assert.match(css, /#updateProgressDetails\[hidden\]\s*\{[^}]*display:\s*none;/su);
}); });