From e7fc112e348c9e6a062ab034f48cac59722ab81b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Nguy=E1=BB=85n=20Ho=C3=A0ng=20Phi=20Long?=
 <envaroy@gmail.com>
Date: Fri, 15 Mar 2024 17:20:02 +0700
Subject: [PATCH] Fix Document

---
 .../BuiltIn/Controls/Frame/FramePage.xaml     | 75 ++++++++++---------
 .../Controls/Frame/FramePageViewModel.cs      | 24 +++---
 2 files changed, 52 insertions(+), 47 deletions(-)

diff --git a/src/Features/Gallery/Pages/BuiltIn/Controls/Frame/FramePage.xaml b/src/Features/Gallery/Pages/BuiltIn/Controls/Frame/FramePage.xaml
index dc99bd80..7523ba04 100644
--- a/src/Features/Gallery/Pages/BuiltIn/Controls/Frame/FramePage.xaml
+++ b/src/Features/Gallery/Pages/BuiltIn/Controls/Frame/FramePage.xaml
@@ -70,7 +70,8 @@
     <ScrollView>
         <VerticalStackLayout Spacing="20">
             <Border Padding="20" StrokeShape="RoundRectangle 4">
-                <Label FontSize="Subtitle" Text="{x:StaticResource ControlInfo}" />
+                <Label FontSize="Subtitle" 
+                       Text="{x:StaticResource ControlInfo}" />
             </Border>
             <Border Padding="20" StrokeShape="RoundRectangle 4">
                 <CollectionView
@@ -82,7 +83,8 @@
 
             <Border Padding="20" StrokeShape="RoundRectangle 4">
                 <VerticalStackLayout Spacing="20">
-                    <Label Style="{x:StaticResource DocumentSectionTitleStyle}" Text="Create a Frame" />
+                    <Label Style="{x:StaticResource DocumentSectionTitleStyle}" 
+                           Text="Create a Frame" />
                     <Label Text="A Frame object typically wraps another control, such as a Label:" />
                     <Frame>
                         <Label Text="Frame wrapped around a Label" TextColor="White" />
@@ -106,26 +108,25 @@
 
             <Border Padding="20" StrokeShape="RoundRectangle 4">
                 <VerticalStackLayout Spacing="20">
-                    <Label Style="{x:StaticResource DocumentSectionTitleStyle}" Text="Create a card with a Frame" />
+                    <Label Style="{x:StaticResource DocumentSectionTitleStyle}" 
+                           Text="Create a card with a Frame" />
                     <Label Text="The following XAML shows how to create a card with a Frame:" />
-                    <Frame
-                        Padding="10"
-                        BackgroundColor="White"
-                        BorderColor="Gray"
-                        CornerRadius="8"
-                        HeightRequest="150"
-                        WidthRequest="200">
+                    <Frame Padding="10"
+                           BackgroundColor="White"
+                           BorderColor="Gray"
+                           CornerRadius="8"
+                           HeightRequest="150"
+                           WidthRequest="200">
                         <StackLayout>
-                            <Label
-                                FontAttributes="Bold"
-                                FontSize="14"
-                                Text="Card Example"
-                                TextColor="Black" />
-                            <BoxView
-                                HeightRequest="2"
-                                HorizontalOptions="Fill"
-                                Color="Gray" />
-                            <Label Text="Frames can wrap more complex layouts to create more complex UI components, such as this card!" TextColor="Black" />
+                            <Label FontAttributes="Bold"
+                                   FontSize="14"
+                                   Text="Card Example"
+                                   TextColor="Black" />
+                            <BoxView HeightRequest="2"
+                                     HorizontalOptions="Fill"
+                                     Color="Gray" />
+                            <Label Text="Frames can wrap more complex layouts to create more complex UI components, such as this card!" 
+                                   TextColor="Black" />
                         </StackLayout>
                     </Frame>
                     <app:SourceCodeExpander Code="{x:Binding CreateACardWithAFrameXamlCode}" />
@@ -134,23 +135,23 @@
 
             <Border Padding="20" StrokeShape="RoundRectangle 4">
                 <VerticalStackLayout Spacing="20">
