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 `
Loading...
`) in the `index.html`. -* Execute `abp-bundle` command under blazor project once. +* Execute `abp bundle` command under blazor project once. {{end}} diff --git a/docs/en/UI/Blazor/Customization-Overriding-Components.md b/docs/en/UI/Blazor/Customization-Overriding-Components.md index e288a439b0..7dadc5bb82 100644 --- a/docs/en/UI/Blazor/Customization-Overriding-Components.md +++ b/docs/en/UI/Blazor/Customization-Overriding-Components.md @@ -33,33 +33,16 @@ The next step is to create a razor component, like `MyBranding.razor`, in your a The content of the `MyBranding.razor` is shown below: -{{if UI == "BlazorServer"}} ````html @using Volo.Abp.DependencyInjection +{{if UI == "BlazorServer"}} @using Volo.Abp.AspNetCore.Components.Server.BasicTheme.Themes.Basic -@inherits Branding -@attribute [ExposeServices(typeof(Branding))] -@attribute [Dependency(ReplaceServices = true)] - - - -```` - -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: ![bookstore-added-logo](../../images/bookstore-added-logo.png) @@ -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