Skip to content

Commit 47352ce

Browse files
alexphillips-devalexphillips-dev
committed
Polish setup assistant apply and completion modals
1 parent 9eee9ec commit 47352ce

6 files changed

Lines changed: 85 additions & 53 deletions

File tree

‎archive/folderview.plus-2026.03.21.09.txz.sha256‎

Lines changed: 0 additions & 1 deletion
This file was deleted.

archive/folderview.plus-2026.03.21.09.txz renamed to archive/folderview.plus-2026.03.21.38.txz

14.1 MB
Binary file not shown.

‎archive/folderview.plus-2026.03.21.38.txz.sha256‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
c1c5ce5eef05f95fab439761dec5e4eca8c569d320664aab3ea9bbda44cefee0 folderview.plus-2026.03.21.38.txz

‎folderview.plus.plg‎

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,13 +6,19 @@
66
<!ENTITY launch "Settings/FolderViewPlus">
77
<!ENTITY plugdir "/usr/local/emhttp/plugins/&name;">
88
<!ENTITY pluginURL "https://raw.githubusercontent.com/&github;/dev/folderview.plus.plg">
9-
<!ENTITY version "2026.03.21.37">
10-
<!ENTITY md5 "c1ac6ff890ddb338756c12b6605a2385">
9+
<!ENTITY version "2026.03.21.38">
10+
<!ENTITY md5 "25e5951678ea21c1ab8949215a895b2c">
1111
]>
1212

1313
<PLUGIN name="&name;" author="&author;" version="&version;" launch="&launch;" pluginURL="&pluginURL;" icon="folder-icon.png" support="https://forums.unraid.net/topic/197631-plugin-folderview-plus/" min="7.0.0">
1414
<CHANGES>
1515

16+
###2026.03.21.38
17+
- UX: Rebuilt the setup apply confirmation modal with compact metric cards, cleaner spacing, and consolidated summaries so it no longer feels stretched or cluttered.
18+
- UX: Refreshed the setup complete / partial-failure dialogs to match the same clean layout and readable grouped outcomes.
19+
- Fix: Added stronger SweetAlert overflow guards so setup summary dialogs do not show unnecessary desktop scrollbars.
20+
21+
1622
###2026.03.21.37
1723
- UX: Tightened setup-apply modal spacing and typography so the summary stays compact and readable without unnecessary vertical gaps.
1824
- UX: Added dedicated wizard modal styling to eliminate desktop scrollbar/overflow artifacts for setup confirmation and completion dialogs.

‎src/folderview.plus/usr/local/emhttp/plugins/folderview.plus/scripts/folderviewplus.wizard.js‎

