first full rendering sample of pop% cap with styling

Stars Assistant/Assets/DataGridStyles.axaml

@@ -0,0 +1,26 @@
+<Styles xmlns="https://github.com/avaloniaui"
+        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <Design.PreviewWith>
+        <Border Padding="20">
+            <!-- Add Controls for Previewer Here -->
+        </Border>
+    </Design.PreviewWith>
+
+    <Style Selector="DataGridColumnHeader">
+        <Setter Property="Margin" Value="0" />
+        <Setter Property="Padding" Value="0" />
+        <Setter Property="MinHeight" Value="20" />
+    </Style>
+
+    <Style Selector="DataGridCell">
+        <Setter Property="Margin" Value="0" />
+        <Setter Property="Padding" Value="0" />
+        <Setter Property="MinHeight" Value="20" />
+    </Style>
+    
+    <Style Selector="Border.Warning"><Setter Property="Background" Value="Khaki" /></Style>
+    <Style Selector="Border.Good"><Setter Property="Background" Value="PaleGreen" /></Style>
+    <Style Selector="Border.Bad"><Setter Property="Background" Value="LightCoral" /></Style>
+    <Style Selector="Border.Inactive"><Setter Property="Background" Value="LightGray" /></Style>
+
+</Styles>

Stars Assistant/Assets/GridCellStyles.axaml

@@ -1,13 +0,0 @@
-<Styles xmlns="https://github.com/avaloniaui"
-        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <Design.PreviewWith>
-        <Border Padding="20">
-            <!-- Add Controls for Previewer Here -->
-        </Border>
-    </Design.PreviewWith>
-
-    <Style Selector="DataGridCell.cool">
-        <Setter Property="FontWeight" Value="Bold" />
-        <Setter Property="Background" Value="Red" />
-    </Style>
-</Styles>

Stars Assistant/ViewModels/DataGridColumn/PopulationCapacity.cs

@@ -1,19 +0,0 @@
-using ReactiveUI.SourceGenerators;
-using Avalonia.Media;
-
-namespace StarsAssistant.ViewModels.DataGridColumn;
-
-public partial class PopulationCapacity(int value) : ViewModelBase
-{
-    [Reactive] private int _value = value;
-
-    public IBrush BackgroundColor => _value switch
-    {
-        < 25 => Brushes.Khaki,
-        <= 33 => Brushes.PaleGreen,
-        <= 50 => Brushes.Khaki,
-        > 100 => Brushes.LightCoral,
-        > 99 => Brushes.LightGray,
-        _ => Brushes.White
-    };
-}

Stars Assistant/ViewModels/PlayerPlanetViewModel.cs

@@ -189,8 +189,7 @@ public partial class PlayerPlanetViewModel : ViewModelBase
  
     public int MaxTerraforming => Planet.MaxTerraforming ?? 0; 
 
-    // public int CapacityPercent => Planet.CapacityPercent ?? 0; 
+    public int CapacityPercent => Planet.CapacityPercent ?? 0; 
-    public DataGridColumn.PopulationCapacity CapacityPercent => new(Planet.CapacityPercent ?? 0);
 
     public int ScanRange => Planet.ScanRange ?? 0; 
 

Stars Assistant/Views/BuColView.axaml

@@ -3,6 +3,7 @@
              xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
              xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
              xmlns:vm="using:StarsAssistant.ViewModels"
+             xmlns:helpers="using:StarsAssistant.Views.Helpers"
              mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="200"
              x:Class="StarsAssistant.Views.BuColView"
              x:DataType="vm:BuColViewModel">
@@ -17,14 +18,8 @@
     BorderThickness="1" BorderBrush="Gray" 
     >
     
-
-    
       <DataGrid.Columns>
-        
+        <DataGridTextColumn Header="Planet" Binding="{Binding Name}" />
-          
- 
-        
-        <DataGridTextColumn Header="Planet" Binding="{Binding Name}" CellStyleClasses="cool"/>
         <!-- Class -->
         <!-- Info -->
         <DataGridTextColumn Header="Pop" Binding="{Binding Population}" />
@@ -32,7 +27,27 @@
         <DataGridTextColumn Header="Growth" Binding="{Binding PopulationGrowth}" />
         <DataGridTextColumn Header="Pop T1" Binding="{Binding EnRoutePopulation}" />
         <DataGridTextColumn Header="Pop T%" Binding="{Binding PopulationTargetPercent}" IsReadOnly="false"/>
-        <DataGridTextColumn Header="Pop %"  Binding="{Binding CapacityPercent }" />
+        <DataGridTextColumn Header="Pop %1" Binding="{Binding CapacityPercent }" />
+        
+        <DataGridTemplateColumn Header="Pop %2" SortMemberPath="CapacityPercent">
+          <DataGridTemplateColumn.CellTemplate>
+            <DataTemplate>
+              <Border
+                  Classes.Good="{Binding CapacityPercent,
+                    Converter={x:Static helpers:PlanetStyleConverters.PopulationPercentGood}}"
+                  Classes.Warning="{Binding CapacityPercent,
+                    Converter={x:Static helpers:PlanetStyleConverters.PopulationPercentWarning}}"
+                  Classes.Bad="{Binding CapacityPercent,
+                    Converter={x:Static helpers:PlanetStyleConverters.PopulationPercentBad}}"
+                  Classes.Inactive="{Binding CapacityPercent,
+                    Converter={x:Static helpers:PlanetStyleConverters.PopulationPercentInactive}}"
+                >
+                <TextBlock Text="{Binding CapacityPercent, StringFormat='{}{0} %'}"
+                           HorizontalAlignment="Right" VerticalAlignment="Center"/>
+              </Border>
+            </DataTemplate>
+          </DataGridTemplateColumn.CellTemplate>           
+        </DataGridTemplateColumn>
         
         <!-- Terra Delta assumed -->
         <DataGridTextColumn Header="Value" Binding="{Binding Value}" />

Stars Assistant/Views/Helpers/PlanetStyleConverters.cs

@@ -0,0 +1,62 @@
+using Avalonia.Data.Converters;
+
+namespace StarsAssistant.Views.Helpers;
+
+public static class PlanetStyleConverters
+{
+    /// <summary>
+    /// Check, if the planet pop percentage is in the warning range
+    /// </summary>
+    public static FuncValueConverter<int?, bool> PopulationPercentWarning { get; }
+        = new((value) =>
+        {
+            return value switch
+            {
+                null => false,
+                > 0 and < 25 or > 33 and <= 50 => true,
+                _ => false
+            };
+        });
+
+    /// <summary>
+    /// Check, if the planet pop percentage is in a bad range (overpop)
+    /// </summary>
+    public static FuncValueConverter<int?, bool> PopulationPercentBad { get; }
+        = new((value) =>
+        {
+            return value switch
+            {
+                null => false,
+                > 100 => true,
+                _ => false
+            };
+        });
+     
+    /// <summary>
+    /// Check, if the planet pop percentage is in a good range (growth-wise)
+    /// </summary>
+    public static FuncValueConverter<int?, bool> PopulationPercentGood { get; }
+        = new((value) =>
+        {
+            return value switch
+            {
+                null => false,
+                >= 25 and <= 33 => true,
+                _ => false
+            };
+        });
+    
+    /// <summary>
+    /// Check, if the planet pop percentage is not relevant (100%)
+    /// </summary>
+    public static FuncValueConverter<int?, bool> PopulationPercentInactive { get; }
+        = new((value) =>
+        {
+            return value switch
+            {
+                null => false,
+                > 99 and <= 100 => true,
+                _ => false
+            };
+        });
+}