Fix top bar alignment (#1080)

SSWConsulting · Oct 11, 2024 · a53dfcb · a53dfcb
1 parent f0af700
commit a53dfcb
Showing 1 changed file with 14 additions and 10 deletions.
diff --git a/src/MobileUI/Resources/Styles/Templates.xaml b/src/MobileUI/Resources/Styles/Templates.xaml
@@ -5,25 +5,28 @@
                     xmlns:resolver="clr-namespace:Maui.Plugins.PageResolver;assembly=Maui.Plugins.PageResolver"
                     xmlns:vm="clr-namespace:SSW.Rewards.Mobile.ViewModels">
     <ControlTemplate x:Key="PageTemplate">
-        <Grid RowDefinitions="55,*"
+        <Grid RowDefinitions="60,*"
               Margin="0"
               Padding="0"
-              TranslationY="{OnPlatform iOS=-5, Default=0}">
+              TranslationY="{OnPlatform iOS=-10, Default=0}">
             <Grid.BindingContext>
                 <resolver:ResolveViewModel x:TypeArguments="vm:TopBarViewModel" />
             </Grid.BindingContext>
-            <Grid ColumnDefinitions="60,*,60"
-                  Margin="0"
+            <Grid Grid.Row="0"
+                  ColumnDefinitions="60,*,60"
+                  HeightRequest="60"
+                  Padding="10,5"
                   BackgroundColor="{StaticResource Background}"
+                  VerticalOptions="Start"
                   x:DataType="vm:TopBarViewModel">
                 <!-- Wrapping AvatarView in a Grid where IsVisible can be toggled to work around 
                      an odd animation that happens on iOS
                      See bug: https://github.com/SSWConsulting/SSW.Rewards.Mobile/issues/918 -->
                 <Grid Grid.Column="0"
                       IsVisible="{Binding ShowAvatar}"
-                      Margin="10,7,10,5"
                       HeightRequest="40"
-                      WidthRequest="40">
+                      WidthRequest="40"
+                      VerticalOptions="End">
                     <mct:AvatarView ImageSource="{Binding ProfilePic}"
                                     HeightRequest="40"
                                     WidthRequest="40"
@@ -44,12 +47,13 @@
                     CornerRadius="20"
                     MinimumHeightRequest="40"
                     MinimumWidthRequest="40"
+                    BorderWidth="2"
                     BorderColor="White"
                     BackgroundColor="{StaticResource SSWRed}"
-                    Margin="10,7,10,5"
                     Padding="0"
                     IsVisible="{Binding ShowBack}"
-                    Command="{Binding GoBackCommand}">
+                    Command="{Binding GoBackCommand}"
+                    VerticalOptions="End">
                     <Button.ImageSource>
                         <FontImageSource FontFamily="FluentIcons"
                                          Glyph="&#xf189;"
@@ -68,8 +72,8 @@
 
                 <ImageButton Grid.Column="2"
                              Command="{Binding OpenScannerCommand}"
-                             Margin="10,5"
-                             IsVisible="{Binding ShowScanner}">
+                             IsVisible="{Binding ShowScanner}"
+                             VerticalOptions="End">
                     <ImageButton.Source>
                         <FontImageSource FontFamily="FluentIcons"
                                          Glyph="&#xf636;"/>