From af4a7c30e105e28179745bee2f1f6be733aa9fde Mon Sep 17 00:00:00 2001
From: agneszitte <agnes@platform.uno>
Date: Mon, 3 Jun 2024 11:20:39 -0400
Subject: [PATCH] docs: Align code snippet blocks syntax to follow docfx and
 microsoft related documentation

(cherry picked from commit e544b2789836c61a974ffb3c232d3fc9b7788b38)
---
 doc/ReleaseNotes/LegacyReleaseNotes.md        |  2 +-
 doc/articles/features/ElevatedView.md         |  2 +-
 doc/articles/features/Lottie.md               |  4 ++--
 doc/articles/features/applicationdata.md      |  2 +-
 doc/articles/features/custom-fonts.md         |  4 ++--
 doc/articles/features/routed-events.md        |  4 ++--
 .../features/web-authentication-broker.md     | 10 ++++----
 doc/articles/guides/open-id-connect.md        |  2 +-
 doc/articles/interop/MSAL.md                  |  4 ++--
 doc/articles/interop/wasm-javascript-1.md     | 24 +++++++++----------
 doc/articles/interop/wasm-javascript-2.md     |  8 +++----
 doc/articles/interop/wasm-javascript-3.md     | 14 +++++------
 doc/articles/signalr.md                       |  4 ++--
 doc/articles/splash-screen.md                 |  2 +-
 .../uno-development/building-uno-macos.md     |  2 +-
 .../troubleshooting-memory-issues.md          |  2 +-
 doc/articles/wasm-custom-events.md            |  4 ++--
 doc/blog/201808-UnoUnderTheHoodButton.md      | 16 ++++++-------
 ...oUnderTheHoodDependencyObjectGeneration.md | 12 +++++-----
 .../201809-UnoUnderTheHoodXamlGeneration.md   |  8 +++----
 20 files changed, 65 insertions(+), 65 deletions(-)

diff --git a/doc/ReleaseNotes/LegacyReleaseNotes.md b/doc/ReleaseNotes/LegacyReleaseNotes.md
index f180cb442520..1258bc635b12 100644
--- a/doc/ReleaseNotes/LegacyReleaseNotes.md
+++ b/doc/ReleaseNotes/LegacyReleaseNotes.md
@@ -190,7 +190,7 @@ uid: Uno.ReleaseNotes.Legacy
   - **Custom Themes** are supported. This let you specify `HighContrast` or any other custom themes.
     (this is a feature not supported in UWP)
 
-    ``` csharp
+    ```csharp
     // Put that somewhere during app initialization...
     Uno.UI.ApplicationHelper.RequestedCustomTheme = "MyCustomTheme";
     ```
diff --git a/doc/articles/features/ElevatedView.md b/doc/articles/features/ElevatedView.md
index 1b4d71be87c7..7a9abcdef77c 100644
--- a/doc/articles/features/ElevatedView.md
+++ b/doc/articles/features/ElevatedView.md
@@ -20,7 +20,7 @@ xmlns:toolkit="using:Uno.UI.Toolkit"
 
 After that, use the `ElevatedView` to host the content you need to be elevated:
 
-``` xml
+```xml
 <StackPanel Orientation="Horizontal" Spacing="20">
 
     <Button>Non-Elevated Button</Button>
diff --git a/doc/articles/features/Lottie.md b/doc/articles/features/Lottie.md
index e60bfd909c28..f10dcc40a645 100644
--- a/doc/articles/features/Lottie.md
+++ b/doc/articles/features/Lottie.md
@@ -131,7 +131,7 @@ Here's how to use this feature:
 
 1. Add a _css-like_ declaration to your Lottie shape like this then put this in the name of the shape. That means the `nm` property in the json-generated file.
 
-   ``` css
+   ```css
    { Color: var(MyColor); }
    ```
 
@@ -139,7 +139,7 @@ Here's how to use this feature:
 
 2. Use it that way:
 
-   ``` xml
+   ```xml
    <winui:AnimatedVisualPlayer
        x:Name="player"
        AutoPlay="true">
