Skip to content

Commit f3b7ff2

Browse files
carlos-zamoracarlos-zamora
committed
PRE-MERGE #19822 Update actions page and edit actions page with better alignment
2 parents 9c2a507 + 3dc426d commit f3b7ff2

File tree

3 files changed

+79
-46
lines changed

3 files changed

+79
-46
lines changed

‎src/cascadia/TerminalSettingsEditor/Actions.xaml‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -182,8 +182,7 @@
182182
</Page.Resources>
183183

184184
<Border MaxWidth="{StaticResource StandardControlMaxWidth}">
185-
<StackPanel MaxWidth="600"
186-
HorizontalAlignment="Left"
185+
<StackPanel HorizontalAlignment="Stretch"
187186
Spacing="8"
188187
Style="{StaticResource SettingsStackStyle}">
189188
<HyperlinkButton x:Uid="Actions_Disclaimer"

‎src/cascadia/TerminalSettingsEditor/EditAction.xaml‎

Lines changed: 74 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -157,24 +157,30 @@
157157
<Setter Property="Height" Value="{StaticResource EditButtonSize}" />
158158
<Setter Property="Width" Value="{StaticResource EditButtonSize}" />
159159
</Style>
160+
<Style x:Key="TextBlockGroupingStyle"
161+
BasedOn="{StaticResource BodyStrongTextBlockStyle}"
162+
TargetType="TextBlock">
163+
<Setter Property="MaxWidth" Value="{StaticResource StandardControlMaxWidth}" />
164+
<Setter Property="Margin" Value="0,0,0,4" />
165+
<Setter Property="FontSize" Value="16" />
166+
</Style>
160167

