monitoring: fix memory legend overflow, sort by consumption (v0.30.7)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

controller/internal/web/templates/monitoring.html

@@ -551,6 +551,9 @@
 
         header.textContent = 'Használt: ' + fmtMB(usedMB) + ' / ' + fmtMB(totalMB) + ' (' + Math.round(usedMB/totalMB*100) + '%)';
 
+        // Sort containers by memory usage descending
+        containers.sort(function(a, b) { return (b.mem_usage_mb || 0) - (a.mem_usage_mb || 0); });
+
         // Build bar segments
         var html = '';
         var legendHtml = '';

controller/internal/web/templates/style.css

@@ -816,7 +816,8 @@ select.form-control option { background: var(--bg-secondary); color: var(--text-
 }
 .memory-bar-legend {
     display: flex;
-    gap: 1.25rem;
+    flex-wrap: wrap;
+    gap: 0.5rem 1.25rem;
     margin-top: 0.5rem;
 }
 .memory-legend-item {
@@ -825,6 +826,7 @@ select.form-control option { background: var(--bg-secondary); color: var(--text-
     gap: 0.35rem;
     font-size: .75rem;
     color: var(--text-secondary);
+    white-space: nowrap;
 }
 .memory-legend-dot {
     display: inline-block;