Updated Delete account view UI (#1692)

src/Android/Resources/drawable/ic_warning.xml

@@ -4,6 +4,6 @@
     android:viewportWidth="22"
     android:viewportHeight="19">
     <path
-        android:fillColor="#175DDC"
+        android:fillColor="#dd4b39"
         android:pathData="M19.16 18.71H2.64c-0.36 0-0.72-0.09-1.03-0.27c-0.31-0.2-0.57-0.46-0.74-0.78c-0.18-0.32-0.27-0.67-0.27-1.04c0-0.36 0.1-0.72 0.28-1.03L9.14 1.1C9.32 0.76 9.58 0.5 9.89 0.32c0.3-0.18 0.65-0.28 1-0.28c0.36 0 0.7 0.1 1.02 0.28c0.3 0.18 0.56 0.44 0.74 0.75l8.26 14.51c0.18 0.31 0.28 0.67 0.28 1.03c0 0.37-0.09 0.72-0.26 1.04c-0.18 0.32-0.44 0.59-0.75 0.78c-0.31 0.18-0.66 0.28-1.02 0.27zM10.9 1.38c-0.13 0-0.26 0.04-0.38 0.1c-0.11 0.07-0.2 0.16-0.27 0.28L1.99 16.27c-0.07 0.11-0.1 0.24-0.1 0.36C1.9 16.76 1.92 16.9 2 17c0.06 0.12 0.16 0.22 0.27 0.3c0.12 0.06 0.25 0.1 0.38 0.1h16.52c0.13 0 0.26-0.04 0.37-0.1c0.12-0.08 0.21-0.18 0.28-0.3c0.06-0.1 0.1-0.23 0.1-0.36c0-0.12-0.04-0.25-0.1-0.36l-8.26-14.5c-0.07-0.13-0.17-0.22-0.28-0.29c-0.11-0.06-0.24-0.1-0.37-0.1zm0 11.42c-0.17 0-0.34-0.07-0.46-0.2c-0.12-0.12-0.19-0.29-0.19-0.46v-6.1c0-0.18 0.07-0.35 0.2-0.47c0.11-0.13 0.28-0.2 0.45-0.2c0.17 0 0.33 0.07 0.45 0.2c0.12 0.12 0.19 0.3 0.19 0.47v6.1c0 0.17-0.07 0.34-0.19 0.47c-0.12 0.12-0.28 0.2-0.45 0.2zm0 3.3c0.42 0 0.76-0.36 0.76-0.8c0-0.43-0.34-0.78-0.76-0.78c-0.43 0-0.77 0.35-0.77 0.79c0 0.43 0.34 0.79 0.77 0.79z"/>
 </vector>

src/App/Pages/Accounts/DeleteAccountPage.xaml

@@ -15,42 +15,67 @@
         <ToolbarItem Text="{u:I18n Close}" Clicked="Close_Clicked" Order="Primary" Priority="-1" />
     </ContentPage.ToolbarItems>
 
+    <ContentPage.Resources>
+        <Style TargetType="Label" x:Key="lblDescription">
+           <Setter Property="FontSize" Value="{OnPlatform Android=Large, iOS=Small}" />
+        </Style>
+    </ContentPage.Resources>
+
     <ContentPage.Content>
-        <StackLayout Padding="20, 30" Spacing="0">
+        <Grid Padding="20, 30" RowSpacing="0">
+            <Grid.RowDefinitions>
+                <RowDefinition Height="Auto" />
+                <RowDefinition Height="Auto" />
+                <RowDefinition Height="Auto" />
+                <RowDefinition Height="*" />
+            </Grid.RowDefinitions>
+            <Grid.ColumnDefinitions>
+                <ColumnDefinition Width="Auto" />
+                <ColumnDefinition Width="*" />
+            </Grid.ColumnDefinitions>
             <Image
                 Source="ic_warning"
                 WidthRequest="28"
                 HeightRequest="25"
                 HorizontalOptions="Start" />
             <Label
+                Grid.Row="1"
+                Grid.ColumnSpan="2"
                 Text="{u:I18n DeletingYourAccountIsPermanent}"
                 HorizontalOptions="Start"
-                StyleClass="text-body"
+                StyleClass="title-danger"
                 Margin="0,15,0,0"/>
             <Label
+                Grid.Row="2"
+                Grid.ColumnSpan="2"
                 Text="{u:I18n DeleteAccountExplanation}"
+                Style="{StaticResource lblDescription}"
                 HorizontalOptions="Start"
                 Margin="0,6,50,0"
                 Opacity="0.6" />
             <Button
-                Text="{u:I18n Cancel}"
+                Grid.Row="3"
-                StyleClass="btn-primary"
-                HorizontalOptions="Start"
-                Margin="0,26,0,0"
-                Padding="16,6"
-                CornerRadius="2"
-                TextTransform="Uppercase"
-                Clicked="Close_Clicked" />
-            <Button
                 Text="{u:I18n DeleteAccount}"
-                StyleClass="btn-secondary"
+                StyleClass="btn-danger"
-                TextColor="#99000000"
                 HorizontalOptions="Start"
-                Margin="0,12,0,0"
+                VerticalOptions="Start"
-                Padding="16,6"
+                Margin="0,20,0,0"
+                Padding="16,0"
                 CornerRadius="2"
                 TextTransform="Uppercase"
                 Clicked="DeleteAccount_Clicked"/>
-        </StackLayout>
+            <Button
+                Grid.Row="3"
+                Grid.Column="1"
+                Text="{u:I18n Cancel}"
+                StyleClass="btn-secondary"
+                HorizontalOptions="Start"
+                VerticalOptions="Start"
+                Margin="0,20,0,0"
+                Padding="16,0"
+                CornerRadius="2"
+                TextTransform="Uppercase"
+                Clicked="Close_Clicked" />
+        </Grid>
     </ContentPage.Content>
 </pages:BaseContentPage>

src/App/Styles/Android.xaml

@@ -161,7 +161,39 @@
         <Setter Property="BorderWidth" 
                 Value="1" />
         <Setter Property="TextColor"
-                Value="{DynamicResource ButtonTextColor}" />
+                Value="{DynamicResource ButtonTextColorOpacity}" />
+        <Setter Property="FontSize"
+                Value="Medium" />
+        <Setter Property="CornerRadius"
+                Value="5" />
+        <Setter Property="VisualStateManager.VisualStateGroups">
+            <VisualStateGroupList>
+                <VisualStateGroup x:Name="CommonStates">
+                    <VisualState x:Name="Normal" />
+                    <VisualState x:Name="Disabled">
+                        <VisualState.Setters>
+                            <Setter Property="TextColor"
+                                    Value="{DynamicResource ButtonTextColorDisabled}" />
+                            <Setter Property="BackgroundColor"
+                                    Value="{DynamicResource ButtonBackgroundColorDisabled}" />
+                            <Setter Property="BorderColor"
+                                    Value="{DynamicResource ButtonBackgroundColorDisabled}" />
+                        </VisualState.Setters>
+                    </VisualState>
+                </VisualStateGroup>
+            </VisualStateGroupList>
+        </Setter>
+    </Style>
+    <Style TargetType="Button"
+           Class="btn-danger">
+        <Setter Property="BackgroundColor"
+                Value="{DynamicResource DangerColor}" />
+        <Setter Property="BorderColor"
+                Value="{DynamicResource DangerColor}" />
+        <Setter Property="BorderWidth" 
+                Value="1" />
+        <Setter Property="TextColor"
+                Value="{DynamicResource ButtonPrimaryTextColor}" />
         <Setter Property="FontSize"
                 Value="Medium" />
         <Setter Property="CornerRadius"
@@ -288,4 +320,13 @@
         <Setter Property="FontSize"
                 Value="25" />
     </Style>
+
+    <Style TargetType="Label"
+           ApplyToDerivedTypes="True"
+           Class="title-danger">
+        <Setter Property="TextColor"
+                Value="{DynamicResource DangerColor}" />
+        <Setter Property="FontSize"
+                Value="Title" />
+    </Style>
 </ResourceDictionary>

src/App/Styles/Black.xaml

@@ -13,6 +13,7 @@
     <Color x:Key="PasswordSpecialColor">#ff7c70</Color>
     <Color x:Key="ButtonColor">#e0e0e0</Color>
     <Color x:Key="InputPlaceholderColor">#707070</Color>
+    <Color x:Key="DangerPressedColor">#ff715e</Color>
 
     <Color x:Key="BackgroundColor">#000000</Color>
     <Color x:Key="SplashBackgroundColor">#000000</Color>
@@ -57,6 +58,7 @@
     <Color x:Key="ButtonBorderColor">#898989</Color>
     <Color x:Key="ButtonTextColor">#ffffff</Color>
     <Color x:Key="ButtonTextColorDisabled">#aaaaaa</Color>
+    <Color x:Key="ButtonTextColorOpacity">#99ffffff</Color>
 
     <Color x:Key="FabColor">#52bdfb</Color>
     <Color x:Key="FabPressedColor">#3ea1da</Color>

src/App/Styles/Dark.xaml

@@ -13,6 +13,7 @@
     <Color x:Key="PasswordSpecialColor">#ff7c70</Color>
     <Color x:Key="ButtonColor">#e0e0e0</Color>
     <Color x:Key="InputPlaceholderColor">#707070</Color>
+    <Color x:Key="DangerPressedColor">#ff715e</Color>
 
     <Color x:Key="BackgroundColor">#303030</Color>
     <Color x:Key="SplashBackgroundColor">#222222</Color>
@@ -57,6 +58,7 @@
     <Color x:Key="ButtonBorderColor">#898989</Color>
     <Color x:Key="ButtonTextColor">#ffffff</Color>
     <Color x:Key="ButtonTextColorDisabled">#aaaaaa</Color>
+    <Color x:Key="ButtonTextColorOpacity">#99ffffff</Color>
 
     <Color x:Key="FabColor">#52bdfb</Color>
     <Color x:Key="FabPressedColor">#3ea1da</Color>

src/App/Styles/Light.xaml

@@ -13,6 +13,7 @@
     <Color x:Key="PasswordSpecialColor">#c40800</Color>
     <Color x:Key="ButtonColor">#175DDC</Color>
     <Color x:Key="InputPlaceholderColor">#d0d0d0</Color>
+    <Color x:Key="DangerPressedColor">#9a0007</Color>
 
     <Color x:Key="BackgroundColor">#ffffff</Color>
     <Color x:Key="SplashBackgroundColor">#ffffff</Color>
@@ -57,6 +58,7 @@
     <Color x:Key="ButtonBorderColor">#aaaaaa</Color>
     <Color x:Key="ButtonTextColor">#000000</Color>
     <Color x:Key="ButtonTextColorDisabled">#aaaaaa</Color>
+    <Color x:Key="ButtonTextColorOpacity">#99000000</Color>
 
     <Color x:Key="FabColor">#175DDC</Color>
     <Color x:Key="FabPressedColor">#3883af</Color>

src/App/Styles/Nord.xaml

@@ -13,6 +13,7 @@
     <Color x:Key="PasswordSpecialColor">#d08770</Color>
     <Color x:Key="ButtonColor">#d8dee9</Color>
     <Color x:Key="InputPlaceholderColor">#7b88a1</Color>
+    <Color x:Key="DangerPressedColor">#953C44</Color>
 
     <Color x:Key="BackgroundColor">#3b4252</Color>
     <Color x:Key="SplashBackgroundColor">#2e3440</Color>
@@ -57,6 +58,7 @@
     <Color x:Key="ButtonBorderColor">#5E6A82</Color>
     <Color x:Key="ButtonTextColor">#e5e9f0</Color>
     <Color x:Key="ButtonTextColorDisabled">#aaaaaa</Color>
+    <Color x:Key="ButtonTextColorOpacity">#99e5e9f0</Color>
 
     <Color x:Key="FabColor">#81a1c1</Color>
     <Color x:Key="FabPressedColor">#81a1c1</Color>

src/App/Styles/iOS.xaml

@@ -181,7 +181,7 @@
         <Setter Property="BorderWidth" 
                 Value="1" />
         <Setter Property="TextColor"
-                Value="{DynamicResource ButtonTextColor}" />
+                Value="{DynamicResource ButtonTextColorOpacity}" />
         <Setter Property="FontSize"
                 Value="Medium" />
         <Setter Property="CornerRadius"
@@ -210,6 +210,44 @@
             </VisualStateGroupList>
         </Setter>
     </Style>
+    <Style TargetType="Button"
+           Class="btn-danger">
+        <Setter Property="BackgroundColor"
+                Value="{DynamicResource DangerColor}" />
+        <Setter Property="BorderColor"
+                Value="{DynamicResource DangerColor}" />
+        <Setter Property="BorderWidth" 
+                Value="1" />
+        <Setter Property="TextColor"
+                Value="{DynamicResource ButtonPrimaryTextColor}" />
+        <Setter Property="FontSize"
+                Value="Medium" />
+        <Setter Property="CornerRadius"
+                Value="5" />
+        <Setter Property="VisualStateManager.VisualStateGroups">
+            <VisualStateGroupList>
+                <VisualStateGroup x:Name="CommonStates">
+                    <VisualState x:Name="Normal" />
+                    <VisualState x:Name="Pressed">
+                        <VisualState.Setters>
+                            <Setter Property="BackgroundColor" 
+                                    Value="{DynamicResource DangerPressedColor}" />
+                        </VisualState.Setters>
+                    </VisualState>
+                    <VisualState x:Name="Disabled">
+                        <VisualState.Setters>
+                            <Setter Property="TextColor"
+                                    Value="{DynamicResource ButtonTextColorDisabled}" />
+                            <Setter Property="BackgroundColor"
+                                    Value="{DynamicResource ButtonBackgroundColorDisabled}" />
+                            <Setter Property="BorderColor"
+                                    Value="{DynamicResource ButtonBackgroundColorDisabled}" />
+                        </VisualState.Setters>
+                    </VisualState>
+                </VisualStateGroup>
+            </VisualStateGroupList>
+        </Setter>
+    </Style>
     <Style TargetType="Button"
            ApplyToDerivedTypes="True"
            Class="btn-icon-platform">
@@ -307,4 +345,13 @@
         <Setter Property="Padding"
                 Value="0, 10, 0, 5" />
     </Style>
+
+    <Style TargetType="Label"
+           ApplyToDerivedTypes="True"
+           Class="title-danger">
+        <Setter Property="TextColor"
+                Value="{DynamicResource DangerColor}" />
+        <Setter Property="FontSize"
+                Value="Medium" />
+    </Style>
 </ResourceDictionary>

src/iOS/Resources/Assets.xcassets/ic_warning.imageset/Contents.json

@@ -1,7 +1,7 @@
 {
   "images": [
     {
-      "filename": "ic_warning.pdf",
+      "filename": "ic_warning-1.pdf",
       "idiom": "universal"
     },
     {

src/iOS/Resources/Assets.xcassets/ic_warning.imageset/ic_warning-1.pdf

@@ -0,0 +1,119 @@
+%PDF-1.7
+
+1 0 obj
+  << >>
+endobj
+
+2 0 obj
+  << /Length 3 0 R >>
+stream
+/DeviceRGB CS
+/DeviceRGB cs
+q
+1.000000 0.000000 -0.000000 1.000000 0.000000 -0.004333 cm
+0.866667 0.294118 0.223529 scn
+24.979254 0.004448 m
+2.740886 0.004448 l
+2.256652 0.000004 1.780215 0.127985 1.360950 0.376835 c
+0.941685 0.625685 0.595185 0.983850 0.356966 1.415783 c
+0.120480 1.834383 -0.003394 2.309866 0.000071 2.793346 c
+0.003536 3.276825 0.132607 3.750528 0.374291 4.165575 c
+11.493476 23.511885 l
+11.737758 23.932262 12.084259 24.279764 12.499193 24.521503 c
+12.914126 24.763245 13.382767 24.890335 13.860070 24.890335 c
+14.337375 24.890335 14.806015 24.763245 15.220948 24.521503 c
+15.635882 24.279764 15.982384 23.932262 16.226665 23.511885 c
+27.345852 4.165575 l
+27.587534 3.750528 27.717470 3.276825 27.720068 2.793346 c
+27.722668 2.309866 27.599663 1.834383 27.363176 1.415783 c
+27.124958 0.983850 26.778458 0.624796 26.359192 0.376835 c
+25.939928 0.128874 25.463488 0.000004 24.979254 0.004448 c
+24.979254 0.004448 l
+h
+13.860070 23.111946 m
+13.684222 23.114613 13.510106 23.069286 13.356780 22.981300 c
+13.203454 22.893314 13.075248 22.764446 12.985158 22.608913 c
+1.867706 3.262606 l
+1.782813 3.116850 1.737768 2.949764 1.737768 2.780014 c
+1.737768 2.610262 1.782813 2.443178 1.867706 2.297422 c
+1.956063 2.138336 2.084268 2.006802 2.239327 1.916149 c
+2.394386 1.825497 2.570235 1.779282 2.747816 1.781948 c
+24.979254 1.781948 l
+25.157701 1.779282 25.333551 1.825497 25.487745 1.916149 c
+25.641937 2.006802 25.771009 2.138336 25.859367 2.297422 c
+25.944260 2.443178 25.989302 2.610262 25.989302 2.780014 c
+25.989302 2.949764 25.944260 3.116850 25.859367 3.262606 c
+14.734983 22.608913 l
+14.644894 22.764446 14.516687 22.892426 14.363361 22.981300 c
+14.210035 23.070175 14.035919 23.114613 13.860070 23.111946 c
+13.860070 23.111946 l
+h
+13.860070 7.887661 m
+13.630514 7.887661 13.409620 7.980980 13.247631 8.148064 c
+13.085643 8.315149 12.993821 8.540892 12.993821 8.776411 c
+12.993821 16.904917 l
+12.993821 17.140434 13.084776 17.367065 13.247631 17.533262 c
+13.410486 17.699459 13.630514 17.793667 13.860070 17.793667 c
+14.089627 17.793667 14.310521 17.700348 14.472510 17.533262 c
+14.634499 17.366177 14.726320 17.140434 14.726320 16.904917 c
+14.726320 8.776411 l
+14.726320 8.540892 14.635365 8.314260 14.472510 8.148064 c
+14.309655 7.981867 14.089627 7.887661 13.860070 7.887661 c
+h
+13.860070 3.493681 m
+14.427464 3.493681 14.887444 3.965607 14.887444 4.547737 c
+14.887444 5.129869 14.427464 5.601795 13.860070 5.601795 c
+13.292677 5.601795 12.832698 5.129869 12.832698 4.547737 c
+12.832698 3.965607 13.292677 3.493681 13.860070 3.493681 c
+h
+f
+n
+Q
+
+endstream
+endobj
+
+3 0 obj
+  2568
+endobj
+
+4 0 obj
+  << /Annots []
+     /Type /Page
+     /MediaBox [ 0.000000 0.000000 27.720123 24.886002 ]
+     /Resources 1 0 R
+     /Contents 2 0 R
+     /Parent 5 0 R
+  >>
+endobj
+
+5 0 obj
+  << /Kids [ 4 0 R ]
+     /Count 1
+     /Type /Pages
+  >>
+endobj
+
+6 0 obj
+  << /Pages 5 0 R
+     /Type /Catalog
+  >>
+endobj
+
+xref
+0 7
+0000000000 65535 f
+0000000010 00000 n
+0000000034 00000 n
+0000002658 00000 n
+0000002681 00000 n
+0000002854 00000 n
+0000002928 00000 n
+trailer
+<< /ID [ (some) (id) ]
+   /Root 6 0 R
+   /Size 7
+>>
+startxref
+2987
+%%EOF

src/iOS/iOS.csproj

@@ -152,7 +152,7 @@
     <ImageAsset Include="Resources\Assets.xcassets\LaunchScreen.imageset\logo_white%402x.png" />
     <ImageAsset Include="Resources\Assets.xcassets\LaunchScreen.imageset\logo_white%403x.png" />
     <ImageAsset Include="Resources\Assets.xcassets\ic_warning.imageset\Contents.json" />
-    <ImageAsset Include="Resources\Assets.xcassets\ic_warning.imageset\ic_warning.pdf" />
+    <ImageAsset Include="Resources\Assets.xcassets\ic_warning.imageset\ic_warning-1.pdf" />
   </ItemGroup>
   <ItemGroup>
     <InterfaceDefinition Include="LaunchScreen.storyboard" />