161168
<!-- Templates -->
162169
<DataTemplate x:Key="KeyChordTemplate"
163170
x:DataType="local:KeyChordViewModel">
164171
<ListViewItem IsTabStop="False"
165172
Style="{StaticResource KeyBindingContainerStyle}">
166-
<Grid Padding="2,0,2,0"
173+
<Grid Padding="-4,0,0,0"
167174
VerticalAlignment="Center">
168175
<Grid.ColumnDefinitions>
169176
<ColumnDefinition Width="Auto" />
170-
<ColumnDefinition Width="Auto" />
177+
<ColumnDefinition Width="*" />
171178
</Grid.ColumnDefinitions>
172179
<Button Grid.Column="0"
180+
Background="{ThemeResource AppBarItemBackgroundThemeBrush}"
173181
Click="{x:Bind ToggleEditMode}"
174-
Style="{ThemeResource KeyChordBorderStyle}"
175182
Visibility="{x:Bind mtu:Converters.InvertedBooleanToVisibility(IsInEditMode), Mode=OneWay}">
176183
<TextBlock FontSize="14"
177-
Style="{ThemeResource KeyChordTextBlockStyle}"
178184
Text="{x:Bind KeyChordText, Mode=OneWay}"
179185
TextWrapping="WrapWholeWords" />
180186
</Button>
@@ -214,6 +220,7 @@
214220
</Grid>
215221
<Button Grid.Column="1"
216222
Margin="8,0,0,0"
223+
HorizontalAlignment="Right"
217224
AutomationProperties.Name="{x:Bind DeleteButtonName}"
218225
Style="{StaticResource DeleteSmallButtonStyle}">
219226
<Button.Content>
@@ -243,13 +250,14 @@
243250
ColumnSpacing="8">
244251
<Grid.ColumnDefinitions>
245252
<ColumnDefinition Width="{StaticResource ArgumentNameWidth}" />
246-
<ColumnDefinition Width="Auto" />
253+
<ColumnDefinition Width="*" />
247254
</Grid.ColumnDefinitions>
248255
<TextBlock Grid.Column="0"
249256
VerticalAlignment="Center"
250257
Text="{x:Bind Name}"
251258
TextWrapping="WrapWholeWords" />
252259
<muxc:NumberBox Grid.Column="1"
260+
HorizontalAlignment="Stretch"
253261
AutomationProperties.Name="{x:Bind Name}"
254262
LargeChange="1"
255263
Maximum="100"
@@ -267,13 +275,14 @@
267275
ColumnSpacing="8">
268276
<Grid.ColumnDefinitions>
269277
<ColumnDefinition Width="{StaticResource ArgumentNameWidth}" />
270-
<ColumnDefinition Width="Auto" />
278+
<ColumnDefinition Width="*" />
271279
</Grid.ColumnDefinitions>
272280
<TextBlock Grid.Column="0"
273281
VerticalAlignment="Center"
274282
Text="{x:Bind Name}"
275283
TextWrapping="WrapWholeWords" />
276284
<muxc:NumberBox Grid.Column="1"
285+
HorizontalAlignment="Stretch"
277286
AutomationProperties.Name="{x:Bind Name}"
278287
LargeChange="1"
279288
Maximum="999"
@@ -291,13 +300,14 @@
291300
ColumnSpacing="8">
292301
<Grid.ColumnDefinitions>
293302
<ColumnDefinition Width="{StaticResource ArgumentNameWidth}" />
294-
<ColumnDefinition Width="Auto" />
303+
<ColumnDefinition Width="*" />
295304
</Grid.ColumnDefinitions>
296305
<TextBlock Grid.Column="0"
297306
VerticalAlignment="Center"
298307
Text="{x:Bind Name}"
299308
TextWrapping="WrapWholeWords" />
300309
<muxc:NumberBox Grid.Column="1"
310+
HorizontalAlignment="Stretch"
301311
AutomationProperties.Name="{x:Bind Name}"
302312
LargeChange="1"
303313
Maximum="999"
@@ -315,13 +325,14 @@
315325
ColumnSpacing="8">
316326
<Grid.ColumnDefinitions>
317327
<ColumnDefinition Width="{StaticResource ArgumentNameWidth}" />
318-
<ColumnDefinition Width="Auto" />
328+
<ColumnDefinition Width="*" />
319329
</Grid.ColumnDefinitions>
320330
<TextBlock Grid.Column="0"
321331
VerticalAlignment="Center"
322332
Text="{x:Bind Name}"
323333
TextWrapping="WrapWholeWords" />
324334
<muxc:NumberBox Grid.Column="1"
335+
HorizontalAlignment="Stretch"
325336
AutomationProperties.Name="{x:Bind Name}"
326337
LargeChange="1"
327338
Maximum="999"
@@ -339,13 +350,14 @@
339350
ColumnSpacing="8">
340351
<Grid.ColumnDefinitions>
341352
<ColumnDefinition Width="{StaticResource ArgumentNameWidth}" />
342-
<ColumnDefinition Width="Auto" />
353+
<ColumnDefinition Width="*" />
343354
</Grid.ColumnDefinitions>
344355
<TextBlock Grid.Column="0"
345356
VerticalAlignment="Center"
346357
Text="{x:Bind Name}"
347358
TextWrapping="WrapWholeWords" />
348359
<muxc:NumberBox Grid.Column="1"
360+
HorizontalAlignment="Stretch"
349361
AutomationProperties.Name="{x:Bind Name}"
350362
LargeChange="1"
351363
Maximum="999"
@@ -363,13 +375,14 @@
363375
ColumnSpacing="8">
364376
<Grid.ColumnDefinitions>
365377
<ColumnDefinition Width="{StaticResource ArgumentNameWidth}" />
366-
<ColumnDefinition Width="Auto" />
378+
<ColumnDefinition Width="*" />
367379
</Grid.ColumnDefinitions>
368380
<TextBlock Grid.Column="0"
369381
VerticalAlignment="Center"
370382
Text="{x:Bind Name}"
371383
TextWrapping="WrapWholeWords" />
372384
<muxc:NumberBox Grid.Column="1"
385+
HorizontalAlignment="Stretch"
373386
AutomationProperties.Name="{x:Bind Name}"
374387
LargeChange="0.2"
375388
Maximum="1"
@@ -387,7 +400,7 @@
387400
ColumnSpacing="8">
388401
<Grid.ColumnDefinitions>
389402
<ColumnDefinition Width="{StaticResource ArgumentNameWidth}" />
390-
<ColumnDefinition Width="Auto"
403+
<ColumnDefinition Width="*"
391404
MinWidth="196" />
392405
</Grid.ColumnDefinitions>
393406
<TextBlock Grid.Column="0"
@@ -408,13 +421,14 @@
408421
ColumnSpacing="8">
409422
<Grid.ColumnDefinitions>
410423
<ColumnDefinition Width="{StaticResource ArgumentNameWidth}" />
411-
<ColumnDefinition Width="Auto" />
424+
<ColumnDefinition Width="*" />
412425
</Grid.ColumnDefinitions>
413426
<TextBlock Grid.Column="0"
414427
VerticalAlignment="Center"
415428
Text="{x:Bind Name}"
416429
TextWrapping="WrapWholeWords" />
417430
<ComboBox Grid.Column="1"
431+
HorizontalAlignment="Stretch"
418432
AutomationProperties.Name="{x:Bind Name}"
419433
ItemTemplate="{StaticResource EnumComboBoxTemplate}"
420434
ItemsSource="{x:Bind EnumList, Mode=OneWay}"
@@ -482,13 +496,14 @@
482496
ColumnSpacing="8">
483497
<Grid.ColumnDefinitions>
484498
<ColumnDefinition Width="{StaticResource ArgumentNameWidth}" />
485-
<ColumnDefinition Width="Auto" />
499+
<ColumnDefinition Width="*" />
486500
</Grid.ColumnDefinitions>
487501
<TextBlock Grid.Column="0"
488502
VerticalAlignment="Center"
489503
Text="{x:Bind Name}"
490504
TextWrapping="WrapWholeWords" />
491505
<ToggleSwitch Grid.Column="1"
506+
HorizontalAlignment="Right"
492507
AutomationProperties.Name="{x:Bind Name}"
493508
IsOn="{x:Bind UnboxBool(Value), Mode=TwoWay, BindBack=BoolOptionalBindBack}" />
494509
</Grid>
@@ -501,13 +516,15 @@
501516
ColumnSpacing="8">
502517
<Grid.ColumnDefinitions>
503518
<ColumnDefinition Width="{StaticResource ArgumentNameWidth}" />
504-
<ColumnDefinition Width="Auto" />
519+
<ColumnDefinition Width="*" />
505520
</Grid.ColumnDefinitions>
506521
<TextBlock Grid.Column="0"
507522
VerticalAlignment="Center"
508523
Text="{x:Bind Name}"
509524
TextWrapping="WrapWholeWords" />
510525
<CheckBox Grid.Column="1"
526+
Margin="0,0,-96,0"
527+
HorizontalAlignment="Right"
511528
AutomationProperties.Name="{x:Bind Name}"
512529
IsChecked="{x:Bind UnboxBoolOptional(Value), Mode=TwoWay, BindBack=BoolOptionalBindBack}"
513530
IsThreeState="True" />
@@ -526,13 +543,14 @@
526543
ColumnSpacing="8">
527544
<Grid.ColumnDefinitions>
528545
<ColumnDefinition Width="{StaticResource ArgumentNameWidth}" />
529-
<ColumnDefinition Width="Auto" />
546+
<ColumnDefinition Width="*" />
530547
</Grid.ColumnDefinitions>
531548
<TextBlock Grid.Column="0"
532549
VerticalAlignment="Center"
533550
Text="{x:Bind Name}"
534551
TextWrapping="WrapWholeWords" />
535552
<ComboBox Grid.Column="1"
553+
HorizontalAlignment="Stretch"
536554
AutomationProperties.Name="{x:Bind Name}"
537555
ItemTemplate="{StaticResource EnumComboBoxTemplate}"
538556
ItemsSource="{x:Bind EnumList, Mode=OneWay}"
@@ -572,7 +590,7 @@
572590
TextWrapping="WrapWholeWords" />
573591
<ItemsControl Grid.Column="1"
574592
Margin="0"
575-
HorizontalAlignment="Left"
593+
HorizontalAlignment="Right"
576594
AutomationProperties.Name="{x:Bind Name}"
577595
ItemTemplate="{StaticResource FlagItemTemplate}"
578596
ItemsSource="{x:Bind FlagList, Mode=OneWay}" />
@@ -586,7 +604,7 @@
586604
ColumnSpacing="8">
587605
<Grid.ColumnDefinitions>
588606
<ColumnDefinition Width="{StaticResource ArgumentNameWidth}" />
589-
<ColumnDefinition Width="Auto" />
607+
<ColumnDefinition Width="*" />
590608
</Grid.ColumnDefinitions>
591609
<TextBlock Grid.Column="0"
592610
VerticalAlignment="Center"
@@ -608,7 +626,7 @@
608626
ColumnSpacing="8">
609627
<Grid.ColumnDefinitions>
610628
<ColumnDefinition Width="{StaticResource ArgumentNameWidth}" />
611-
<ColumnDefinition Width="Auto" />
629+
<ColumnDefinition Width="*" />
612630
</Grid.ColumnDefinitions>
613631
<TextBlock Grid.Column="0"
614632
VerticalAlignment="Center"
@@ -646,76 +664,88 @@
646664

