diff --git a/docs/en/UI/Blazor/Basic-Theme.md b/docs/en/UI/Blazor/Basic-Theme.md index 4fb4d7bbaa..1d2dfb5c11 100644 --- a/docs/en/UI/Blazor/Basic-Theme.md +++ b/docs/en/UI/Blazor/Basic-Theme.md @@ -29,7 +29,7 @@ The Basic Theme is a theme implementation for the Blazor UI. It is a minimalist ``` `#ApplicationContainer` is a selector (like `
-
-````
-
-Let's explain the code:
-
-* `@inherits Branding` line inherits the Branding component defined by the [Basic Theme](Basic-Theme.md) (in the `Volo.Abp.AspNetCore.Components.Server.BasicTheme.Themes.Basic` namespace).
-* `@attribute [ExposeServices(typeof(Branding))]` registers this service (component) to [dependency injection](../../Dependency-Injection.md) for the `Branding` service (component).
-* `@attribute [Dependency(ReplaceServices = true)]` replaces the `Branding` class (component) with this new `MyBranding` class (component).
-* The rest of the code is related the content and styling of the component.
-
{{end}}
-
{{if UI == "Blazor"}}
-
-````html
-@using Volo.Abp.DependencyInjection
@using Volo.Abp.AspNetCore.Components.WebAssembly.BasicTheme.Themes.Basic
+{{end}}
+
@inherits Branding
@attribute [ExposeServices(typeof(Branding))]
@attribute [Dependency(ReplaceServices = true)]
@@ -70,13 +53,11 @@ Let's explain the code:
Let's explain the code:
-* `@inherits Branding` line inherits the Branding component defined by the [Basic Theme](Basic-Theme.md) (in the `Volo.Abp.AspNetCore.Components.WebAssembly.BasicTheme.Themes.Basic` namespace).
+* `@inherits Branding` line inherits the Branding component defined by the [Basic Theme](Basic-Theme.md) (in the {{if UI == "BlazorServer"}}`Volo.Abp.AspNetCore.Components.Server.BasicTheme.Themes.Basic`{{end}} {{if UI == "Blazor"}}`Volo.Abp.AspNetCore.Components.WebAssembly.BasicTheme.Themes.Basic`{{end}} namespace).
* `@attribute [ExposeServices(typeof(Branding))]` registers this service (component) to [dependency injection](../../Dependency-Injection.md) for the `Branding` service (component).
* `@attribute [Dependency(ReplaceServices = true)]` replaces the `Branding` class (component) with this new `MyBranding` class (component).
* The rest of the code is related the content and styling of the component.
-{{end}}
-
Now, you can run the application to see the result:

@@ -89,48 +70,29 @@ If you prefer to use code-behind file for the C# code of your component, you can
**MyBlazor.razor**
-{{if UI == "BlazorServer"}}
````html
+{{if UI == "BlazorServer"}}
@using Volo.Abp.AspNetCore.Components.Server.BasicTheme.Themes.Basic
-@inherits Branding
-
-
-
-````
{{end}}
-
{{if UI == "Blazor"}}
-````html
@using Volo.Abp.AspNetCore.Components.WebAssembly.BasicTheme.Themes.Basic
+{{end}}
@inherits Branding
````
-{{end}}
**MyBlazor.razor.cs**
-{{if UI == "BlazorServer"}}
````csharp
+{{if UI == "BlazorServer"}}
using Volo.Abp.AspNetCore.Components.Server.BasicTheme.Themes.Basic;
-using Volo.Abp.DependencyInjection;
-
-namespace MyProject.Blazor.Components
-{
- [ExposeServices(typeof(Branding))]
- [Dependency(ReplaceServices = true)]
- public partial class MyBranding
- {
-
- }
-}
-````
{{end}}
{{if UI == "Blazor"}}
-
-````csharp
using Volo.Abp.AspNetCore.Components.WebAssembly.BasicTheme.Themes.Basic;
+{{end}}
+
using Volo.Abp.DependencyInjection;
namespace MyProject.Blazor.Components
@@ -143,7 +105,6 @@ namespace MyProject.Blazor.Components
}
}
````
-{{end}}
## Theming