diff --git a/containers/libreportal/frontend/core/setup/css/setup-wizard.css b/containers/libreportal/frontend/core/setup/css/setup-wizard.css index 9d3a630..15fe7a2 100755 --- a/containers/libreportal/frontend/core/setup/css/setup-wizard.css +++ b/containers/libreportal/frontend/core/setup/css/setup-wizard.css @@ -1570,7 +1570,8 @@ body.setup-wizard-open .custom-select-popup { z-index: 10001; } It cannot borrow .setup-app-card's look, because that class carries no layout of its own — it is a bare wrapper elsewhere, and a ` + : `
${body}
`; + } + renderFoundBackups() { const box = this.container.querySelector('#sw-rs-found'); if (!box) return; @@ -1138,12 +1156,7 @@ class SetupWizard { box.innerHTML = `

Backups found on this machine \u2014 pick one:

` + - found.map((f, i) => ` - `).join(''); + found.map((f, i) => this._backupCard(Object.assign({ _i: i }, f), 'pick')).join(''); this._adoptSingleResult(); @@ -1219,10 +1232,8 @@ class SetupWizard { const box = this.container.querySelector('#sw-rs-verify-result'); if (!box) return; if (d && d.repo) { - box.innerHTML = `

Backup found \u2014 - ${d.snapshots} snapshot${d.snapshots === 1 ? '' : 's'}${ - d.newest ? `, newest ${this._restoreWhen(d.newest)}` : ''}. - Enter its password to see what is inside.

`; + box.innerHTML = this._backupCard(d, 'chosen') + + `

Enter its password below to see what is inside.

`; return; } // A suggestion means they pointed at the folder holding the repositories diff --git a/scripts/dev/lp-restore-wizard-test b/scripts/dev/lp-restore-wizard-test index f5d21bf..21644e4 100755 --- a/scripts/dev/lp-restore-wizard-test +++ b/scripts/dev/lp-restore-wizard-test @@ -143,6 +143,15 @@ read -r -d '' DRIVE <<'JS' w.renderFoundBackups(); out.singlePrefillsThePath = ($('#sw-rs-path') || {}).value === '/only/one'; out.singleShowsItsVerdict = /4 snapshots/.test(($('#sw-rs-verify-result') || {}).textContent || ''); + // Rendered as the same CARD the found list uses, not as a sentence. It is + // the same fact either way and should not look like two different things + // depending on how it was arrived at. + const chosen = $('#sw-rs-verify-result .setup-found-backup'); + out.singleRendersAsACard = !!chosen; + out.singleCardCarriesTheBadge = !!(chosen && chosen.querySelector('.setup-storage-badge')); + // Not a button: there is nothing left to choose, and a card that looks + // clickable but is not is worse than one that does not. + out.singleCardIsNotClickable = !!chosen && chosen.tagName !== 'BUTTON'; // The card and the verdict would otherwise say the same thing twice. out.singleDrawsNoDuplicateCard = $('#sw-rs-found .setup-found-backup') === null; // Pressing Check must confirm, not reply "give a full path" about the backup @@ -306,6 +315,9 @@ chk "so does the verdict" "$(g .verdictInsideTheGroup)" true echo " one result is the answer, not a choice" chk "it fills the path in" "$(g .singlePrefillsThePath)" true chk "and shows its verdict" "$(g .singleShowsItsVerdict)" true +chk "as a card, not a sentence" "$(g .singleRendersAsACard)" true +chk "carrying the snapshot badge" "$(g .singleCardCarriesTheBadge)" true +chk "and not looking clickable" "$(g .singleCardIsNotClickable)" true chk "without a duplicate card" "$(g .singleDrawsNoDuplicateCard)" true chk "Check confirms, not scolds" "$(g .singleCheckDoesNotScold)" true