647665
<Border MaxWidth="{StaticResource StandardControlMaxWidth}"
648666
Margin="{StaticResource SettingStackMargin}">
649-
<Grid MaxWidth="600"
650-
Margin="{StaticResource SettingStackMargin}"
651-
HorizontalAlignment="Left"
667+
<Grid Margin="{StaticResource SettingStackMargin}"
668+
HorizontalAlignment="Stretch"
652669
ColumnSpacing="16"
653-
RowSpacing="8">
670+
RowSpacing="16">
654671
<Grid.RowDefinitions>
655672
<RowDefinition Height="Auto" />
656673
<RowDefinition Height="Auto" />
657674
<RowDefinition Height="Auto" />
658675
<RowDefinition Height="Auto" />
659676
<RowDefinition Height="Auto" />
677+
<RowDefinition Height="Auto" />
678+
<RowDefinition Height="Auto" />
679+
<RowDefinition Height="Auto" />
660680
</Grid.RowDefinitions>
661681
<Grid.ColumnDefinitions>
662682
<ColumnDefinition Width="Auto" />
663683
<ColumnDefinition Width="*" />
664684
</Grid.ColumnDefinitions>
665-
<TextBlock x:Uid="Actions_Name"
685+
<TextBlock x:Uid="Actions_CommandDetails"
666686
Grid.Row="0"
667687
Grid.Column="0"
688+
VerticalAlignment="Center"
689+
Style="{StaticResource TextBlockGroupingStyle}" />
690+
<TextBlock x:Uid="Actions_Name"
691+
Grid.Row="1"
692+
Grid.Column="0"
668693
VerticalAlignment="Center" />
669694
<TextBox x:Name="CommandNameTextBox"
670-
Grid.Row="0"
695+
Grid.Row="1"
671696
Grid.Column="1"
672-
Width="300"
673-
HorizontalAlignment="Left"
697+
HorizontalAlignment="Stretch"
674698
AutomationProperties.Name="{x:Bind ViewModel.ActionNameTextBoxAutomationPropName}"
675699
PlaceholderText="{x:Bind ViewModel.DisplayName, Mode=OneWay}"
676700
Text="{x:Bind ViewModel.Name, Mode=TwoWay}" />
677701
<TextBlock x:Uid="Actions_ShortcutAction"
678-
Grid.Row="1"
702+
Grid.Row="2"
679703
Grid.Column="0"
680704
VerticalAlignment="Center" />
681705
<AutoSuggestBox x:Name="ShortcutActionBox"
682-
Grid.Row="1"
706+
Grid.Row="2"
683707
Grid.Column="1"
684708
VerticalAlignment="Center"
685709
AutomationProperties.Name="{x:Bind ViewModel.ShortcutActionComboBoxAutomationPropName}"
686710
GotFocus="ShortcutActionBox_GotFocus"
687711
QuerySubmitted="ShortcutActionBox_QuerySubmitted"
688712
SuggestionChosen="ShortcutActionBox_SuggestionChosen"
689713
TextChanged="ShortcutActionBox_TextChanged" />
690-
<TextBlock x:Uid="Actions_Arguments"
691-
Grid.Row="2"
692-
Grid.Column="0"
693-
VerticalAlignment="Center"
694-
Visibility="{x:Bind ViewModel.ActionArgsVM.HasArgs, Mode=OneWay}" />
695-
<ItemsControl Grid.Row="2"
696-
Grid.Column="1"
697-
AutomationProperties.Name="{x:Bind ViewModel.AdditionalArgumentsControlAutomationPropName}"
698-
IsTabStop="False"
699-
ItemTemplateSelector="{StaticResource ArgsTemplateSelector}"
700-
ItemsSource="{x:Bind ViewModel.ActionArgsVM.ArgValues, Mode=OneWay}" />
701714
<TextBlock x:Uid="Actions_Keybindings"
702715
Grid.Row="3"
703716
Grid.Column="0"
704-
VerticalAlignment="Center" />
717+
VerticalAlignment="Center"
718+
Style="{StaticResource TextBlockGroupingStyle}" />
705719
<ListView x:Name="KeyChordListView"
706720
x:Uid="Actions_KeyBindingsListView"
707-
Grid.Row="3"
708-
Grid.Column="1"
721+
Grid.Row="4"
722+
Grid.Column="0"
723+
Grid.ColumnSpan="2"
709724
ItemTemplate="{StaticResource KeyChordTemplate}"
710725
ItemsSource="{x:Bind ViewModel.KeyChordList, Mode=OneWay}"
711726
SelectionMode="None">
712727
<ListView.Header>
713-
<Button Click="{x:Bind ViewModel.AddKeybinding_Click}">
728+
<Button Margin="0,0,0,4"
729+
Click="{x:Bind ViewModel.AddKeybinding_Click}">
714730
<TextBlock x:Uid="Actions_AddKeyChord" />
715731
</Button>
716732
</ListView.Header>
717733
</ListView>
718-
<Button Grid.Row="4"
734+
<TextBlock x:Uid="Actions_Arguments"
735+
Grid.Row="5"
736+
Grid.Column="0"
737+
VerticalAlignment="Center"
738+
Style="{StaticResource TextBlockGroupingStyle}"
739+
Visibility="{x:Bind ViewModel.ActionArgsVM.HasArgs, Mode=OneWay}" />
740+
<ItemsControl Grid.Row="6"
741+
Grid.Column="0"
742+
Grid.ColumnSpan="2"
743+
HorizontalAlignment="Stretch"
744+
AutomationProperties.Name="{x:Bind ViewModel.AdditionalArgumentsControlAutomationPropName}"
745+
IsTabStop="False"
746+
ItemTemplateSelector="{StaticResource ArgsTemplateSelector}"
747+
ItemsSource="{x:Bind ViewModel.ActionArgsVM.ArgValues, Mode=OneWay}" />
748+
<Button Grid.Row="7"
719749
Grid.Column="0"
720750
IsEnabled="{x:Bind ViewModel.IsUserAction, Mode=OneWay}"
721751
Style="{StaticResource DeleteButtonStyle}">

0 commit comments

Comments
 (0)
⚡