diff --git a/doc/articles/features/applicationdata.md b/doc/articles/features/applicationdata.md
index c07207544a62..9593e2ec0100 100644
--- a/doc/articles/features/applicationdata.md
+++ b/doc/articles/features/applicationdata.md
@@ -52,7 +52,7 @@ string text = await FileIO.ReadTextAsync(file);
 
 The `LocalSettings` and `RoamingSettings` properties provide access to simple key-value containers that allow storage of lightweight user and application preferences. The values stored in settings should be simple serializable types. To store more complex data structures, it is preferred to serialize them first into a string (for example using a JSON serializer).
 
-``` csharp
+```csharp
 ApplicationDataContainer localSettings = ApplicationData.Current.LocalSettings;
 
 // Save a setting.
diff --git a/doc/articles/features/custom-fonts.md b/doc/articles/features/custom-fonts.md
index 4bcad677db99..c7d47f642342 100644
--- a/doc/articles/features/custom-fonts.md
+++ b/doc/articles/features/custom-fonts.md
@@ -25,7 +25,7 @@ In order to use a custom font in your application:
 
 On Wasm platform, fonts files are loaded by the browser and can take some time to load, resulting in performance degradation and potential flickering when the font is actually available for rendering. In order to prevent this, it is possible to instruct the browser to preload the font before the rendering:
 
-``` csharp
+```csharp
 // Preloading of font families on Wasm. Add this before the Application.Start() in the Program.cs
 
 public static void Main(string[] args)
@@ -203,7 +203,7 @@ First, the font needs to be defined in CSS.
 
 Second, you can use it in XAML in this way:
 
-``` xml
+```xml
 <!-- XAML usage of CSS defined font -->
 
 <TextBlock FontFamily="MyCustomFontAsBase64">This text should be rendered using the font defined as base64 in CSS.</TextBlock>
diff --git a/doc/articles/features/routed-events.md b/doc/articles/features/routed-events.md
index 5a172ee71e3f..319f469b0e63 100644
--- a/doc/articles/features/routed-events.md
+++ b/doc/articles/features/routed-events.md
@@ -10,7 +10,7 @@ This article covers some of the finer technical details of Uno Platform's routed
 
 ## Event Bubbling Flow
 
-``` plain
+```plain
 [1]---------------------+
 | An event is fired     |
 +--------+--------------+
@@ -80,7 +80,7 @@ platform propagate the events. But this will cause more interop between managed
 You can control which events are bubbling in managed code by using the `EventsBubblingInManagedCode`
 dependency property. The value of this property is inherited to children. Example:
 
-``` csharp
+```csharp
   // Make sure PointerPressed and PointerReleased are always bubbling in
   // managed code when they are originating from myControl and its children.
   myControl.EventsBubblingInManagedCode =
diff --git a/doc/articles/features/web-authentication-broker.md b/doc/articles/features/web-authentication-broker.md
index dc2b650942e9..3a4f21fa9cca 100644
--- a/doc/articles/features/web-authentication-broker.md
+++ b/doc/articles/features/web-authentication-broker.md
@@ -26,7 +26,7 @@ uid: Uno.Features.WAB
 
 * You **MUST** declare an activity inheriting from `WebAuthenticationBrokerActivityBase` in the Android head. Note the `[Activity]` attribute needs to include `Exported = true` if you are targeting Android 12.
 
