feat(consoletop): distinct metrics panels, fluent right panels, stretch layouts

- Metrics grid: accent-colored titles, visible separators between panels,
  distinct semi-transparent backgrounds per section (CPU/Memory/Network),
  bars stretch to fill available width
- Right panels: fluent section labels with accent color + thin rule,
  removed boxy headers, RightPanelBg for depth separation
- All bar graphs and sparklines use HorizontalAlignment.Stretch
- Left card bars stretch instead of fixed width
- Hide system top/bottom panels
- Fix ColumnContainer ignoring BackgroundColor alpha (framework bug)

Author: nickprotop

Examples/ConsoleTopExample/Dashboard/DashboardWindow.cs

@@ -130,39 +130,56 @@ private void BuildTopStatusBar(Window mainWindow)
 
     #region Metrics Grid
 
-    private static BarGraphControl BuildMetricsBar(string name, string label, int labelWidth, Color[] gradient, int marginLeft = 1, int marginRight = 0, int marginBottom = 0)
+    private static BarGraphControl BuildMetricsBar(string name, string label, int labelWidth, Color[] gradient)
     {
         return new BarGraphBuilder()
             .WithName(name).WithLabel(label).WithLabelWidth(labelWidth)
-            .WithValue(0).WithMaxValue(100).WithBarWidth(UIConstants.MetricsBarWidth)
+            .WithValue(0).WithMaxValue(100)
             .WithUnfilledColor(UIConstants.BarUnfilledColor)
+            .WithAlignment(HorizontalAlignment.Stretch)
             .ShowLabel().ShowValue().WithValueFormat("F1")
-            .WithMargin(marginLeft, 0, marginRight, marginBottom)
+            .WithMargin(1, 0, 1, 0)
             .WithSmoothGradient(gradient)
             .Build();
     }
 
     private void BuildMetricsGrid(Window mainWindow)
     {
-        var muted = UIConstants.MutedText.ToMarkup();
+        var accent = UIConstants.Accent.ToMarkup();
         var metricsGrid = Controls.HorizontalGrid()
             .WithMargin(0, 0, 0, 0)
             .Column(col =>
-                col.Add(Controls.Markup($"[{muted} bold] CPU[/]").WithMargin(0, 0, 0, 0).Build())
+                col.Add(Controls.Markup($"[{accent} bold] CPU[/]").WithMargin(0, 0, 0, 0).Build())
                     .Add(BuildMetricsBar("cpuUserBar", "User", UIConstants.MetricsCpuLabelWidth, UIConstants.GradientHealthy))
-                    .Add(BuildMetricsBar("cpuSystemBar", "Sys", UIConstants.MetricsCpuLabelWidth, UIConstants.SparkCpuSystem))
-                    .Add(BuildMetricsBar("cpuIoWaitBar", "IO", UIConstants.MetricsCpuLabelWidth, UIConstants.GradientIoRead)))
-            .Column(col => col.Width(1))
+                    .Add(BuildMetricsBar("cpuSystemBar", "System", UIConstants.MetricsCpuLabelWidth, UIConstants.SparkCpuSystem))
+                    .Add(BuildMetricsBar("cpuIoWaitBar", "IOwait", UIConstants.MetricsCpuLabelWidth, UIConstants.GradientIoRead)))
             .Column(col =>
-                col.Add(Controls.Markup($"[{muted} bold] Memory[/]").WithMargin(0, 0, 0, 0).Build())
-                    .Add(BuildMetricsBar("memUsedBar", "Used", UIConstants.MetricsMemLabelWidth, UIConstants.GradientHealthy, marginRight: 1))
-                    .Add(BuildMetricsBar("memCachedBar", "Cache", UIConstants.MetricsMemLabelWidth, UIConstants.SparkMemCached, marginRight: 1))
-                    .Add(BuildMetricsBar("memIoBar", "IO", UIConstants.MetricsMemLabelWidth, UIConstants.GradientIoWrite, marginRight: 1)))
-            .Column(col => col.Width(1))
+            {
+                col.Width(1);
+                col.Add(new SeparatorControl
+                {
+                    ForegroundColor = UIConstants.SeparatorColor,
+                    VerticalAlignment = VerticalAlignment.Fill
+                });
+            })
+            .Column(col =>
+                col.Add(Controls.Markup($"[{accent} bold] Memory[/]").WithMargin(0, 0, 0, 0).Build())
+                    .Add(BuildMetricsBar("memUsedBar", "Used %", UIConstants.MetricsMemLabelWidth, UIConstants.GradientHealthy))
+                    .Add(BuildMetricsBar("memCachedBar", "Cached %", UIConstants.MetricsMemLabelWidth, UIConstants.SparkMemCached))
+                    .Add(BuildMetricsBar("memIoBar", "Disk IO", UIConstants.MetricsMemLabelWidth, UIConstants.GradientIoWrite)))
+            .Column(col =>
+            {
+                col.Width(1);
+                col.Add(new SeparatorControl
+                {
+                    ForegroundColor = UIConstants.SeparatorColor,
+                    VerticalAlignment = VerticalAlignment.Fill
+                });
+            })
             .Column(col =>
-                col.Add(Controls.Markup($"[{muted} bold] Network[/]").WithMargin(0, 0, 0, 0).Build())
-                    .Add(BuildMetricsBar("netUploadBar", "Up", UIConstants.MetricsNetLabelWidth, UIConstants.GradientNetUpload, marginRight: 1))
-                    .Add(BuildMetricsBar("netDownloadBar", "Down", UIConstants.MetricsNetLabelWidth, UIConstants.GradientNetDownload, marginRight: 1)))
+                col.Add(Controls.Markup($"[{accent} bold] Network[/]").WithMargin(0, 0, 0, 0).Build())
+                    .Add(BuildMetricsBar("netUploadBar", "Upload", UIConstants.MetricsNetLabelWidth, UIConstants.GradientNetUpload))
+                    .Add(BuildMetricsBar("netDownloadBar", "Download", UIConstants.MetricsNetLabelWidth, UIConstants.GradientNetDownload)))
             .WithAlignment(HorizontalAlignment.Stretch)
             .Build();
 

