Eric Cornelissen
b85be454ce
* Update settings window layout with consistent margins Updated the layout of the different views of the settings window so that there is always margin at the bottom. In some cases this was achieved using <StackPanels> for clarity and extensibility, grouping e.g. a title and some radio options together with one unified margin. Also made some small consistency changes to the .xaml files. * Add width to Themes text input * Normalize margins in settings * Add default display values in Terminal settings ... for Arguments and Working Directory * Generalize TemplateSelector for empty strings * Add default display value for profile keybindings * Update margins and fontsize in theme preview * Update 'loading...' message in About ... to "Checking for updates..." and a spinner as suggested by @skipmeister123 * No popup when cancelling profile edit no changes * Delete profile when new and cancelled * Open new and cloned themes in edit mode ... and make it so canceling deletes the theme. * No popup when cancelling theme edit no changes * Add resources for margin definitions * Check for null Author in TerminalTheme * Add resource for header margin definition * Moved createdBy text to code behind
344 lines
21 KiB
XML
344 lines
21 KiB
XML
<Page
|
|
x:Class="FluentTerminal.App.Views.SettingsPages.ThemeSettings"
|
|
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
|
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
|
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
|
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
|
xmlns:viewmodels="using:FluentTerminal.App.ViewModels"
|
|
xmlns:views="using:FluentTerminal.App.Views"
|
|
mc:Ignorable="d">
|
|
<Grid x:Name="Root">
|
|
<Grid.Background>
|
|
<AcrylicBrush
|
|
BackgroundSource="HostBackdrop"
|
|
FallbackColor="{x:Bind ViewModel.SelectedTheme.Background, Mode=OneWay}"
|
|
TintColor="{x:Bind ViewModel.SelectedTheme.Background, Mode=OneWay}"
|
|
TintOpacity="{x:Bind ViewModel.BackgroundOpacity, Mode=OneWay}" />
|
|
</Grid.Background>
|
|
<Grid.ColumnDefinitions>
|
|
<ColumnDefinition Width="160" />
|
|
<ColumnDefinition Width="*" />
|
|
</Grid.ColumnDefinitions>
|
|
<Grid.RowDefinitions>
|
|
<RowDefinition Height="32" />
|
|
<RowDefinition Height="Auto" />
|
|
<RowDefinition Height="*" />
|
|
</Grid.RowDefinitions>
|
|
<Border
|
|
Grid.RowSpan="3"
|
|
Grid.Column="0"
|
|
Background="{ThemeResource SystemControlAcrylicWindowBrush}" />
|
|
<Grid Grid.Row="1" Grid.ColumnSpan="2" Margin="{StaticResource HeaderMargin}">
|
|
<Grid.ColumnDefinitions>
|
|
<ColumnDefinition Width="Auto" />
|
|
<ColumnDefinition Width="*" />
|
|
</Grid.ColumnDefinitions>
|
|
<TextBlock
|
|
Margin="0,10,0,0"
|
|
VerticalAlignment="Center"
|
|
FontSize="28"
|
|
Style="{StaticResource TitleTextBlockStyle}"
|
|
Text="Themes" />
|
|
<CommandBar
|
|
Grid.Column="1"
|
|
HorizontalAlignment="Right"
|
|
VerticalAlignment="Top"
|
|
Background="Transparent"
|
|
DefaultLabelPosition="Right"
|
|
Visibility="{x:Bind ViewModel.SelectedTheme.InEditMode, Mode=OneWay, Converter={StaticResource FalseToVisibleConverter}}">
|
|
<AppBarButton
|
|
Name="SetActiveButton"
|
|
Command="{x:Bind ViewModel.SelectedTheme.SetActiveCommand, Mode=OneWay}"
|
|
Icon="Accept"
|
|
IsEnabled="{Binding ViewModel.SelectedTheme.IsActive, Mode=OneWay, Converter={StaticResource NegateConverter}}"
|
|
Label="Set Active" />
|
|
<AppBarButton
|
|
Name="ExportButton"
|
|
Command="{x:Bind ViewModel.SelectedTheme.ExportCommand, Mode=OneWay}"
|
|
Label="Export">
|
|
<AppBarButton.Icon>
|
|
<FontIcon FontFamily="Segoe MDL2 Assets" Glyph="" />
|
|
</AppBarButton.Icon>
|
|
</AppBarButton>
|
|
<AppBarButton
|
|
Name="CloneButton"
|
|
Command="{x:Bind ViewModel.CloneCommand, Mode=OneWay}"
|
|
CommandParameter="{x:Bind ViewModel.SelectedTheme, Mode=OneWay}"
|
|
Icon="Copy"
|
|
Label="Clone" />
|
|
<AppBarButton
|
|
Name="EditButton"
|
|
Command="{x:Bind ViewModel.SelectedTheme.EditCommand, Mode=OneWay}"
|
|
Icon="Edit"
|
|
Label="Edit" />
|
|
<AppBarButton
|
|
Name="DeleteButton"
|
|
Command="{x:Bind ViewModel.SelectedTheme.DeleteCommand, Mode=OneWay}"
|
|
Icon="Delete"
|
|
Label="Delete" />
|
|
</CommandBar>
|
|
<CommandBar
|
|
Grid.Column="1"
|
|
HorizontalAlignment="Right"
|
|
VerticalAlignment="Top"
|
|
Background="Transparent"
|
|
DefaultLabelPosition="Right"
|
|
Visibility="{x:Bind ViewModel.SelectedTheme.InEditMode, Mode=OneWay, Converter={StaticResource TrueToVisibleConverter}}">
|
|
<AppBarButton
|
|
Name="SaveButton"
|
|
Command="{x:Bind ViewModel.SelectedTheme.SaveChangesCommand, Mode=OneWay}"
|
|
Icon="Save"
|
|
Label="Save" />
|
|
<AppBarButton
|
|
Name="CancelButton"
|
|
Command="{x:Bind ViewModel.SelectedTheme.CancelEditCommand, Mode=OneWay}"
|
|
Icon="Cancel"
|
|
Label="Cancel" />
|
|
</CommandBar>
|
|
</Grid>
|
|
<ScrollViewer
|
|
Grid.Row="2"
|
|
Grid.Column="0"
|
|
VerticalScrollBarVisibility="Auto">
|
|
<StackPanel Margin="{StaticResource ItemMargin}">
|
|
<ListView ItemsSource="{x:Bind ViewModel.Themes}" SelectedItem="{x:Bind ViewModel.SelectedTheme, Mode=TwoWay}">
|
|
<ListView.ItemTemplate>
|
|
<DataTemplate x:DataType="viewmodels:ThemeViewModel">
|
|
<Grid>
|
|
<Grid.ColumnDefinitions>
|
|
<ColumnDefinition Width="*" />
|
|
<ColumnDefinition Width="Auto" />
|
|
</Grid.ColumnDefinitions>
|
|
<TextBlock Grid.Column="0" Text="{x:Bind Name, Mode=OneWay}" />
|
|
<Viewbox
|
|
Grid.Column="1"
|
|
Width="16"
|
|
Height="16"
|
|
HorizontalAlignment="Right">
|
|
<SymbolIcon Symbol="Accept" Visibility="{x:Bind IsActive, Mode=OneWay, Converter={StaticResource TrueToVisibleConverter}}" />
|
|
</Viewbox>
|
|
</Grid>
|
|
</DataTemplate>
|
|
</ListView.ItemTemplate>
|
|
<ListView.ItemContainerStyle>
|
|
<Style TargetType="ListViewItem">
|
|
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
|
|
</Style>
|
|
</ListView.ItemContainerStyle>
|
|
</ListView>
|
|
<Button
|
|
Height="48"
|
|
Margin="0,12,0,0"
|
|
HorizontalAlignment="Stretch"
|
|
HorizontalContentAlignment="Left"
|
|
Background="Transparent"
|
|
Command="{x:Bind ViewModel.CreateThemeCommand}"
|
|
Style="{StaticResource ButtonRevealStyle}">
|
|
<Button.Content>
|
|
<StackPanel Orientation="Horizontal">
|
|
<Viewbox
|
|
Width="12"
|
|
Height="12"
|
|
Margin="0,0,6,0">
|
|
<SymbolIcon Symbol="Add" />
|
|
</Viewbox>
|
|
<TextBlock Style="{StaticResource CaptionTextBlockStyle}" Text="Create new" />
|
|
</StackPanel>
|
|
</Button.Content>
|
|
</Button>
|
|
<Button
|
|
Height="48"
|
|
Margin="0,0,0,0"
|
|
HorizontalAlignment="Stretch"
|
|
HorizontalContentAlignment="Left"
|
|
Background="Transparent"
|
|
Command="{x:Bind ViewModel.ImportThemeCommand}"
|
|
Style="{StaticResource ButtonRevealStyle}">
|
|
<Button.Content>
|
|
<StackPanel Orientation="Horizontal">
|
|
<Viewbox
|
|
Width="12"
|
|
Height="12"
|
|
Margin="0,0,6,0">
|
|
<SymbolIcon Symbol="OpenFile" />
|
|
</Viewbox>
|
|
<TextBlock Style="{StaticResource CaptionTextBlockStyle}" Text="Import" />
|
|
</StackPanel>
|
|
</Button.Content>
|
|
</Button>
|
|
</StackPanel>
|
|
</ScrollViewer>
|
|
|
|
<ContentControl
|
|
Grid.Row="2"
|
|
Grid.Column="1"
|
|
HorizontalContentAlignment="Stretch"
|
|
Content="{x:Bind ViewModel.SelectedTheme, Mode=TwoWay}"
|
|
RequestedTheme="{x:Bind ViewModel.SelectedTheme.Background, Mode=OneWay, Converter={StaticResource BackgroundToApplicationThemeConverter}}">
|
|
<ContentControl.ContentTemplate>
|
|
<DataTemplate x:DataType="viewmodels:ThemeViewModel">
|
|
<ScrollViewer VerticalScrollBarVisibility="Auto">
|
|
<StackPanel Margin="{StaticResource ContainerMargin}">
|
|
<!-- VIEW THEME -->
|
|
<TextBlock
|
|
Margin="{StaticResource ItemMargin}"
|
|
Style="{StaticResource SubtitleTextBlockStyle}"
|
|
Text="{x:Bind Name, Mode=OneWay}"
|
|
Visibility="{x:Bind InEditMode, Mode=OneWay, Converter={StaticResource FalseToVisibleConverter}}">
|
|
<TextBlock.Foreground>
|
|
<SolidColorBrush Color="{x:Bind Foreground, Mode=OneWay}" />
|
|
</TextBlock.Foreground>
|
|
</TextBlock>
|
|
|
|
<TextBlock
|
|
Margin="{StaticResource ItemMargin}"
|
|
FontSize="14"
|
|
Style="{StaticResource SubtitleTextBlockStyle}"
|
|
Text="{x:Bind Author, Mode=OneWay}"
|
|
Visibility="{x:Bind InEditMode, Mode=OneWay, Converter={StaticResource FalseToVisibleConverter}}">
|
|
<TextBlock.Foreground>
|
|
<SolidColorBrush Color="{x:Bind Foreground, Mode=OneWay}" />
|
|
</TextBlock.Foreground>
|
|
</TextBlock>
|
|
|
|
<!-- EDIT THEME -->
|
|
<TextBox
|
|
Width="200"
|
|
Margin="{StaticResource ItemMargin}"
|
|
HorizontalAlignment="Left"
|
|
Header="Name"
|
|
Text="{x:Bind Name, Mode=TwoWay}"
|
|
Visibility="{x:Bind InEditMode, Mode=OneWay, Converter={StaticResource TrueToVisibleConverter}}" />
|
|
|
|
<TextBox
|
|
Width="200"
|
|
Margin="{StaticResource ItemMargin}"
|
|
HorizontalAlignment="Left"
|
|
Header="Author"
|
|
Text="{x:Bind Author, Mode=TwoWay}"
|
|
Visibility="{x:Bind InEditMode, Mode=OneWay, Converter={StaticResource TrueToVisibleConverter}}" />
|
|
|
|
<Grid Margin="{StaticResource ItemMargin}">
|
|
<Grid.RowDefinitions>
|
|
<RowDefinition />
|
|
<RowDefinition />
|
|
<RowDefinition />
|
|
<RowDefinition />
|
|
<RowDefinition />
|
|
</Grid.RowDefinitions>
|
|
<Grid.Resources>
|
|
<Style TargetType="Border">
|
|
<Setter Property="Margin" Value="0,0,0,0" />
|
|
<Setter Property="Width" Value="24" />
|
|
<Setter Property="Height" Value="24" />
|
|
</Style>
|
|
</Grid.Resources>
|
|
<TextBlock Grid.Row="0" Text="Color palette" />
|
|
<TextBlock
|
|
Grid.Row="1"
|
|
Margin="0,0,0,8"
|
|
FontSize="14"
|
|
FontStyle="Italic"
|
|
Foreground="LightGray"
|
|
Text="Click on a color to edit"
|
|
Visibility="{x:Bind InEditMode, Mode=OneWay, Converter={StaticResource TrueToVisibleConverter}}" />
|
|
<StackPanel Grid.Row="2" Orientation="Horizontal">
|
|
<views:TerminalColorPicker
|
|
ColorName="Black"
|
|
EnableEditing="{x:Bind InEditMode, Mode=OneWay}"
|
|
SelectedColor="{x:Bind Black, Mode=TwoWay, Converter={StaticResource StringToColorConverter}, ConverterParameter=false}" />
|
|
<views:TerminalColorPicker
|
|
ColorName="Red"
|
|
EnableEditing="{x:Bind InEditMode, Mode=OneWay}"
|
|
SelectedColor="{x:Bind Red, Mode=TwoWay, Converter={StaticResource StringToColorConverter}, ConverterParameter=false}" />
|
|
<views:TerminalColorPicker
|
|
ColorName="Green"
|
|
EnableEditing="{x:Bind InEditMode, Mode=OneWay}"
|
|
SelectedColor="{x:Bind Green, Mode=TwoWay, Converter={StaticResource StringToColorConverter}, ConverterParameter=false}" />
|
|
<views:TerminalColorPicker
|
|
ColorName="Yellow"
|
|
EnableEditing="{x:Bind InEditMode, Mode=OneWay}"
|
|
SelectedColor="{x:Bind Yellow, Mode=TwoWay, Converter={StaticResource StringToColorConverter}, ConverterParameter=false}" />
|
|
<views:TerminalColorPicker
|
|
ColorName="Blue"
|
|
EnableEditing="{x:Bind InEditMode, Mode=OneWay}"
|
|
SelectedColor="{x:Bind Blue, Mode=TwoWay, Converter={StaticResource StringToColorConverter}, ConverterParameter=false}" />
|
|
<views:TerminalColorPicker
|
|
ColorName="Magenta"
|
|
EnableEditing="{x:Bind InEditMode, Mode=OneWay}"
|
|
SelectedColor="{x:Bind Magenta, Mode=TwoWay, Converter={StaticResource StringToColorConverter}, ConverterParameter=false}" />
|
|
<views:TerminalColorPicker
|
|
ColorName="Cyan"
|
|
EnableEditing="{x:Bind InEditMode, Mode=OneWay}"
|
|
SelectedColor="{x:Bind Cyan, Mode=TwoWay, Converter={StaticResource StringToColorConverter}, ConverterParameter=false}" />
|
|
<views:TerminalColorPicker
|
|
ColorName="White"
|
|
EnableEditing="{x:Bind InEditMode, Mode=OneWay}"
|
|
SelectedColor="{x:Bind White, Mode=TwoWay, Converter={StaticResource StringToColorConverter}, ConverterParameter=false}" />
|
|
</StackPanel>
|
|
<StackPanel Grid.Row="3" Orientation="Horizontal">
|
|
<views:TerminalColorPicker
|
|
ColorName="Bright Black"
|
|
EnableEditing="{x:Bind InEditMode, Mode=OneWay}"
|
|
SelectedColor="{x:Bind BrightBlack, Mode=TwoWay, Converter={StaticResource StringToColorConverter}, ConverterParameter=false}" />
|
|
<views:TerminalColorPicker
|
|
ColorName="Bright Red"
|
|
EnableEditing="{x:Bind InEditMode, Mode=OneWay}"
|
|
SelectedColor="{x:Bind BrightRed, Mode=TwoWay, Converter={StaticResource StringToColorConverter}, ConverterParameter=false}" />
|
|
<views:TerminalColorPicker
|
|
ColorName="Bright Green"
|
|
EnableEditing="{x:Bind InEditMode, Mode=OneWay}"
|
|
SelectedColor="{x:Bind BrightGreen, Mode=TwoWay, Converter={StaticResource StringToColorConverter}, ConverterParameter=false}" />
|
|
<views:TerminalColorPicker
|
|
ColorName="Bright Yellow"
|
|
EnableEditing="{x:Bind InEditMode, Mode=OneWay}"
|
|
SelectedColor="{x:Bind BrightYellow, Mode=TwoWay, Converter={StaticResource StringToColorConverter}, ConverterParameter=false}" />
|
|
<views:TerminalColorPicker
|
|
ColorName="Bright Blue"
|
|
EnableEditing="{x:Bind InEditMode, Mode=OneWay}"
|
|
SelectedColor="{x:Bind BrightBlue, Mode=TwoWay, Converter={StaticResource StringToColorConverter}, ConverterParameter=false}" />
|
|
<views:TerminalColorPicker
|
|
ColorName="Bright Magenta"
|
|
EnableEditing="{x:Bind InEditMode, Mode=OneWay}"
|
|
SelectedColor="{x:Bind BrightMagenta, Mode=TwoWay, Converter={StaticResource StringToColorConverter}, ConverterParameter=false}" />
|
|
<views:TerminalColorPicker
|
|
ColorName="Bright Cyan"
|
|
EnableEditing="{x:Bind InEditMode, Mode=OneWay}"
|
|
SelectedColor="{x:Bind BrightCyan, Mode=TwoWay, Converter={StaticResource StringToColorConverter}, ConverterParameter=false}" />
|
|
<views:TerminalColorPicker
|
|
ColorName="Bright White"
|
|
EnableEditing="{x:Bind InEditMode, Mode=OneWay}"
|
|
SelectedColor="{x:Bind BrightWhite, Mode=TwoWay, Converter={StaticResource StringToColorConverter}, ConverterParameter=false}" />
|
|
</StackPanel>
|
|
<StackPanel Grid.Row="4" Orientation="Horizontal">
|
|
<views:TerminalColorPicker
|
|
ColorName="Foreground"
|
|
EnableEditing="{x:Bind InEditMode, Mode=OneWay}"
|
|
SelectedColor="{x:Bind Foreground, Mode=TwoWay, Converter={StaticResource StringToColorConverter}, ConverterParameter=false}" />
|
|
<views:TerminalColorPicker
|
|
ColorName="Background"
|
|
EnableEditing="{x:Bind InEditMode, Mode=OneWay}"
|
|
SelectedColor="{x:Bind Background, Mode=TwoWay, Converter={StaticResource StringToColorConverter}, ConverterParameter=false}" />
|
|
<views:TerminalColorPicker
|
|
ColorName="Cursor"
|
|
EnableEditing="{x:Bind InEditMode, Mode=OneWay}"
|
|
SelectedColor="{x:Bind Cursor, Mode=TwoWay, Converter={StaticResource StringToColorConverter}, ConverterParameter=false}" />
|
|
<views:TerminalColorPicker
|
|
ColorName="Cursor Accent"
|
|
EnableEditing="{x:Bind InEditMode, Mode=OneWay}"
|
|
SelectedColor="{x:Bind CursorAccent, Mode=TwoWay, Converter={StaticResource StringToColorConverter}, ConverterParameter=false}" />
|
|
<views:TerminalColorPicker
|
|
ColorName="Selection"
|
|
EnableEditing="{x:Bind InEditMode, Mode=OneWay}"
|
|
IsAlphaEnabled="True"
|
|
SelectedColor="{x:Bind Selection, Mode=TwoWay, Converter={StaticResource StringToColorConverter}, ConverterParameter=true}" />
|
|
</StackPanel>
|
|
</Grid>
|
|
</StackPanel>
|
|
</ScrollViewer>
|
|
</DataTemplate>
|
|
</ContentControl.ContentTemplate>
|
|
</ContentControl>
|
|
</Grid>
|
|
</Page>
|