Lines changed: 25 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -3292,7 +3292,18 @@ const toSetupAssistantDisplayText = (value, fallback = '-') => {
32923292

32933293
const markSetupAssistantSwalModal = () => {
32943294
setTimeout(() => {
3295-
$('.sweet-alert:visible').addClass('fv-setup-swal-modal');
3295+
const modal = $('.sweet-alert:visible');
3296+
modal.addClass('fv-setup-swal-modal');
3297+
modal.css({
3298+
overflow: 'visible',
3299+
maxHeight: 'none'
3300+
});
3301+
modal.find('p').css({
3302+
maxHeight: 'none',
3303+
overflow: 'visible',
3304+
margin: 0,
3305+
padding: 0
3306+
});
32963307
}, 0);
32973308
};
32983309

@@ -3307,7 +3318,12 @@ const renderSetupAssistantSwalSummaryHtml = ({
33073318
? `<div class="fv-setup-swal-meta">${metaRows.map((row) => `<span class="fv-setup-swal-chip"><strong>${escapeHtml(row.label)}:</strong><span>${escapeHtml(row.value)}</span></span>`).join('')}</div>`
33083319
: '';
33093320
const detailHtml = detailRows.length
3310-
? `<div class="fv-setup-swal-table">${detailRows.map((row) => `<div class="fv-setup-swal-row"><span class="fv-setup-swal-row-label">${escapeHtml(row.label)}</span><span class="fv-setup-swal-row-value">${escapeHtml(row.value)}</span></div>`).join('')}</div>`
3321+
? `<div class="fv-setup-swal-table">${detailRows.map((row) => {
3322+
const label = escapeHtml(row.label);
3323+
const value = escapeHtml(row.value);
3324+
const isWide = row?.wide === true || String(row?.value || '').length > 54;
3325+
return `<div class="fv-setup-swal-row${isWide ? ' is-wide' : ''}"><span class="fv-setup-swal-row-label">${label}</span><span class="fv-setup-swal-row-value">${value}</span></div>`;
3326+
}).join('')}</div>`
33113327
: '';
33123328
const warningHtml = warningLines.length
33133329
? `<div class="fv-setup-swal-listbox is-warning"><div class="fv-setup-swal-list-title">Warnings</div><ul class="fv-setup-swal-list">${warningLines.map((line) => `<li>${escapeHtml(line)}</li>`).join('')}</ul></div>`
@@ -3998,12 +4014,9 @@ const applySetupAssistantPlan = async () => {
39984014
{ label: 'Safety mode', value: safetyMode }
39994015
],
40004016
detailRows: [
4001-
{ label: 'Docker imports', value: `${importOutcomes.docker}` },
4002-
{ label: 'VM imports', value: `${importOutcomes.vm}` },
4003-
{ label: 'Docker starter folders', value: `${templateOutcomes.docker.created} created, ${templateOutcomes.docker.skippedExisting} skipped, ${Number(templateOutcomes.docker.assignment?.matched) || 0} auto-assigned` },
4004-
{ label: 'VM starter folders', value: `${templateOutcomes.vm.created} created, ${templateOutcomes.vm.skippedExisting} skipped, ${Number(templateOutcomes.vm.assignment?.matched) || 0} auto-assigned` },
4005-
{ label: 'Docker starter rules', value: `${ruleOutcomes.docker.created} added` },
4006-
{ label: 'VM starter rules', value: `${ruleOutcomes.vm.created} added` },
4017+
{ label: 'Imports', value: `Docker ${importOutcomes.docker} | VM ${importOutcomes.vm}` },
4018+
{ label: 'Starter folders', value: `Docker ${templateOutcomes.docker.created} created, ${templateOutcomes.docker.skippedExisting} skipped, ${Number(templateOutcomes.docker.assignment?.matched) || 0} auto-assigned | VM ${templateOutcomes.vm.created} created, ${templateOutcomes.vm.skippedExisting} skipped, ${Number(templateOutcomes.vm.assignment?.matched) || 0} auto-assigned`, wide: true },
4019+
{ label: 'Starter rules', value: `Docker ${ruleOutcomes.docker.created} added | VM ${ruleOutcomes.vm.created} added`, wide: true },
40074020
{ label: 'Verification', value: `${verification.passed}/${verification.total} checks passed` },
40084021
{ label: 'Retryable failures', value: `${applyFailures.length}` }
40094022
],
@@ -4056,15 +4069,12 @@ const applySetupAssistantPlan = async () => {
40564069
detailRows: [
40574070
{ label: 'Profile defaults', value: setupAssistantState.applyProfileDefaults ? setupAssistantState.profile : 'not applied' },
40584071
{ label: 'Environment defaults', value: setupAssistantState.applyEnvironmentDefaults ? (SETUP_ASSISTANT_ENV_PRESETS[setupAssistantState.environmentPreset]?.label || 'Home Lab') : 'not applied' },
4059-
{ label: 'Docker imports', value: `${importOutcomes.docker}` },
4060-
{ label: 'VM imports', value: `${importOutcomes.vm}` },
4061-
{ label: 'Docker starter folders', value: `${templateOutcomes.docker.created} created, ${templateOutcomes.docker.skippedExisting} skipped, ${Number(templateOutcomes.docker.assignment?.matched) || 0} auto-assigned` },
4062-
{ label: 'VM starter folders', value: `${templateOutcomes.vm.created} created, ${templateOutcomes.vm.skippedExisting} skipped, ${Number(templateOutcomes.vm.assignment?.matched) || 0} auto-assigned` },
4063-
{ label: 'Docker starter rules', value: `${ruleOutcomes.docker.created} added` },
4064-
{ label: 'VM starter rules', value: `${ruleOutcomes.vm.created} added` },
4072+
{ label: 'Imports', value: `Docker ${importOutcomes.docker} | VM ${importOutcomes.vm}` },
4073+
{ label: 'Starter folders', value: `Docker ${templateOutcomes.docker.created} created, ${templateOutcomes.docker.skippedExisting} skipped, ${Number(templateOutcomes.docker.assignment?.matched) || 0} auto-assigned | VM ${templateOutcomes.vm.created} created, ${templateOutcomes.vm.skippedExisting} skipped, ${Number(templateOutcomes.vm.assignment?.matched) || 0} auto-assigned`, wide: true },
4074+
{ label: 'Starter rules', value: `Docker ${ruleOutcomes.docker.created} added | VM ${ruleOutcomes.vm.created} added`, wide: true },
40654075
{ label: 'Preference changes', value: `${impactSummary.prefs.totalChanges}` },
40664076
{ label: 'Verification', value: `${verification.passed}/${verification.total} checks passed` },
4067-
{ label: 'Rollback checkpoint', value: setupAssistantState.rollbackCheckpointName || (rollbackCreated ? 'created' : 'skipped (Fast mode)') },
4077+
{ label: 'Rollback checkpoint', value: setupAssistantState.rollbackCheckpointName || (rollbackCreated ? 'created' : 'skipped (Fast mode)'), wide: true },
40684078
{ label: 'Duration', value: `${durationSeconds}s` }
40694079
],
40704080
warningLines: validationWarnings.slice(0, 5)

‎src/folderview.plus/usr/local/emhttp/plugins/folderview.plus/styles/folderviewplus.css‎

Lines changed: 51 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -5840,21 +5840,21 @@ tr.is-long-press-active {
58405840
}
58415841

58425842
.sweet-alert.fv-setup-swal-modal {
5843-
width: min(560px, calc(100vw - 24px)) !important;
5844-
max-width: min(560px, calc(100vw - 24px)) !important;
5845-
padding: 12px 14px 10px !important;
5843+
width: min(620px, calc(100vw - 24px)) !important;
5844+
max-width: min(620px, calc(100vw - 24px)) !important;
5845+
padding: 10px 14px 8px !important;
58465846
overflow: visible !important;
58475847
}
58485848

58495849
.sweet-alert.fv-setup-swal-modal .sa-icon {
5850-
margin: 4px auto 8px !important;
5851-
width: 68px !important;
5852-
height: 68px !important;
5850+
margin: 2px auto 6px !important;
5851+
width: 60px !important;
5852+
height: 60px !important;
58535853
}
58545854

58555855
.sweet-alert.fv-setup-swal-modal h2 {
5856-
margin: 4px 0 6px !important;
5857-
font-size: 1.9rem !important;
5856+
margin: 2px 0 5px !important;
5857+
font-size: 1.75rem !important;
58585858
line-height: 1.2 !important;
58595859
}
58605860

@@ -5867,67 +5867,76 @@ tr.is-long-press-active {
58675867
}
58685868

58695869
.sweet-alert.fv-setup-swal-modal .sa-button-container {
5870-
margin-top: 10px !important;
5870+
margin-top: 8px !important;
58715871
}
58725872

58735873
.fv-setup-swal {
5874-
max-width: 520px;
5874+
max-width: 584px;
58755875
margin: 0 auto;
58765876
text-align: left;
5877-
line-height: 1.24;
5877+
line-height: 1.2;
58785878
}
58795879

58805880
.fv-setup-swal-meta {
58815881
display: flex;
58825882
flex-wrap: wrap;
5883-
gap: 6px;
5884-
margin-bottom: 8px;
5883+
gap: 5px;
5884+
margin-bottom: 6px;
58855885
}
58865886

58875887
.fv-setup-swal-chip {
58885888
display: inline-flex;
58895889
align-items: center;
58905890
gap: 4px;
5891-
padding: 3px 8px;
5891+
padding: 2px 8px;
58925892
border-radius: 999px;
58935893
border: 1px solid rgba(148, 170, 196, 0.34);
58945894
background: rgba(18, 28, 42, 0.72);
5895-
font-size: 12px;
5895+
font-size: 11px;
58965896
}
58975897

58985898
.fv-setup-swal-table {
5899-
border: 1px solid rgba(148, 170, 196, 0.28);
5900-
border-radius: 10px;
5901-
background: rgba(9, 16, 24, 0.78);
5902-
overflow: hidden;
5899+
display: grid;
5900+
grid-template-columns: repeat(2, minmax(0, 1fr));
5901+
gap: 6px;
59035902
}
59045903

59055904
.fv-setup-swal-row {
5906-
display: flex;
5907-
align-items: flex-start;
5908-
justify-content: space-between;
5909-
gap: 10px;
5910-
padding: 6px 10px;
5911-
font-size: 1.03rem;
5905+
display: grid;
5906+
gap: 2px;
5907+
padding: 6px 8px;
5908+
font-size: 1rem;
5909+
border: 1px solid rgba(148, 170, 196, 0.24);
5910+
border-radius: 8px;
5911+
background: rgba(9, 16, 24, 0.78);
59125912
}
59135913

59145914
.fv-setup-swal-row + .fv-setup-swal-row {
5915-
border-top: 1px solid rgba(148, 170, 196, 0.18);
5915+
border-top: none;
59165916
}
59175917

59185918
.fv-setup-swal-row-label {
59195919
font-weight: 600;
5920-
color: #d9e5f6;
5920+
color: #bfd4ef;
5921+
font-size: 1.03rem;
59215922
}
59225923

59235924
.fv-setup-swal-row-value {
5924-
text-align: right;
5925+
text-align: left;
59255926
color: #eaf2ff;
5927+
font-weight: 700;
5928+
font-size: 1.03rem;
5929+
line-height: 1.2;
5930+
word-break: break-word;
5931+
}
5932+
5933+
.fv-setup-swal-row.is-wide {
5934+
grid-column: 1 / -1;
59265935
}
59275936

59285937
.fv-setup-swal-listbox {
5929-
margin-top: 8px;
5930-
padding: 7px 10px;
5938+
margin-top: 6px;
5939+
padding: 7px 9px;
59315940
border-radius: 9px;
59325941
border: 1px solid rgba(148, 170, 196, 0.35);
59335942
background: rgba(148, 170, 196, 0.1);
@@ -5944,24 +5953,28 @@ tr.is-long-press-active {
59445953
}
59455954

59465955
.fv-setup-swal-list-title {
5947-
margin-bottom: 4px;
5956+
margin-bottom: 3px;
59485957
font-weight: 700;
5958+
font-size: 1.03rem;
59495959
}
59505960

59515961
.fv-setup-swal-list {
59525962
margin: 0;
5953-
padding-left: 18px;
5963+
padding-left: 16px;
5964+
line-height: 1.2;
59545965
}
59555966

59565967
.fv-setup-swal-list li {
5957-
margin: 2px 0;
5968+
margin: 1px 0;
5969+
font-size: 1.03rem;
59585970
}
59595971

59605972
.fv-setup-swal-footer {
5961-
margin-top: 8px;
5973+
margin-top: 6px;
59625974
text-align: center;
59635975
font-weight: 600;
59645976
color: #d7e6fb;
5977+
font-size: 1.03rem;
59655978
}
59665979

59675980
@media (max-width: 760px) {
@@ -6020,8 +6033,11 @@ tr.is-long-press-active {
60206033
font-size: 1.4rem !important;
60216034
}
60226035

6036+
.sweet-alert.fv-setup-swal-modal .fv-setup-swal-table {
6037+
grid-template-columns: 1fr;
6038+
}
6039+
60236040
.sweet-alert.fv-setup-swal-modal .fv-setup-swal-row {
6024-
flex-direction: column;
60256041
gap: 2px;
60266042
}
60276043

0 commit comments

Comments
 (0)