Examples/ConsoleTopExample/Helpers/UIConstants.cs

@@ -103,12 +103,12 @@ internal static class UIConstants
     public static readonly Color CardBg = new(20, 28, 40, 180);
 
     // Metrics grid sub-panel tinted backgrounds (semi-transparent, distinct hues)
-    public static readonly Color MetricsCpuBg = new(0x0d, 0x20, 0x30, 190);    // deep blue-teal tint
-    public static readonly Color MetricsMemBg = new(0x15, 0x1a, 0x30, 190);    // indigo tint
-    public static readonly Color MetricsNetBg = new(0x0d, 0x25, 0x20, 190);    // teal-green tint
+    public static readonly Color MetricsCpuBg = new(10, 40, 60, 180);      // blue-teal tint
+    public static readonly Color MetricsMemBg = new(30, 20, 55, 180);      // indigo/purple tint
+    public static readonly Color MetricsNetBg = new(10, 45, 35, 180);      // teal-green tint
 
-    // Right panel background (slightly lighter than base for subtle separation)
-    public static readonly Color RightPanelBg = new(12, 18, 28, 200);
+    // Right panel background
+    public static readonly Color RightPanelBg = new(10, 16, 26, 210);
 
     // Status bars — darkest layer
     public static readonly Color HeaderBg = new(0x0a, 0x0e, 0x14);

Examples/ConsoleTopExample/Program.cs

@@ -11,7 +11,6 @@
 using SharpConsoleUI.Configuration;
 using SharpConsoleUI.Drivers;
 using SharpConsoleUI.Helpers;
-using SharpConsoleUI.Panel;
 
 namespace ConsoleTopExample;
 
@@ -27,7 +26,8 @@ static async Task<int> Main(string[] args)
             var windowSystem = new ConsoleWindowSystem(
                 new NetConsoleDriver(RenderMode.Buffer),
                 options: new ConsoleWindowSystemOptions(
-                    TopPanelConfig: panel => panel.Left(Elements.StatusText(""))));
+                    ShowTopPanel: false,
+                    ShowBottomPanel: false));
 
             windowSystem.PanelStateService.TopStatus =
                 $"ConsoleTop - System Monitor ({SystemStatsFactory.GetPlatformName()})";

Examples/ConsoleTopExample/Tabs/BaseResponsiveTab.cs

@@ -324,6 +324,22 @@ protected static void AddSectionHeader(ScrollablePanelControl panel, string titl
         );
     }
 
+    protected static void AddFluentSectionLabel(ScrollablePanelControl panel, string title)
+    {
+        panel.AddControl(
+            Controls.Markup()
+                .AddLine($"[{UIConstants.Accent.ToMarkup()}]{title}[/]")
+                .WithAlignment(HorizontalAlignment.Left)
+                .WithMargin(1, 1, 1, 0)
+                .Build()
+        );
+        panel.AddControl(
+            Controls.RuleBuilder()
+                .WithColor(UIConstants.SeparatorColor)
+                .Build()
+        );
+    }
+
     #endregion
 
     #region Window Access