fix: Article page HTML rendering

App/Models/Article.cs

@@ -4,6 +4,7 @@
 using SQLite;
 using SQLiteNetExtensions.Attributes;
 using SQLiteNetExtensions.Extensions;
+using System.Reflection;
 
 namespace GamHubApp.Models;
 
@@ -141,4 +142,22 @@ public Command ShareArticle
             }); ;
         }
     }
+
+    [Ignore]
+    public string HTMLContent
+    {
+        get
+        {
+
+            var assembly = Assembly.GetExecutingAssembly();
+            string style;
+            // Read the embedded resource
+            using (Stream stream = assembly.GetManifestResourceStream($"{assembly.GetName().Name}.Resources.Styles.ArticleStyle.css"))
+            using (StreamReader reader = new (stream))
+            {
+                style = $"<style type=\"text/css\">{reader.ReadToEnd()}</style>";
+            }
+            return style+Content;
+        }
+    }
 }

App/Resources/Styles/ArticleStyle.css

@@ -0,0 +1,21 @@
+@font-face {
+    font-family: TextFont;
+    src: url("file:///android_asset/Ubuntu-Medium.ttf")
+}
+img, [class^="image-"] {
+    width: 250px;
+    height: auto;
+}
+
+label {
+    font-family: TextFont;
+    font-size: medium;
+    text-align: justify;
+}
+
+a {
+    color: #4AC776;
+}
+* {
+    color: #ecebeb;
+}

App/Views/ArticlePage.xaml

@@ -173,13 +173,27 @@
                     </Grid>
                 </Grid>
                 <!-- content -->
-                <Label Text="{Binding SelectedArticle.Content, Mode=OneWay}"
-                       FontFamily="P-Regular"
-                       TextColor="{StaticResource FontColor}"
-                       Margin="10"
-                       TextType="Html"
-                       Grid.Row="3"
-                       />
+                    <!-- NOTE: a bug prevent use from using WebView on iOS. see: https://github.com/dotnet/maui/issues/21604-->
+
+               <Label Text="{Binding SelectedArticle.Content, Mode=OneWay}"
+                      FontFamily="P-Regular"
+                      IsVisible="{OnPlatform Android='false',
+                                             iOS='true'}"
+                      TextColor="{StaticResource FontColor}"
+                      Margin="10"
+                      TextType="Html"
+                      Grid.Row="3"
+                      />
+                    <WebView Grid.Row="3"
+                        IsVisible="{OnPlatform Android='true',
+                                        iOS='false'}"
+                        x:Name="contentView"
+                        BackgroundColor="Transparent"
+                       >
+                        <WebView.Source>
+                            <HtmlWebViewSource Html="{Binding SelectedArticle.HTMLContent, Mode=OneWay}"/>
+                        </WebView.Source>
+                    </WebView>
 
                     <!-- Button to open to the default Browser -->
                 <Button Text="Read more"