diff --git a/containers/libreportal/frontend/core/setup/css/setup-wizard.css b/containers/libreportal/frontend/core/setup/css/setup-wizard.css
index 3911eda..81a10ad 100755
--- a/containers/libreportal/frontend/core/setup/css/setup-wizard.css
+++ b/containers/libreportal/frontend/core/setup/css/setup-wizard.css
@@ -1325,7 +1325,9 @@ body.setup-wizard-open .eo-modal { z-index: 10000; }
/* Capacity meter on a drive card. Inline and small on purpose: it encodes the
proportion the text deliberately doesn't repeat, without adding a row.
- Filled = free space, so the bar drains as the disk fills. */
+ Filled = used space, as in every file manager. The track is deliberately
+ high-contrast: a barely-used disk shows a tiny sliver, and against a faint
+ track that read as a broken widget rather than as "almost empty". */
.setup-storage-meter {
display: inline-block;
vertical-align: middle;
@@ -1333,7 +1335,8 @@ body.setup-wizard-open .eo-modal { z-index: 10000; }
height: 5px;
margin-left: 10px;
border-radius: 3px;
- background: rgba(255, 255, 255, 0.20);
+ background: rgba(255, 255, 255, 0.32);
+ box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.14);
overflow: hidden;
}
.setup-storage-meter > span {
diff --git a/containers/libreportal/frontend/core/setup/js/setup-wizard.js b/containers/libreportal/frontend/core/setup/js/setup-wizard.js
index 8ec6cbb..5d5df8c 100755
--- a/containers/libreportal/frontend/core/setup/js/setup-wizard.js
+++ b/containers/libreportal/frontend/core/setup/js/setup-wizard.js
@@ -452,23 +452,25 @@ class SetupWizard {
//
// Which figure matters depends on the question. For "will my data fit?" —
// the question this step actually asks — absolute free space decides it: a
- // 4 GB disk that is 89% free is still useless for a media library.
- // Percentage answers "is this filling up?", a health signal rather than a
- // placement one. So the text carries the magnitude and the bar the
- // proportion, which is what the eye reads fastest.
+ // 4 GB disk that is 89% free is still useless for a media library. So the
+ // text carries the magnitude and the bar the proportion.
//
- // The bar fills with FREE space, not used. Filling by usage meant a healthy
- // 7%-full disk rendered as an almost-empty track that read as a broken
- // widget, and it disagreed with the text right beside it. Filled = room to
- // spare, draining = filling up, which is the same direction as the words.
+ // The bar fills with USED space. This is the convention every file manager
+ // uses (Windows Explorer shows exactly this pairing: a used-fill bar beside
+ // "808 GB free of 912 GB"), and a filled bar therefore reads as "full".
+ // Filling it with FREE instead was internally consistent with the text but
+ // fought that convention hard enough that a nearly-empty disk looked full.
+ // The cosmetic problem that prompted the inversion — a low-usage bar looking
+ // like a broken widget — belongs to the track's contrast, fixed in CSS.
_storageMeter(c) {
const used = Math.max(0, Math.min(100, Number(c.used_pct) || 0));
- const free = 100 - used;
- const level = free <= 10 ? ' setup-storage-meter-high'
- : (free <= 25 ? ' setup-storage-meter-mid' : '');
+ // Keep a sliver visible so a barely-used disk still reads as a measurement.
+ const width = used > 0 && used < 2 ? 2 : used;
+ const level = used >= 90 ? ' setup-storage-meter-high'
+ : (used >= 75 ? ' setup-storage-meter-mid' : '');
return ``;
+ aria-label="${used}% of this drive used"
+ title="${used}% used, ${100 - used}% free">`;
}
// One card, one line.
@@ -525,10 +527,11 @@ class SetupWizard {
});
if (note) {
- // Deliberately not repeating the tooltip: this line carries only what is
- // actionable while choosing.
+ // Only the single-disk case says anything: with drives listed, the cards
+ // and their badges already carry it, and a standing explanatory line
+ // under them was noise.
note.innerHTML = this.storageCandidates.length
- ? 'Drives that can\u2019t hold app data are greyed out \u2014 open Details to see why.'
+ ? ''
: 'No other drives found. You can add one later with libreportal storage.';
}
}