Wino-Mail/Wino.Mail.WinUI/Views/Settings/KeyboardShortcutsPage.xaml

<abstract:KeyboardShortcutsPageAbstract
    x:Class="Wino.Views.Settings.KeyboardShortcutsPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:abstract="using:Wino.Mail.WinUI.Views.Abstract"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:data="using:Wino.Core.ViewModels.Data"
    xmlns:domain="using:Wino.Core.Domain"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    x:Name="root"
    Title="{x:Bind domain:Translator.Settings_KeyboardShortcuts_Title}"
    mc:Ignorable="d">

    <!--  Main Content  -->
    <Grid Grid.Row="0">
        <!--  Shortcuts List  -->
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

        <StackPanel
            Grid.Row="0"
            Margin="0,0,0,12"
            Orientation="Horizontal">
            <Button
                Margin="0,0,8,0"
                Command="{x:Bind ViewModel.StartAddingShortcutCommand}"
                Content="{x:Bind domain:Translator.KeyboardShortcuts_Add}" />
            <Button
                Command="{x:Bind ViewModel.ResetToDefaultsCommand}"
                Content="{x:Bind domain:Translator.KeyboardShortcuts_ResetToDefaults}"
                Style="{ThemeResource AccentButtonStyle}" />
        </StackPanel>

        <ListView
            Grid.Row="1"
            ItemsSource="{x:Bind ViewModel.Shortcuts, Mode=OneWay}"
            SelectionMode="None">
            <ListView.ItemTemplate>
                <DataTemplate x:DataType="data:KeyboardShortcutViewModel">
                    <Border
                        Margin="0,4"
                        Padding="16,12"
                        Background="{ThemeResource CardBackgroundFillColorDefaultBrush}"
                        BorderBrush="{ThemeResource CardStrokeColorDefaultBrush}"
                        BorderThickness="1"
                        CornerRadius="4">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*" />
                                <ColumnDefinition Width="Auto" />
                                <ColumnDefinition Width="Auto" />
                                <ColumnDefinition Width="Auto" />
                            </Grid.ColumnDefinitions>

                            <StackPanel Grid.Column="0">
                                <TextBlock
                                    Margin="0,0,0,4"
                                    Style="{ThemeResource BodyStrongTextBlockStyle}"
                                    Text="{x:Bind MailOperationDisplayName}" />
                                <TextBlock
                                    Opacity="0.8"
                                    Style="{ThemeResource CaptionTextBlockStyle}"
                                    Text="{x:Bind DisplayName}" />
                            </StackPanel>

                            <Button
                                Grid.Column="2"
                                Margin="4,0"
                                Click="EditShortcut_Click"
                                CommandParameter="{x:Bind}"
                                Content="&#xE70F;"
                                FontFamily="Segoe MDL2 Assets"
                                Style="{ThemeResource SubtleButtonStyle}"
                                ToolTipService.ToolTip="Edit" />

                            <Button
                                Grid.Column="3"
                                Margin="4,0"
                                Click="DeleteShortcut_Click"
                                CommandParameter="{x:Bind}"
                                Content="&#xE74D;"
                                FontFamily="Segoe MDL2 Assets"
                                Style="{ThemeResource SubtleButtonStyle}"
                                ToolTipService.ToolTip="Delete" />
                        </Grid>
                    </Border>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </Grid>
</abstract:KeyboardShortcutsPageAbstract>