You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: blazor/split-button/getting-started-webapp.md
+7-6Lines changed: 7 additions & 6 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -9,7 +9,7 @@ documentation: ug
9
9
10
10
# Getting Started with Blazor Split Button in Blazor Web App
11
11
12
-
This section briefly explains about how to include [Blazor Split Button](https://www.syncfusion.com/blazor-components/blazor-split-button) component in your Blazor Web App using [Visual Studio](https://visualstudio.microsoft.com/vs/) and Visual Studio Code.
12
+
This section briefly explains about how to include [Blazor Split Button](https://www.syncfusion.com/blazor-components/blazor-split-button) component in Blazor Web App using [Visual Studio](https://visualstudio.microsoft.com/vs/) and Visual Studio Code.
13
13
14
14
{% tabcontents %}
15
15
@@ -21,9 +21,10 @@ This section briefly explains about how to include [Blazor Split Button](https:/
21
21
22
22
## Create a new Blazor Web App in Visual Studio
23
23
24
-
Create a **Blazor Web App** using Visual Studio 2022 via [Microsoft Templates](https://learn.microsoft.com/aspnet/core/blazor/tooling?view=aspnetcore-8.0&pivots=vs) or the [Syncfusion<supstyle="font-size:70%">®</sup> Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-integration/template-studio).
24
+
Create a **Blazor Web App** using Visual Studio 2022 via [Microsoft Templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-8.0&pivots=vs) or the [Syncfusion<supstyle="font-size:70%">®</sup> Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-integration/template-studio).
25
+
26
+
Configure the corresponding [Interactive render mode](https://learn.microsoft.com/en-us/aspnet/core/blazor/components/render-modes?view=aspnetcore-8.0#render-modes) and [Interactivity location](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-8.0&pivots=vs) while creating a Blazor Web Application.
25
27
26
-
Configure the appropriate [Interactive render mode](https://learn.microsoft.com/aspnet/core/blazor/components/render-modes?view=aspnetcore-8.0#render-modes) and [Interactivity location](https://learn.microsoft.com/aspnet/core/blazor/tooling?view=aspnetcore-8.0&pivots=vs) when creating the Blazor Web App.
27
28
28
29
## Install Syncfusion<supstyle="font-size:70%">®</sup> Blazor SplitButtons and Themes NuGet in the App
## Create a new Blazor Web App in Visual Studio Code
56
57
57
-
Create a **Blazor Web App** using Visual Studio Code via [Microsoft Templates](https://learn.microsoft.com/aspnet/core/blazor/tooling?view=aspnetcore-8.0&pivots=vsc) or the [Syncfusion<supstyle="font-size:70%">®</sup> Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-code-integration/create-project).
58
+
Create a **Blazor Web App** using Visual Studio Code via [Microsoft Templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-8.0&pivots=vsc) or the [Syncfusion<supstyle="font-size:70%">®</sup> Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-code-integration/create-project).
58
59
59
-
Configure the appropriate[Interactive render mode](https://learn.microsoft.com/aspnet/core/blazor/components/render-modes?view=aspnetcore-8.0#render-modes) and [Interactivity location](https://learn.microsoft.com/aspnet/core/blazor/tooling?view=aspnetcore-8.0&pivots=vsc)when creating the Blazor Web App.
60
+
Configure the corresponding[Interactive render mode](https://learn.microsoft.com/en-us/aspnet/core/blazor/components/render-modes?view=aspnetcore-8.0#render-modes) and [Interactivity location](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-8.0&pivots=vsc)while creating a Blazor Web Application.
60
61
61
62
For example, to create a Blazor Web App with the `Auto` interactive render mode, use the following commands:
62
63
@@ -116,7 +117,7 @@ Import the `Syncfusion.Blazor` and `Syncfusion.Blazor.SplitButtons` namespaces.
116
117
{% endhighlight %}
117
118
{% endtabs %}
118
119
119
-
Now register the Syncfusion<supstyle="font-size:70%">®</sup> Blazor service in the **~/Program.cs** file of your Blazor Web App.
120
+
Now register the Syncfusion<supstyle="font-size:70%">®</sup> Blazor service in the **~/Program.cs** file of Blazor Web App.
120
121
121
122
If the **Interactive render mode** is `WebAssembly` or `Auto`, register Syncfusion Blazor services in both **~/Program.cs** files (Server and Client) of the Blazor Web App.
Copy file name to clipboardExpand all lines: blazor/split-button/getting-started.md
+4-3Lines changed: 4 additions & 3 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -28,7 +28,7 @@ To get started quickly with the Split Button component in Blazor, watch this vid
28
28
29
29
## Create a new Blazor App in Visual Studio
30
30
31
-
Create a **Blazor WebAssembly App** using Visual Studio via [Microsoft templates](https://learn.microsoft.com/aspnet/core/blazor/tooling?view=aspnetcore-8.0&pivots=vs) or the [Syncfusion<supstyle="font-size:70%">®</sup> Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-integration/template-studio).
31
+
Create a **Blazor WebAssembly App** using Visual Studio via [Microsoft Templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-7.0&pivots=vs) or the [Syncfusion<supstyle="font-size:70%">®</sup> Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-integration/template-studio).
32
32
33
33
## Install Syncfusion<supstyle="font-size:70%">®</sup> Blazor SplitButtons and Themes NuGet in the App
Create a **Blazor WebAssembly App** using Visual Studio Code via [Microsoft templates](https://learn.microsoft.com/aspnet/core/blazor/tooling?view=aspnetcore-8.0&pivots=vsc) or the [Syncfusion<supstyle="font-size:70%">®</sup> Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-code-integration/create-project).
58
+
Create a **Blazor WebAssembly App** using Visual Studio Code via [Microsoft Templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-7.0&pivots=vsc) or the [Syncfusion<supstyle="font-size:70%">®</sup> Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-code-integration/create-project).
59
+
59
60
60
61
Alternatively, create a WebAssembly application using the following commands in the terminal (<kbd>Ctrl</kbd>+<kbd>`</kbd>).
61
62
@@ -170,6 +171,6 @@ Add the Syncfusion<sup style="font-size:70%">®</sup> Blazor Split Button com
170
171
*[Getting Started with Syncfusion<supstyle="font-size:70%">®</sup> Blazor for Server-Side in Visual Studio](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-visual-studio)
171
172
*[Getting Started with Syncfusion<supstyle="font-size:70%">®</sup> Blazor for Server-Side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-web-app)
172
173
173
-
N> You can also explore our [Blazor Split Button example](https://blazor.syncfusion.com/demos/buttons/split-button?theme=bootstrap5) that shows you how to render and configure the Split Button.
174
+
N> Explore the [Blazor Split Button example](https://blazor.syncfusion.com/demos/buttons/split-button?theme=bootstrap5) that shows how to render and configure the Split Button.
Copy file name to clipboardExpand all lines: blazor/split-button/style-and-appearance.md
+1-1Lines changed: 1 addition & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -9,7 +9,7 @@ documentation: ug
9
9
10
10
# Styles and Appearances in Blazor SplitButton Component
11
11
12
-
To modify the Split Button appearance, override the component’s default CSS. The following table lists key CSS classes and their purposes in the Split Button. To scope changes to a specific instance, add a custom class through the component’s CssClass property and target that class in your styles. A custom theme can also be created using the [Theme Studio](https://blazor.syncfusion.com/themestudio/?theme=material).
12
+
To modify the Split Button appearance, override the component’s default CSS. The following table lists key CSS classes and their purposes in the Split Button. To scope changes to a specific instance, add a custom class through the component’s CssClass property and target that class in styles. A custom theme can also be created using the [Theme Studio](https://blazor.syncfusion.com/themestudio/?theme=material).
0 commit comments