Fix docker multi-row wrap and status color

Author: alexphillips-dev

archive/folderview.plus-2026.03.22.25.txz.sha256

@@ -0,0 +1 @@
+d1ae329facaf1939c944614aeb47d9caacd02c0c811c5964c4230cca23d74cea  folderview.plus-2026.03.22.51.txz

archive/folderview.plus-2026.03.22.25.txz archive/folderview.plus-2026.03.22.51.txzarchive/folderview.plus-2026.03.22.25.txz renamed to archive/folderview.plus-2026.03.22.51.txz

@@ -6,13 +6,19 @@
 <!ENTITY launch "Settings/FolderViewPlus">
 <!ENTITY plugdir "/usr/local/emhttp/plugins/&name;">
 <!ENTITY pluginURL "https://raw.githubusercontent.com/&github;/dev/folderview.plus.plg">
-<!ENTITY version "2026.03.22.50">
-<!ENTITY md5 "c9e9c9d695741228fef35b380995c629">
+<!ENTITY version "2026.03.22.51">
+<!ENTITY md5 "25c5c4b81f8b43cbd2cf6520750e97d4">
 ]>
 
 <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">
     <CHANGES>
 
+###2026.03.22.51
+- Fix: Measure Docker multi-row preview items at natural width so the first row fills before wrapping.
+- Fix: Keep compact multi-row status text on the normal text color while only the status icon uses the started/stopped color.
+- UX: Align multi-row preview rows to the same horizontal flow model as the normal single-row preview.
+
+
 ###2026.03.22.50
 - Fix: Route Docker multi-row previews through the real preview renderer instead of legacy cloned markup.
 - Fix: Keep multi-row member names horizontal beside the icon and send quick actions into the dedicated trailing action cluster.

archive/folderview.plus-2026.03.22.51.txz.sha256

@@ -311,8 +311,8 @@ const buildDockerPreviewItem = ({ entry = {}, settings = {}, autostart = false }
                         <span class="inner fv-preview-trigger">
                             <span class="appname${updateClass}"${textWidthStyle}><a class="exec${updateClass}">${safeName}</a></span>
                             <span class="fv-preview-meta-compact">
-                            <span class="fv-preview-status-compact ${previewStateMeta.className}" title="${previewStatusTitle}">
-                                <i class="fa ${previewStateMeta.icon}" aria-hidden="true"></i><span class="state ${previewStateMeta.className}"> ${stateLabel}</span>
+                            <span class="fv-preview-status-compact" title="${previewStatusTitle}">
+                                <i class="fa ${previewStateMeta.icon} ${previewStateMeta.className}" aria-hidden="true"></i><span class="state"> ${stateLabel}</span>
                             </span>
                             <span class="fv-preview-actions-compact"></span>
                             </span>
@@ -329,8 +329,8 @@ const buildDockerPreviewItem = ({ entry = {}, settings = {}, autostart = false }
                         <span class="inner fv-preview-trigger">
                             <span class="appname${updateClass}"${textWidthStyle}><a class="exec${updateClass}">${safeName}</a></span>
                             <span class="fv-preview-meta-compact">
-                            <span class="fv-preview-status-compact ${previewStateMeta.className}" title="${previewStatusTitle}">
-                                <i class="fa ${previewStateMeta.icon}" aria-hidden="true"></i><span class="state ${previewStateMeta.className}"> ${stateLabel}</span>
+                            <span class="fv-preview-status-compact" title="${previewStatusTitle}">
+                                <i class="fa ${previewStateMeta.icon} ${previewStateMeta.className}" aria-hidden="true"></i><span class="state"> ${stateLabel}</span>
                             </span>
                             <span class="fv-preview-actions-compact"></span>
                             </span>

folderview.plus.plg

@@ -330,11 +330,13 @@ tr.folder.fv-parent-expanded div.folder-preview {
     padding: 0;
     flex-direction: column;
     flex-wrap: nowrap;
-    align-items: stretch;
-    align-content: stretch;
+    align-items: flex-start;
+    align-content: flex-start;
 }
 
 .folder-preview.fv-preview-multirow .folder-preview-row {
+    width: 100%;
+    box-sizing: border-box;
     align-items: center;
     min-height: calc(var(--fvplus-preview-row-height) - 0.45em);
     padding: 2px 0 2px 8px;