-  ``` csharp
+  ```csharp
   // Android: add this class near the MainActivity, in the head project
   [Activity(NoHistory = true, LaunchMode = LaunchMode.SingleTop, Exported = true)]
   [IntentFilter(
@@ -52,7 +52,7 @@ uid: Uno.Features.WAB
 
 For special needs, it is possible to create a custom implementation of the Web Authentication Broker by using the `[ApiExtension]` mechanism of Uno and implementing the `IWebAuthenticationBrokerProvider` interface:
 
-``` csharp
+```csharp
 [assembly: ApiExtension(typeof(MyNameSpace.MyBrokerImplementation), typeof(Uno.AuthenticationBroker.IWebAuthenticationBrokerProvider))]
 
 public class MyBrokerImplementation : Uno.AuthenticationBroker.IWebAuthenticationBrokerProvider
@@ -74,7 +74,7 @@ On WebAssembly, it is possible to use an in-application `<iframe>` instead of op
 
 1. Create an `<iframe>` control:
 
-   ``` csharp
+   ```csharp
    [HtmlElement("iframe")]
    public class LoginIFrame : Control
    {
@@ -89,7 +89,7 @@ On WebAssembly, it is possible to use an in-application `<iframe>` instead of op
 
 2. Use the `LoginIFrame` control in the page:
 
-   ``` xml
+   ```xml
    <Page ...>
        <Grid>
            [...]
@@ -100,7 +100,7 @@ On WebAssembly, it is possible to use an in-application `<iframe>` instead of op
 
 3. Set the `HtmlId` before calling the `WebAuthenticationBroker`:
 
-   ``` csharp
+   ```csharp
    private async void LoginHidden_Click(object sender, RoutedEventArgs e)
    {
        // Set configuration to use the control as the iframe control
diff --git a/doc/articles/guides/open-id-connect.md b/doc/articles/guides/open-id-connect.md
index 4ca07c581889..cd3cd0139f22 100644
--- a/doc/articles/guides/open-id-connect.md
+++ b/doc/articles/guides/open-id-connect.md
@@ -220,7 +220,7 @@ private async void SignOut_Clicked(object sender, RoutedEventArgs e)
 > On WebAssembly, it's important to configure the linker to prevent the removal of some important part of the *OIDC Connect* client library:
 > `LinkerConfig.xml`:
 >
-> ``` xml
+> ```xml
 > <linker>
 >   <assembly fullname="My.Oidc.Client.App.Wasm" />
 >   <assembly fullname="Uno.UI" />
diff --git a/doc/articles/interop/MSAL.md b/doc/articles/interop/MSAL.md
index 42d809a98155..f8de291fb168 100644
--- a/doc/articles/interop/MSAL.md
+++ b/doc/articles/interop/MSAL.md
@@ -20,7 +20,7 @@ To use MSAL into an Uno project, follow the following steps:
 
 3. Change the `IPublicCLientApplication` initialization to add a call to `.WithUnoHelpers()` like this:
 
-   ``` csharp
+   ```csharp
    IPublicClientApplication _app = PublicClientApplicationBuilder.Create(clientId)
        [...]
        .WithUnoHelpers() // Add this line before the .Build()
@@ -29,7 +29,7 @@ To use MSAL into an Uno project, follow the following steps:
 
 4. Where you are using the *Interactive* mode (`_app.AcquireTokenInteractive`), add another call to `.WithUnoHelpers()` like this:
 
-   ``` csharp
+   ```csharp
    var authResult = await _app.AcquireTokenInteractive(scopes)
        .WithPrompt(Prompt.SelectAccount)
        [...]
diff --git a/doc/articles/interop/wasm-javascript-1.md b/doc/articles/interop/wasm-javascript-1.md
index 7873f755154a..5813ca76cc68 100644
--- a/doc/articles/interop/wasm-javascript-1.md
+++ b/doc/articles/interop/wasm-javascript-1.md
@@ -22,7 +22,7 @@ The Uno Bootstrapper can automatically embed any asset and deploy them with the
 
 1. **JavaScript files** should be in the `WasmScripts`  folder: they will be copied to the output folder and loaded automatically by the bootstrapper when the page loads. **They must be marked with the `EmbeddedResources` build action**:
 
-   ``` xml
+   ```xml
    <!-- .csproj file -->
    <ItemGroup>
      <EmbeddedResource Include="WasmScripts\javascriptfile.js" />
@@ -32,7 +32,7 @@ The Uno Bootstrapper can automatically embed any asset and deploy them with the
 
 2. **CSS Style files** should be in the `WasmCSS` folder: they will be copied to the output folder and referenced in the *HTML head* of the application. **They must be marked with the `EmbeddedResources` build action**.
 
-   ``` xml
+   ```xml
    <!-- .csproj file -->
    <ItemGroup>
      <EmbeddedResource Include="WasmCSS\stylefile.css" />
@@ -42,7 +42,7 @@ The Uno Bootstrapper can automatically embed any asset and deploy them with the
 
 3. **Asset files** should be marked with the `Content` build action in the app. The file will be copied to the output folder and will preserve the same relative path.
 
-   ``` xml
+   ```xml
    <!-- .csproj file -->
    <ItemGroup>
      <Content Include="Assets\image.png" />
@@ -60,7 +60,7 @@ The [philosophy of Uno](../concepts/overview/philosophy-of-uno.md) is to rely on
 
 That also means that it is possible to control how this element is created.  By default it is a `<div>`, but it can be changed in the constructor by providing the `htmlTag` parameter to the one required. For example:
 
-``` csharp
+```csharp
 public sealed partial class MyDivControl : FrameworkElement
 {
     public MyDivControl() // will create a <div> HTML element (by default)
@@ -94,7 +94,7 @@ Here is a list of helper methods used to facilitate the integration with the HTM
 
 * The extension method `element.SetCssStyle()` can be used to set a CSS Style on the HTML element. Example:
 
-  ``` csharp
+  ```csharp
   // Setting only one CSS style
   this.SetCssStyle("text-shadow", "2px 2px red");
 
@@ -104,7 +104,7 @@ Here is a list of helper methods used to facilitate the integration with the HTM
 
 * The `element.ClearCssStyle()` extension method can be used to set CSS styles to their default values. Example:
 
-  ``` csharp
+  ```csharp
   // Reset text-shadow style to its default value
   this.ClearCssStyle("text-shadow");
 
@@ -114,7 +114,7 @@ Here is a list of helper methods used to facilitate the integration with the HTM
 
 * The `element.SetHtmlAttribute()` and `element.ClearHtmlAttribute()` extension methods can be used to set HTML attributes on the element:
 
-  ``` csharp
+  ```csharp
   // Set the "href" attribute of an <a> element
   this.SetHtmlAttribute("href", "#section2");
 
@@ -130,7 +130,7 @@ Here is a list of helper methods used to facilitate the integration with the HTM
 
 * The `element.SetCssClass()` and `element.UnsetCssClass()` extension methods can be used to add or remove CSS classes to the HTML Element:
 
-  ``` csharp
+  ```csharp
   // Add the class to element
   this.SetCssClass("warning");
 
@@ -148,7 +148,7 @@ Here is a list of helper methods used to facilitate the integration with the HTM
 
 * The `element.SetHtmlContent()` extension method can be used to set arbitrary HTML content as child of the control.
 
-  ``` csharp
+  ```csharp
   this.SetHtmlContent("<h2>Welcome to Uno Platform!</h2>");
   ```
 
@@ -160,7 +160,7 @@ Here is a list of helper methods used to facilitate the integration with the HTM
 
 Whenever there's a need to invoke a JavaScript code in the browser, the `Uno.Foundation.WebAssemblyRuntime` static class should be used. There is also helpers you can call as *extension methods* on the elements.
 
-``` csharp
+```csharp
 // Invoke javascript synchronously
 WebAssemblyRuntime.InvokeJS("alert(\"It works!\");");
 
@@ -196,7 +196,7 @@ There's 2 ways to *callback* to managed C# code from JavaScript:
 
 1. Use Mono to wrap a dotnet static method into a JavaScript function like this:JavaScript_:
 
-   ``` javascript
+   ```javascript
    // Register the method wrapper (should be cached)
    const sumMethod = Module.mono_bind_static_method(
        "[Assembly.Name] Fully.Qualified.ClassType:SumMethod");
@@ -206,7 +206,7 @@ There's 2 ways to *callback* to managed C# code from JavaScript:
 
    *C#*:
 
-   ``` csharp
+   ```csharp
    // In assembly "Assembly.Name"
    namespace Fully.Qualified
    {
diff --git a/doc/articles/interop/wasm-javascript-2.md b/doc/articles/interop/wasm-javascript-2.md
index 5970495d1f44..5a3ec3722a1f 100644
--- a/doc/articles/interop/wasm-javascript-2.md
+++ b/doc/articles/interop/wasm-javascript-2.md
@@ -201,7 +201,7 @@ Let's create an app to integrate a Syntax Highlighter named [`PrismJS`](https://
 
 1. First, there is a requirement for _PrismJS_ to set the  `white-space` style at a specific value, as [documented here](https://github.com/PrismJS/prism/issues/1237#issuecomment-369846817). An easy way to do this is to set in directly in the constructor like this:
 
-   ``` csharp
+   ```csharp
    public PrismJsView()
    {
        // This is required to set to <code> style for PrismJS to works well
@@ -212,7 +212,7 @@ Let's create an app to integrate a Syntax Highlighter named [`PrismJS`](https://
 
 2. Now, we need to create an `UpdateDisplay()` method, used to generate HTML each time there's a new version to update. Here's the code for the method to add in the `PrismJsView` class:
 
-   ``` csharp
+   ```csharp
    private void UpdateDisplay(string oldLanguage = null, string newLanguage = null)
    {
        string javascript = $@"
@@ -246,7 +246,7 @@ Let's create an app to integrate a Syntax Highlighter named [`PrismJS`](https://
 
 3. Change `CodeChanged()` and `LanguageChanged()` to call the new `UpdateDisplay()` method:
 
-   ``` csharp
+   ```csharp
    private static void CodeChanged(DependencyObject dependencyobject, DependencyPropertyChangedEventArgs args)
    {
        (dependencyobject as PrismJsView)?.UpdateDisplay();
@@ -259,7 +259,7 @@ Let's create an app to integrate a Syntax Highlighter named [`PrismJS`](https://
 
 4. We also need to update the result when the control is loaded in the DOM. So we need to change the constructor again like this:
 
-   ``` csharp
+   ```csharp
    public PrismJsView()
    {
        // This is required to set to <code> style for PrismJS to works well
diff --git a/doc/articles/interop/wasm-javascript-3.md b/doc/articles/interop/wasm-javascript-3.md
index 121513d8f25e..a979348a7ba6 100644
--- a/doc/articles/interop/wasm-javascript-3.md
+++ b/doc/articles/interop/wasm-javascript-3.md
@@ -33,7 +33,7 @@ An easy way to achieve this is to add JavaScript code to load the CSS file direc
 
 1. Create a new _JavaScript_ file `flatpickrloader.js` in the `WasmScripts` folder of the `.Wasm` project:
 
-   ``` javascript
+   ```javascript
    (function () {
        const head = document.getElementsByTagName("head")[0];
 
@@ -49,7 +49,7 @@ An easy way to achieve this is to add JavaScript code to load the CSS file direc
 
 2. Set the file as `Embedded Resource`:
 
-   ``` xml
+   ```xml
    <ItemGroup>
      <EmbeddedResource Include="WasmCSS\Fonts.css" />
      <EmbeddedResource Include="WasmScripts\AppManifest.js" />
@@ -63,7 +63,7 @@ An easy way to achieve this is to add JavaScript code to load the CSS file direc
 
 1. Create a `FlatpickrView.cs` class in the `[MyApp]` project like this:
 
-   ``` csharp
+   ```csharp
    using System;
    using System.Globalization;
    using Windows.UI;
@@ -134,7 +134,7 @@ An easy way to achieve this is to add JavaScript code to load the CSS file direc
 
 2. Change the `MainPage.xaml` in the `[MyApp]` project like this:
 
-   ``` xml
+   ```xml
    <Page
        x:Class="FlatpickrDemo.MainPage"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
@@ -169,7 +169,7 @@ An easy way to achieve this is to add JavaScript code to load the CSS file direc
 
 1. Register event handlers for 2 custom events: `DateChanged` and `OpenedStateChanged`. To achieve this, put this code at the end of the `FlatpickrView` constructor:
 
-   ``` csharp
+   ```csharp
    // Register event handler for custom events from the DOM
    this.RegisterHtmlCustomEventHandler("DateChanged", OnDateChanged, isDetailJson: false);
    this.RegisterHtmlCustomEventHandler("OpenedStateChanged", OnOpenedStateChanged, isDetailJson: false);
@@ -177,7 +177,7 @@ An easy way to achieve this is to add JavaScript code to load the CSS file direc
 
 2. Add the implementation for the two handlers in the class:
 
-   ``` csharp
+   ```csharp
    private void OnDateChanged(object sender, HtmlCustomEventArgs e)
    {
        if(DateTimeOffset.TryParse(e.Detail, DateTimeFormatInfo.InvariantInfo, DateTimeStyles.AssumeLocal, out var dto))
@@ -202,7 +202,7 @@ An easy way to achieve this is to add JavaScript code to load the CSS file direc
 
 3. Change the initialization of `Flatpickr` in injected JavaScript to raise events. Change the implementation of the `OnLoaded` method to this instead:
 
-   ``` csharp
+   ```csharp
    private void LoadJavaScript()
    {
        // For demo purposes, Flatpickr is loaded directly from CDN.
diff --git a/doc/articles/signalr.md b/doc/articles/signalr.md
index 12d960f7a7c7..8935eb232150 100644
--- a/doc/articles/signalr.md
+++ b/doc/articles/signalr.md
@@ -21,7 +21,7 @@ uid: Uno.Development.SignalR
 
 3. In your `Startup.cs` file, add your `SignalR` service and a `CORS policy` to the `ConfigureServices` method.
 
-    ``` csharp
+    ```csharp
     public void ConfigureServices(IServiceCollection services)
     {
         services.AddRazorPages();
@@ -39,7 +39,7 @@ uid: Uno.Development.SignalR
 
 4. In your `Configure` method, add your CORS policy and `Hubs` endpoint
 
-    ``` csharp
+    ```csharp
     app.UseCors("CorsPolicy");
 
     app.UseEndpoints(endpoints =>
diff --git a/doc/articles/splash-screen.md b/doc/articles/splash-screen.md
index bf1576534ada..d16d9dd5b3a6 100644
--- a/doc/articles/splash-screen.md
+++ b/doc/articles/splash-screen.md
@@ -137,7 +137,7 @@ While the new templates simplify adding a splash screen, this article covers how
 
   * Add your image path to the `Image View`
 
-    ``` xml
+    ```xml
     <imageView ... image="Assets/SplashScreen">
     ```
 
diff --git a/doc/articles/uno-development/building-uno-macos.md b/doc/articles/uno-development/building-uno-macos.md
index d6600c4d2eb8..72c3be78041d 100644
--- a/doc/articles/uno-development/building-uno-macos.md
+++ b/doc/articles/uno-development/building-uno-macos.md
@@ -22,7 +22,7 @@ Support for building the `Uno.UI` solution is still somewhat unstable, this is a
 
 * If NuGet restore fails when building from the IDE, or if it gets stuck for some other reason, try building from the command line. Open a terminal session in the `uno/src` folder and use the following command:
 
-   ``` shell
+   ```shell
    msbuild /m /r SamplesApp/SamplesApp.macOS/SamplesApp.macOS.csproj
    ```
 
diff --git a/doc/articles/uno-development/troubleshooting-memory-issues.md b/doc/articles/uno-development/troubleshooting-memory-issues.md
index c9cb146bc80c..3fa2f4016df0 100644
--- a/doc/articles/uno-development/troubleshooting-memory-issues.md
+++ b/doc/articles/uno-development/troubleshooting-memory-issues.md
@@ -16,7 +16,7 @@ Starting from [Uno.Wasm.Bootstrap](https://github.com/unoplatform/Uno.Wasm.Boots
 1. Install the `Uno.Core` NuGet package;
 2. In your application, as early as possible in the initialization (generally in the `App.cs` or `App.xaml.cs` constructor), add and call the following method:
 
-    ``` csharp
+    ```csharp
     using Uno.UI.DataBinding;
     using Uno.UI.DataBinding;
     using System.Threading.Tasks;
diff --git a/doc/articles/wasm-custom-events.md b/doc/articles/wasm-custom-events.md
index 568d0b530126..b0e286475d33 100644
--- a/doc/articles/wasm-custom-events.md
+++ b/doc/articles/wasm-custom-events.md
@@ -14,7 +14,7 @@ To reach this, you need to register to those events.
 In javascript (or Typescript), you can send a custom event
 using the following code:
 
-``` javascript
+```javascript
     // Generate a custom generic event from JavaScript/Typescript
     htmlElement.dispatchEvent(new Event("simpleEvent"));
 
@@ -29,7 +29,7 @@ using the following code:
 
 ## Registering an event handler in C# for those events
 
-``` csharp
+```csharp
     protected override void OnLoaded()
     {
         // Note: following extensions are in the namespace "Uno.Extensions"
diff --git a/doc/blog/201808-UnoUnderTheHoodButton.md b/doc/blog/201808-UnoUnderTheHoodButton.md
index d5a84b2de389..f883f9960f29 100644
--- a/doc/blog/201808-UnoUnderTheHoodButton.md
+++ b/doc/blog/201808-UnoUnderTheHoodButton.md
@@ -20,7 +20,7 @@ I present the simplest interactive application imaginable, one step above 'Hello
 
 XAML:
 
-```` xml
+```xml
 <Page x:Class="UnoExtTestbed.MainPage"
       xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
       xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
@@ -35,11 +35,11 @@ XAML:
                 Click="Button_Click" />
     </StackPanel>
 </Page>
-````
+```
 
 code-behind:
 
-```` csharp
+```csharp
 using System;
 using Windows.UI.Xaml;
 using Windows.UI.Xaml.Controls;
@@ -61,7 +61,7 @@ namespace UnoExtTestbed
         }
     }
 }
-````
+```
 
 I made a blank app using the [Uno Solution template](https://marketplace.visualstudio.com/items?itemName=unoplatform.uno-platform-addin-2022) and put this code on the main page. Whenever the [Button](https://learn.microsoft.com/uwp/api/windows.ui.xaml.controls.button) is clicked, the number goes up. Add a bit more chrome and we could have a [viral hit](https://en.wikipedia.org/wiki/Cow_Clicker).
 
@@ -95,7 +95,7 @@ On UWP, `UIElement` inherits from [DependencyObject](https://learn.microsoft.com
 
 In Uno.Android and Uno.iOS, any `UIElement` is an instance of the native base view type ([Android.Views.View](https://developer.android.com/reference/android/view/View) and [UIKit.UIView](https://developer.apple.com/documentation/uikit/uiview) respectively, mapped to managed types via the magic of [Xamarin](https://visualstudio.microsoft.com/xamarin/)). So views defined in XAML are also native views. This means, for example, that it's possible to incorporate native views that know nothing about Uno directly into your app's XAML. The following works on iOS:
 
-```` xml
+```xml
 <Page x:Class="UnoExtTestbed.MainPage"
             ...
             xmlns:uikit="using:UIKit">
@@ -104,7 +104,7 @@ In Uno.Android and Uno.iOS, any `UIElement` is an instance of the native base vi
             <uikit:UILabel Text="Native label"/>
     </StackPanel>
 </Page>
-````
+```
 
 This is uniquely easy to do in Uno. We talk about 'leaving an escape hatch': the goal is 100% code reuse, but if you positively have to use a platform-specific feature or view library, the flexibility is there.
 
@@ -124,11 +124,11 @@ A number of controls implemented by Uno, `Button` included, support the concept
 
 It's supported by setting a pre-defined [Style](https://learn.microsoft.com/windows/uwp/design/controls-and-patterns/xaml-styles) that puts an instance of the native control inside the XAML control. In our code above, we could have written:
 
-```` xml
+```xml
         <Button Content="Click me"
                 Click="Button_Click"
       Style="{StaticResource NativeDefaultButton}" />
-````
+```
 
 Since Android's default button looks rather similar to UWP's, I'm going with a more visually obvious illustration using a different control, [ToggleSwitch](https://learn.microsoft.com/uwp/api/windows.ui.xaml.controls.toggleswitch). I'll use the [sample](https://github.com/unoplatform/uno.Playground/blob/master/src/Uno.Playground.Shared/Samples/ToggleSwitch.xaml) from the [Uno Gallery](https://github.com/unoplatform/uno.Playground#uno-playground) app.
 
diff --git a/doc/blog/201809-UnoUnderTheHoodDependencyObjectGeneration.md b/doc/blog/201809-UnoUnderTheHoodDependencyObjectGeneration.md
index c89bdbcaf3f0..983a98c15bff 100644
--- a/doc/blog/201809-UnoUnderTheHoodDependencyObjectGeneration.md
+++ b/doc/blog/201809-UnoUnderTheHoodDependencyObjectGeneration.md
@@ -16,7 +16,7 @@ We want to inherit from `ViewGroup` or `UIView`. We also want to inherit from `D
 
 What if you have code like this in your app?
 
-```` csharp
+```csharp
     public class MyBindableObject : DependencyObject
 
     {
@@ -40,7 +40,7 @@ What if you have code like this in your app?
             DependencyProperty.Register("MyProperty", typeof(string), typeof(MyBindableObject), new PropertyMetadata(default(string)));
 
     }
-````
+```
 
 We're inheriting from `DependencyObject` and defining a `DependencyProperty` using the standard syntax, which uses the `DependencyObject.GetValue` and `DependencyObject.SetValue` methods. On UWP these are defined in the base class, but if `DependencyObject` is an interface then there _is_ no base class. In fact, if it's just an interface, then the code won't compile, because the interface hasn't been implemented.
 
@@ -70,7 +70,7 @@ I'll start with the simpler approach: using 'T4' templates. To quote Microsoft's
 
 T4 templates ('.tt files') have been around for quite a while. They're essentially a mix of static text (which is C# code, in our case) and conditional logic. Here's a snippet:
 
-```` csharp
+```csharp
 namespace <#= mixin.NamespaceName #>
 {
     public partial class <#= mixin.ClassName #> : IFrameworkElement
@@ -89,7 +89,7 @@ namespace <#= mixin.NamespaceName #>
         OnLoaded();
     }
 �
-````
+```
 
 That's from the [template](https://github.com/unoplatform/uno/blob/be4f4e938a861d5802c228efc314c1f3ea314027/src/Uno.UI/UI/Xaml/IFrameworkElementImplementation.iOS.tt#L30-L46) which adds `IFrameworkElement` functionality in Uno. It implements properties like `Width`/`Height`, `Opacity`, `Style`, etc. At compile time, the template runs and creates a [partial class](https://learn.microsoft.com/dotnet/csharp/programming-guide/classes-and-structs/partial-classes-and-methods) with those members for `ScrollContentPresenter` and several other classes (including `FrameworkElement` itself).
 
@@ -113,7 +113,7 @@ Since the generator has a full set of semantic information from Roslyn, it can d
 
 Here's a [small snippet](https://github.com/unoplatform/uno/blob/74ba91756c446107e7394e0423527de273154f5d/src/SourceGenerators/Uno.UI.SourceGenerators/DependencyObject/DependencyObjectGenerator.cs#L218-L250) of code from `DependencyObjectGenerator`:
 
-```` csharp
+```csharp
    private void WriteAndroidAttachedToWindow(INamedTypeSymbol typeSymbol, IndentedStringBuilder builder)
    {
     var isAndroidView = typeSymbol.Is(_androidViewSymbol);
@@ -144,7 +144,7 @@ Here's a [small snippet](https://github.com/unoplatform/uno/blob/74ba91756c44610
       _loadActions.ForEach(a => a.Item1());
       BinderAttachedToWindow();
      }}
-````
+```
 
 In this method we have an [INamedTypeSymbol](https://learn.microsoft.com/dotnet/api/microsoft.codeanalysis.inamedtypesymbol?view=roslyn-dotnet), an object from Roslyn that encapsulates information about a type. We've already determined that `typeSymbol` implements `DependencyObject`; here we check if it's an Android `View` and, if so override the loaded method. You can notice that we're also checking that the type doesn't _already_ override the same method, so we don't accidentally generate code that clashes with authored code and causes a compiler error. All this goes on under the hood without user intervention, whenever your app compiles.
 
diff --git a/doc/blog/201809-UnoUnderTheHoodXamlGeneration.md b/doc/blog/201809-UnoUnderTheHoodXamlGeneration.md
index 560e6d82fbcc..2868a6c129a5 100644
--- a/doc/blog/201809-UnoUnderTheHoodXamlGeneration.md
+++ b/doc/blog/201809-UnoUnderTheHoodXamlGeneration.md
@@ -22,14 +22,14 @@ All this happens behind the scenes whenever you build an Uno head.
 
 Let's look at a concrete example. This is part of the markup we put in `MainPage.xaml` in a previous article:
 
-```` xml
+```xml
     <StackPanel> 
         <TextBlock x:Name="ClickTextBlock" 
                    Text="Button wasn't clicked yet" /> 
         <Button Content="Click me" 
                 Click="Button_Click" /> 
     </StackPanel> 
-````
+```
 
 The generated output can be found in the 'obj' folder under the project head.
 
@@ -39,7 +39,7 @@ The generated output can be found in the 'obj' folder under the project head.
 
 This is a part of the generated code, showing the output for the XAML snippet above:
 
-```` csharp
+```csharp
     public sealed partial class MainPage : Windows.UI.Xaml.Controls.Page 
     { 
         private void InitializeComponent() 
@@ -78,7 +78,7 @@ This is a part of the generated code, showing the output for the XAML snippet ab
                     , 
                 } 
             }
-````
+```
 
 What a mouthful! Bear in mind that generated code tends to be optimized for machine readability, rather than for human readability. For example, the explicit casts to `XamlApplyHandler` were added when we found that the compiler was having to do a lot of computationally-expensive type inference. That one change **doubled** the compilation speed for large XAML files.