-                    <Label Style="{x:StaticResource DocumentSectionTitleStyle}" Text="Round elements" />
-                    <CollectionView ItemsSource="{x:StaticResource PropertiesItemsSource2}" Style="{x:StaticResource PropertiesListStyle}" />
-                    <Frame
-                        Padding="20"
-                        BorderColor="Black"
-                        CornerRadius="60"
-                        HeightRequest="120"
-                        HorizontalOptions="Center"
-                        IsClippedToBounds="True"
-                        VerticalOptions="Center"
-                        WidthRequest="120">
-                        <Image
-                            HeightRequest="80"
-                            HorizontalOptions="Center"
-                            Source="{x:Binding ControlInformation.ControlIcon}"
-                            VerticalOptions="Center"
-                            WidthRequest="80" />
+                    <Label Style="{x:StaticResource DocumentSectionTitleStyle}" 
+                           Text="Round elements" />
+                    <CollectionView ItemsSource="{x:StaticResource PropertiesItemsSource2}" 
+                                    Style="{x:StaticResource PropertiesListStyle}" />
+                    <Frame Padding="20"
+                           BorderColor="Black"
+                           CornerRadius="60"
+                           HeightRequest="120"
+                           WidthRequest="120"
+                           HorizontalOptions="Center"
+                           VerticalOptions="Center"
+                           IsClippedToBounds="True">
+                        <Image HeightRequest="80"
+                               WidthRequest="80" 
+                               HorizontalOptions="Center"
+                               VerticalOptions="Center"
+                               Source="{x:Binding ControlInformation.ControlIcon}"/>
                     </Frame>
                     <app:SourceCodeExpander Code="{x:Binding RoundElementsXamlCode}" />
                 </VerticalStackLayout>
diff --git a/src/Features/Gallery/Pages/BuiltIn/Controls/Frame/FramePageViewModel.cs b/src/Features/Gallery/Pages/BuiltIn/Controls/Frame/FramePageViewModel.cs
index 114783d4..27973702 100644
--- a/src/Features/Gallery/Pages/BuiltIn/Controls/Frame/FramePageViewModel.cs
+++ b/src/Features/Gallery/Pages/BuiltIn/Controls/Frame/FramePageViewModel.cs
@@ -32,35 +32,39 @@ IAppNavigator appNavigator
     [ObservableProperty]
     string createACardWithAFrameXamlCode =
         "<Frame Padding=\"10\"\r\n" +
-        "       BorderColor=\"Gray\"\r\n" +
         "       BackgroundColor=\"White\"\r\n" +
-        "       CornerRadius=\"8\">\r\n" +
+        "       BorderColor=\"Gray\"\r\n" +
+        "       CornerRadius=\"8\"\r\n" +
+        "       HeightRequest=\"150\"\r\n" +
+        "       WidthRequest=\"200\">\r\n" +
         "   <StackLayout>\r\n" +
         "       <Label FontAttributes=\"Bold\"\r\n" +
         "              FontSize=\"14\"\r\n" +
-        "              Text=\"Card Example\" />\r\n" +
+        "              Text=\"Card Example\"\r\n" +
+        "              TextColor=\"Black\" />\r\n" +
         "       <BoxView HeightRequest=\"2\"\r\n" +
         "                HorizontalOptions=\"Fill\"\r\n" +
         "                Color=\"Gray\" />\r\n" +
-        "       <Label Text=\"Frames can wrap more complex layouts to create more complex UI components, such as this card!\" />\r\n" +
+        "       <Label Text=\"Frames can wrap more complex layouts to create more complex UI components, such as this card!\"\r\n" +
+        "              TextColor=\"Black\" />\r\n" +
         "   </StackLayout>\r\n" +
         "</Frame>";
 
     [ObservableProperty]
     string roundElementsXamlCode =
-        "<Frame BorderColor=\"Black\"\r\n" +
-        "       Padding=\"20\"\r\n" +
+        "<Frame Padding=\"20\"\r\n" +
+        "       BorderColor=\"Black\"\r\n" +
         "       CornerRadius=\"60\"\r\n" +
         "       HeightRequest=\"120\"\r\n" +
         "       WidthRequest=\"120\"\r\n" +
         "       HorizontalOptions=\"Center\"\r\n" +
         "       VerticalOptions=\"Center\"\r\n" +
         "       IsClippedToBounds=\"True\">\r\n" +
-        "   <Image VerticalOptions=\"Center\"\r\n" +
+        "   <Image HeightRequest=\"80\"\r\n" +
+        "          WidthRequest=\"80\" \r\n" +
         "          HorizontalOptions=\"Center\"\r\n" +
-        "          HeightRequest=\"80\"\r\n" +
-        "          WidthRequest=\"80\"\r\n" +
-        "          Source=\"{x:Binding ControlInformation.ControlIcon}\" />\r\n" +
+        "          VerticalOptions=\"Center\"\r\n" +
+        "          Source=\"{x:Binding ControlInformation.ControlIcon}\"/>\r\n" +
         "</Frame>";
     
     #endregion