From 74fa3737104b4dc04eacb71feec7ed0e1fbdcdda Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Halil=20=C4=B0brahim=20Kalkan?= <hi_kalkan@yahoo.com>
Date: Wed, 18 Nov 2020 16:05:54 +0300
Subject: [PATCH] Added Blazor UI branding doc.

---
 docs/en/UI/AspNetCore/Branding.md             |  2 +-
 docs/en/UI/Blazor/Branding.md                 | 37 +++++++++++++++++++
 docs/en/docs-nav.json                         |  4 ++
 .../MyProjectNameBrandingProvider.cs          |  4 +-
 4 files changed, 45 insertions(+), 2 deletions(-)
 create mode 100644 docs/en/UI/Blazor/Branding.md

diff --git a/docs/en/UI/AspNetCore/Branding.md b/docs/en/UI/AspNetCore/Branding.md
index ee19cd5845..e4a9ee0f3b 100644
--- a/docs/en/UI/AspNetCore/Branding.md
+++ b/docs/en/UI/AspNetCore/Branding.md
@@ -11,7 +11,7 @@ The screenshot below shows *MyProject* as the application name:
 You can implement the `IBrandingProvider` interface or inherit from the `DefaultBrandingProvider` to set the application name:
 
 ````csharp
-using Volo.Abp.AspNetCore.Mvc.UI.Theme.Shared.Components;
+using Volo.Abp.Ui.Branding;
 using Volo.Abp.DependencyInjection;
 
 namespace MyProject.Web
diff --git a/docs/en/UI/Blazor/Branding.md b/docs/en/UI/Blazor/Branding.md
new file mode 100644
index 0000000000..94bcb2bad5
--- /dev/null
+++ b/docs/en/UI/Blazor/Branding.md
@@ -0,0 +1,37 @@
+# Blazor UI: Branding
+
+## IBrandingProvider
+
+`IBrandingProvider` is a simple interface that is used to show the application name and logo on the layout.
+
+The screenshot below shows *MyProject* as the application name:
+
+![branding-nobrand](../../images/branding-nobrand.png)
+
+You can implement the `IBrandingProvider` interface or inherit from the `DefaultBrandingProvider` to set the application name:
+
+````csharp
+using Volo.Abp.DependencyInjection;
+using Volo.Abp.Ui.Branding;
+
+namespace MyCompanyName.MyProjectName.Blazor
+{
+    [Dependency(ReplaceServices = true)]
+    public class MyProjectNameBrandingProvider : DefaultBrandingProvider
+    {
+        public override string AppName => "Book Store";
+    }
+}
+````
+
+The result will be like shown below:
+
+![branding-appname](../../images/branding-appname.png)
+
+`IBrandingProvider` has the following properties:
+
+* `AppName`: The application name.
+* `LogoUrl`: A URL to show the application logo.
+* `LogoReverseUrl`: A URL to show the application logo on a reverse color theme (dark, for example).
+
+> **Tip**: `IBrandingProvider` is used in every page refresh. For a multi-tenant application, you can return a tenant specific application name to customize it per tenant.
diff --git a/docs/en/docs-nav.json b/docs/en/docs-nav.json
index 401f3d6ac3..bd0c17e98e 100644
--- a/docs/en/docs-nav.json
+++ b/docs/en/docs-nav.json
@@ -598,6 +598,10 @@
               "text": "Page Alerts",
               "path": "UI/Blazor/Page-Alerts.md"
             },
+            {
+              "text": "Branding",
+              "path": "UI/Blazor/Branding.md"
+            },
             {
               "text": "Customization / Overriding Components",
               "path": "UI/Blazor/Customization-Overriding-Components.md"
diff --git a/templates/app/aspnet-core/src/MyCompanyName.MyProjectName.Blazor/MyProjectNameBrandingProvider.cs b/templates/app/aspnet-core/src/MyCompanyName.MyProjectName.Blazor/MyProjectNameBrandingProvider.cs
index cada0bba19..711f36ad33 100644
--- a/templates/app/aspnet-core/src/MyCompanyName.MyProjectName.Blazor/MyProjectNameBrandingProvider.cs
+++ b/templates/app/aspnet-core/src/MyCompanyName.MyProjectName.Blazor/MyProjectNameBrandingProvider.cs
@@ -1,7 +1,9 @@
-using Volo.Abp.Ui.Branding;
+using Volo.Abp.DependencyInjection;
+using Volo.Abp.Ui.Branding;
 
 namespace MyCompanyName.MyProjectName.Blazor
 {
+    [Dependency(ReplaceServices = true)]
     public class MyProjectNameBrandingProvider : DefaultBrandingProvider
     {
         public override string AppName => "MyProjectName";