Style DataGrid for FastFlag editor

god damn i actually managed to make it look GOOD
pizzaboxer · Jul 23, 2023 · 0d17cb5 · 0d17cb5
1 parent 2bd20b5
commit 0d17cb5
Showing 1 changed file with 43 additions and 6 deletions.
diff --git a/Bloxstrap/UI/Elements/Menu/Pages/FastFlagEditorPage.xaml b/Bloxstrap/UI/Elements/Menu/Pages/FastFlagEditorPage.xaml
@@ -18,13 +18,50 @@
 
  <TextBlock Grid.Row="0" Margin="0,0,0,16" Text="Manage your own FastFlags. Double click the value column to edit." FontSize="14" Foreground="{DynamicResource TextFillColorSecondaryBrush}" />
 
- <DataGrid Name="DataGrid" Grid.Row="1" Style="{x:Null}" HeadersVisibility="Column" AutoGenerateColumns="False" CanUserAddRows="False" CanUserDeleteRows="False" CellEditEnding="DataGrid_CellEditEnding">
- <DataGrid.Columns>
- <DataGridCheckBoxColumn Header="Enabled" Binding="{Binding Enabled}" />
+ <ui:DataGrid Name="DataGrid" Grid.Row="1" HeadersVisibility="Column" GridLinesVisibility="Horizontal" AutoGenerateColumns="False" CanUserAddRows="False" CanUserDeleteRows="False" CellEditEnding="DataGrid_CellEditEnding">
+ <ui:DataGrid.Style>
+ <Style TargetType="ui:DataGrid" BasedOn="{StaticResource {x:Type ui:DataGrid}}">
+ <Setter Property="Background" Value="Transparent" />
+ <Setter Property="BorderThickness" Value="0" />
+ </Style>
+ </ui:DataGrid.Style>
+
+ <ui:DataGrid.ColumnHeaderStyle>
+ <Style TargetType="DataGridColumnHeader">
+ <Setter Property="Background" Value="{DynamicResource ControlFillColorTertiaryBrush}" />
+ <Setter Property="Height" Value="32" />
+ <Setter Property="Padding" Value="8,0,8,0" />
+ <Setter Property="BorderBrush" Value="{DynamicResource ControlElevationBorderBrush}" />
+ <Setter Property="BorderThickness" Value="1" />
+ </Style>
+ </ui:DataGrid.ColumnHeaderStyle>
+
+ <ui:DataGrid.CellStyle>
+ <Style TargetType="DataGridCell">
+ <Style.Triggers>
+ <Trigger Property="IsSelected" Value="True">
+ <Setter Property="Foreground" Value="White" />
+ <Setter Property="Background" Value="{DynamicResource PaletteDeepPurpleBrush}" />
+ </Trigger>
+ </Style.Triggers>
+ <Setter Property="Template">
+ <Setter.Value>
+ <ControlTemplate TargetType="DataGridCell">
+ <Border Background="{TemplateBinding Background}" Padding="6,0,6,0">
+ <ContentPresenter VerticalAlignment="Center" />
+ </Border>
+ </ControlTemplate>
+ </Setter.Value>
+ </Setter>
+ </Style>
+ </ui:DataGrid.CellStyle>
+
+ <ui:DataGrid.Columns>
+ <DataGridCheckBoxColumn Header="Enabled" Binding="{Binding Enabled}" Width="68" />
  <DataGridTextColumn Header="Name" Binding="{Binding Name}" IsReadOnly="True" />
- <DataGridTextColumn Header="Value" Binding="{Binding Value}" />
- </DataGrid.Columns>
- </DataGrid>
+ <DataGridTextColumn Header="Value" Binding="{Binding Value}" Width="*" />
+ </ui:DataGrid.Columns>
+ </ui:DataGrid>
 
  <StackPanel Grid.Row="2" Margin="0,16,0,0" Orientation="Horizontal">
  <ui:Button Icon="Add28" Content="Add new" Click="AddButton_Click" />