Change : UI/UX design

platform/static/js/platform.js

@@ -403,7 +403,9 @@ function renderBackupList(items, id, source) {
       : '';
     return `
     <div class="backup-item" id="bk-item-${source}-${b.replace(/[^a-z0-9]/gi, '_')}">
-      <span class="backup-name">${escapeHtml(b)}</span>
+      <div class="backup-item-main">
+        <span class="backup-name">${escapeHtml(b)}</span>
+      </div>
       <div class="backup-actions">
         ${detailsBtn}
         <button class="btn btn-ghost btn-sm btn-audit" onclick="auditBackup('${source}','${safe}',this)"><i class="fas fa-shield-check"></i> Audit</button>
@@ -533,7 +535,13 @@ async function loadBackupLog() {
       node.innerHTML = '<div class="empty-state"><i class="fas fa-inbox"></i>No backup history yet</div>';
       return;
     }
-    node.innerHTML = d.entries.map((e) => `<div class="backup-item"><span class="backup-name">${e.name}</span><span class="card-meta">${e.status}</span></div>`).join('');
+    node.innerHTML = d.entries.map((e) => `
+      <div class="backup-item">
+        <div class="backup-item-main">
+          <span class="backup-name">${escapeHtml(e.name)}</span>
+          <span class="backup-meta">${escapeHtml(e.status)}</span>
+        </div>
+      </div>`).join('');
   } catch (e) {
     node.innerHTML = `<div class="empty-state">Error loading log: ${e}</div>`;
   }