Skip to content

Commit

Permalink
Merge branch 'rel-9.0' of https://github.com/abpframework/abp into re…
Browse files Browse the repository at this point in the history
…l-9.0
  • Loading branch information
voloagent committed Jan 6, 2025
2 parents 05d262c + 854e080 commit bee06f6
Show file tree
Hide file tree
Showing 4 changed files with 41 additions and 13 deletions.
8 changes: 8 additions & 0 deletions docs/en/docs-nav.json
Original file line number Diff line number Diff line change
Expand Up @@ -1179,6 +1179,10 @@
"text": "The Basic Theme",
"path": "framework/ui/mvc-razor-pages/basic-theme.md"
},
{
"text": "LeptonX Lite",
"path": "ui-themes/lepton-x-lite/mvc.md"
},
{
"text": "LeptonX",
"path": "ui-themes/lepton-x/mvc.md"
Expand Down Expand Up @@ -2315,6 +2319,10 @@
"text": "The Basic Theme",
"path": "ui-themes/basic-theme"
},
{
"text": "LeptonX Lite",
"path": "ui-themes/lepton-x-lite"
},
{
"text": "LeptonX Theme",
"path": "ui-themes/lepton-x"
Expand Down
2 changes: 1 addition & 1 deletion docs/en/tutorials/book-store/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
````json
//[doc-params]
{
"UI": ["MVC","Blazor","BlazorServer","NG"],
"UI": ["MVC","Blazor","BlazorServer","NG", "MAUIBlazor"],
"DB": ["EF","Mongo"]
}
````
Expand Down
26 changes: 15 additions & 11 deletions docs/en/tutorials/todo/layered/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
````json
//[doc-params]
{
"UI": ["MVC", "Blazor", "BlazorServer", "BlazorWebApp" ,"NG"],
"UI": ["MVC", "Blazor", "BlazorServer", "BlazorWebApp" ,"NG", "MAUIBlazor"],
"DB": ["EF", "Mongo"]
}
````
Expand Down Expand Up @@ -74,7 +74,7 @@ dotnet tool install -g Volo.Abp.Studio.Cli
Create an empty folder, open a command-line terminal and execute the following command in the terminal:

````bash
abp new TodoApp{{if UI=="Blazor"}} -u blazor{{else if UI=="BlazorServer"}} -u blazor-server{{else if UI=="BlazorWebApp"}} -u blazor-webapp{{else if UI=="NG"}} -u angular{{end}}{{if DB=="Mongo"}} -d mongodb{{end}}
abp new TodoApp{{if UI=="Blazor"}} -u blazor{{else if UI=="BlazorServer"}} -u blazor-server{{else if UI=="BlazorWebApp"}} -u blazor-webapp{{else if UI=="NG"}} -u angular{{else if UI=="MAUIBlazor"}} -u maui-blazor{{end}}{{if DB=="Mongo"}} -d mongodb{{end}}
````

{{if UI=="NG"}}
Expand Down Expand Up @@ -113,7 +113,7 @@ abp install-libs
> We suggest you install [Yarn v1.22+ (not v2)](https://classic.yarnpkg.com/en/docs/install) to prevent possible package inconsistencies, if you haven't installed it yet.

{{if UI=="Blazor" || UI=="BlazorWebApp"}}
{{if UI=="Blazor" || UI=="BlazorWebApp" || UI=="MAUIBlazor"}}

#### Bundling and Minification

Expand All @@ -136,12 +136,16 @@ abp bundle

It is good to run the application before starting the development. Ensure the {{if UI=="BlazorServer"}}`TodoApp.Blazor`{{else}}`TodoApp.Web`{{end}} project is the startup project, then run the application (Ctrl+F5 in Visual Studio) to see the initial UI:

{{else if UI=="Blazor"}}
{{else if UI=="Blazor" || UI=="MAUIBlazor"}}

It is good to run the application before starting the development. The solution has two main applications;

* `TodoApp.HttpApi.Host` hosts the server-side HTTP API.
{{if UI=="Blazor"}}
* `TodoApp.Blazor` is the client-side Blazor WebAssembly application.
{{else if UI=="MAUIBlazor"}}
* `TodoApp.MauiBlazor` is the MAUI Blazor application.
{{end}}

Ensure the `TodoApp.HttpApi.Host` project is the startup project, then run the application (Ctrl+F5 in Visual Studio) to see the server-side HTTP API on the [Swagger UI](https://swagger.io/tools/swagger-ui/):

Expand Down Expand Up @@ -253,7 +257,7 @@ You can apply changes to the database using the following command, in the same c
dotnet ef database update
````
> If you are using Visual Studio, you may want to use the `Add-Migration Added_TodoItem` and `Update-Database` commands in the *Package Manager Console (PMC)*. In this case, ensure that {{if UI=="MVC"}}`TodoApp.Web`{{else if UI=="BlazorServer" || UI=="Blazor" || UI=="BlazorWebApp"}}`TodoApp.Blazor`{{else if UI=="Blazor" || UI=="NG"}}`TodoApp.HttpApi.Host`{{end}} is the startup project and `TodoApp.EntityFrameworkCore` is the *Default Project* in PMC.
> If you are using Visual Studio, you may want to use the `Add-Migration Added_TodoItem` and `Update-Database` commands in the *Package Manager Console (PMC)*. In this case, ensure that {{if UI=="MVC"}}`TodoApp.Web`{{else if UI=="BlazorServer" || UI=="Blazor" || UI=="BlazorWebApp"}}`TodoApp.Blazor`{{else if UI=="Blazor" || UI=="NG" || UI=="MAUIBlazor"}}`TodoApp.HttpApi.Host`{{end}} is the startup project and `TodoApp.EntityFrameworkCore` is the *Default Project* in PMC.
{{else if DB=="Mongo"}}
Expand Down Expand Up @@ -582,11 +586,11 @@ If you open the [Swagger UI](https://swagger.io/tools/swagger-ui/) by entering t

![todo-api](../images/todo-api.png)

{{else if UI=="Blazor" || UI=="BlazorServer" || UI=="BlazorWebApp"}}
{{else if UI=="Blazor" || UI=="BlazorServer" || UI=="BlazorWebApp" || UI=="MAUIBlazor"}}

### Index.razor.cs

Open the `Index.razor.cs` file in the `Pages` folder of the {{if UI=="Blazor" || UI=="BlazorWebApp"}} *TodoApp.Blazor.Client* {{else}}*TodoApp.Blazor*{{end}} project and replace the content with the following code block:
Open the `Index.razor.cs` file in the `Pages` folder of the {{if UI=="Blazor" || UI=="BlazorWebApp"}} *TodoApp.Blazor.Client* {{else if UI=="BlazorServer"}} *TodoApp.Blazor* {{else if UI=="MAUIBlazor"}} *TodoApp.MauiBlazor* {{end}} project and replace the content with the following code block:

```csharp
using Microsoft.AspNetCore.Components;
Expand Down Expand Up @@ -627,15 +631,15 @@ namespace TodoApp.Blazor.Pages

This class uses `ITodoAppService` to perform operations for the todo items. It manipulates the `TodoItems` list after create and delete operations. This way, we don't need to refresh the whole todo list from the server.
{{if UI=="Blazor"}}
{{if UI=="Blazor" || UI=="MAUIBlazor"}}
See the *Dynamic C# Proxies & Auto API Controllers* section below to learn how we could inject and use the application service interface from the Blazor application which is running on the browser! But now, let's continue and complete the application.

{{end # Blazor}}

### Index.razor

Open the `Index.razor` file in the `Pages` folder of the {{if UI=="Blazor" || UI=="BlazorWebApp"}} *TodoApp.Blazor.Client* {{else}} *TodoApp.Blazor* {{end}} project and replace the content with the following code block:
Open the `Index.razor` file in the `Pages` folder of the {{if UI=="Blazor" || UI=="BlazorWebApp"}} *TodoApp.Blazor.Client* {{else if UI=="BlazorServer"}} *TodoApp.Blazor* {{else if UI=="MAUIBlazor"}} *TodoApp.MauiBlazor* {{end}} project and replace the content with the following code block:

```xml
@page "/"
Expand Down Expand Up @@ -677,7 +681,7 @@ Open the `Index.razor` file in the `Pages` folder of the {{if UI=="Blazor" || UI

### Index.razor.css

As the final touch, open the `Index.razor.css` file in the `Pages` folder of the {{if UI=="Blazor" || UI=="BlazorWebApp"}}*TodoApp.Blazor.Client*{{else}}*TodoApp.Blazor*{{end}} project and replace it with the following content:
As the final touch, open the `Index.razor.css` file in the `Pages` folder of the {{if UI=="Blazor" || UI=="BlazorWebApp"}}*TodoApp.Blazor.Client*{{else if UI=="BlazorServer"}} *TodoApp.Blazor* {{else if UI=="MAUIBlazor"}} *TodoApp.MauiBlazor* {{end}} project and replace it with the following content:

```css
#TodoList{
Expand Down Expand Up @@ -710,7 +714,7 @@ This is a simple styling for the todo page. We believe that you can do much bett

Now, you can run the application again to see the result.

{{if UI=="Blazor"}}
{{if UI=="Blazor" || UI=="MAUIBlazor"}}

### Dynamic C# Proxies & Auto API Controllers

Expand Down
18 changes: 17 additions & 1 deletion docs/en/ui-themes/basic-theme/index.md
Original file line number Diff line number Diff line change
@@ -1 +1,17 @@
Read this document [here](../../framework/ui/mvc-razor-pages/basic-theme.md).
# Basic Theme

The Basic Theme is a minimalist theme that doesn't add any styling on top of the plain [Bootstrap](https://getbootstrap.com/) styles. You can take the Basic Theme as the base theme and build your own theme or styling on top of it. Here, a screenshot from the theme:

![basic-theme-application-layout](../../images/basic-theme-application-layout.png)


See the [Theming document](../../framework/ui/mvc-razor-pages/theming.md) to learn about themes.

## User Interfaces

The Basic Theme has implementation for the following UI types:

- [MVC UI](../../framework/ui/mvc-razor-pages/basic-theme.md)
- [Blazor UI](../../framework/ui/blazor/basic-theme.md)
- [Angular UI](../../framework/ui/angular/basic-theme.md)

0 comments on commit bee06f6

Please sign in to comment.