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
@@ -14,7 +14,7 @@ This package is for use in .NET 8 and 9 Blazor projects. If you are using **now
14
14
15
15
## Introduction
16
16
17
-
The `Microsoft.FluentUI.AspNetCore` family of packages provides a set of [Blazor](https://blazor.net)components, tools and utilities which are used to build applications that have a Fluent design (i.e. have the look and feel of modern Microsoft applications).
17
+
The `Microsoft.FluentUI.AspNetCore` family of packages provides a set of Razor components for [Blazor](https://blazor.net)applications, tools and utilities which are used to build applications that have a Fluent design (i.e. have the look and feel of modern Microsoft applications).
18
18
19
19
Some of the components in the library are wrappers around Microsoft's official Fluent UI Web Components. Others are components that leverage the Fluent Design System or make it easier to work with Fluent. To get up and running with the library, see the **Getting Started** section below.
20
20
@@ -120,7 +120,7 @@ We have additional packages available that include the complete Fluent UI System
120
120
Please refer to the [Icons and Emoji](https://www.fluentui-blazor.net/IconsAndEmoji) page for more information.
121
121
122
122
## Usage
123
-
With the package installed, you can begin using the Fluent UI Blazor components in the same way as any other Blazor component.
123
+
With the package installed, you can begin using the Fluent UI Blazor library components in the same way as any other Razor component.
124
124
125
125
### Add Imports
126
126
@@ -131,7 +131,7 @@ After the package is added, you need to add the following in your `_Imports.raz
131
131
```
132
132
133
133
### Quick Start
134
-
This is literally all you need in your views to use Fluent UI Blazor components.
134
+
This is literally all you need in your views to use Fluent UI Blazor library in your application.
135
135
136
136
```xml
137
137
<FluentCard>
@@ -141,7 +141,7 @@ This is literally all you need in your views to use Fluent UI Blazor components.
141
141
```
142
142
143
143
## Configuring the Design System
144
-
The Fluent UI Blazor components are built on FAST's (Adaptive UI) technology, which enables design customization and personalization, while automatically
144
+
The Fluent UI Razor components are built on FAST's (Adaptive UI) technology, which enables design customization and personalization, while automatically
145
145
maintaining accessibility. This is accomplished through setting various "design tokens". The library exposes all design tokens, which you can use both from code as in a declarative way in your `.razor` pages. The different ways of working with design tokens are described in the [design tokens](https://www.fluentui-blazor.net/DesignTokens) page.
146
146
147
147
## Blazor Hybrid
@@ -171,7 +171,7 @@ Please see the [DataGrid](https://www.fluentui-blazor.net/DataGrid) page for mor
171
171
172
172
173
173
## Additional resources
174
-
* The Microsoft Fluent UI Blazor components[documentation and demo site](https://www.fluentui-blazor.net)
174
+
* The Microsoft Fluent UI Blazor library[documentation and demo site](https://www.fluentui-blazor.net)
175
175
176
176
## Support
177
177
The Microsoft Fluent UI Blazor library is an open source project and is **not** an official part of ASP.NET Core, which means it’s **not** officially
Copy file name to clipboardExpand all lines: examples/Demo/Shared/Pages/FluentComponentBasePage.razor
+1-1
Original file line number
Diff line number
Diff line change
@@ -10,7 +10,7 @@
10
10
11
11
<h2>FluentComponentBase</h2>
12
12
<p>
13
-
<code>FluentComponentBase</code> is the abstract base class all other Fluent UI Blazor components inherit from.
13
+
<code>FluentComponentBase</code> is the abstract base class all other Fluent UI Razor components inherit from.
14
14
</p>
15
15
<p>You can <b>not</b> create or use a <code>FluentComponentBase</code> on a page or in another component but it adds the following parameters to every derived component.<br /><br />
16
16
<em>These parameters are not shown in the component overviews of the derived components pages</em>
Copy file name to clipboardExpand all lines: examples/Demo/Shared/Pages/FormsOverviewPage.razor
+3-3
Original file line number
Diff line number
Diff line change
@@ -105,21 +105,21 @@
105
105
106
106
<h2>Binding</h2>
107
107
<p>
108
-
The Fluent UI Blazor input components all support binding, just like the standard Blazor input components do. See the
108
+
The Fluent UI input components all support binding, just like the standard Blazor input components do. See the
109
109
<ahref="https://learn.microsoft.com/en-us/aspnet/core/blazor/forms/binding?view=aspnetcore-8.0">documentation</a> on the Learn site
110
110
for more information.
111
111
</p>
112
112
113
113
<h2>Validation</h2>
114
114
<p>
115
-
The Fluent UI Blazor input components work with validation in the same way the standard Blazor input components do. We provide 2 extra
115
+
The Fluent UI input components work with validation in the same way the standard Blazor input components do. We provide 2 extra
116
116
components to make it possible to show validation messages which follow the Fluent Design guidelines:
117
117
<ul>
118
118
<li><code>FluentValidationSummary</code></li>
119
119
<li><code>FluentValidationMessage</code></li>
120
120
</ul>
121
121
See the <ahref="https://learn.microsoft.com/en-us/aspnet/core/blazor/forms/validation?view=aspnetcore-8.0">documentation</a> on the Learn site
122
-
for more information on the standard components. As the Fluent UI Blazor components are based on the standard components, the same documentation applies.
122
+
for more information on the standard components. As the Fluent UI Razor components are based on the standard components, the same documentation applies.
Copy file name to clipboardExpand all lines: examples/Demo/Shared/Pages/Home/Home.razor
+6-6
Original file line number
Diff line number
Diff line change
@@ -9,7 +9,7 @@
9
9
<FluentGridItemxs="12"sm="12"md="6">
10
10
<h1>Welcome!</h1>
11
11
<p>
12
-
The Fluent UI Blazor library provides a robust and extensive set of <ahref="https://blazor.net">Blazor</a> components. Some of those
12
+
The Fluent UI Blazor library provides a robust and extensive set of Razor components for <ahref="https://blazor.net">Blazor</a> applications. Some of those
13
13
components are wrappers around Microsoft's official Fluent UI Web Components. Others are components that leverage the <ahref="https://fluent2.microsoft.design/">Fluent Design System</a>
14
14
or just make it easier to work with Fluent in general.
15
15
</p>
@@ -69,7 +69,7 @@
69
69
</p>
70
70
<h3>Manual setup</h3>
71
71
<p>
72
-
To start using the Fluent UI Blazor components from scratch, you first need to install the main <ahref="https://www.nuget.org/packages/Microsoft.FluentUI.AspNetCore.Components/">Nuget package</a>
72
+
To start using the Fluent UI Blazor library from scratch, you first need to install the main <ahref="https://www.nuget.org/packages/Microsoft.FluentUI.AspNetCore.Components/">NuGet package</a>
73
73
in the project you want to use the components. You can use the NuGet package manager in your IDE for that or use the following command when using a CLI:
As mentioned, we wrap the Fluent UI Web Components for some of our compnents. The needed script is included in the library and will
86
+
As mentioned, we wrap the Fluent UI Web Components for some of our components. The needed script is included in the library and will
87
87
be loaded for you automatically by using Blazor's built-in capabilities. You do not need to download or pull the script from a CDN manually.
88
88
</p>
89
89
<p>
@@ -107,8 +107,8 @@
107
107
</FluentGridItem>
108
108
109
109
<FluentGridItemxs="12"sm="12"md="8" >
110
-
<h2id="using-the-fluentui-web-components">Using the Fluent UI Blazor components</h2>
111
-
<p>With the package installed, you can begin using the Fluent UI Blazor components in the same way as any other Blazor component. Just be sure to add the following using statement to your views:</p>
110
+
<h2id="using-the-fluentui-web-components">Using the Fluent UI Blazor library</h2>
111
+
<p>With the package installed, you can begin using the components from the Fluent UI Blazor library in the same way as any other Razor component. Just be sure to add the following using statement to your views:</p>
Copy file name to clipboardExpand all lines: examples/Demo/Shared/wwwroot/docs/CodeSetup.md
+4-4
Original file line number
Diff line number
Diff line change
@@ -23,7 +23,7 @@ dotnet new fluentblazorwasm --name MyApplication
23
23
When using Visual Studio, you can also use the **New Project** dialog to create a new project. The templates will be available under the **Blazor** category.
24
24
25
25
### Manual Install
26
-
To start using the **Fluent UI Blazor components** from scratch, you first need to install the main [Nuget package](https://www.nuget.org/packages/Microsoft.FluentUI.AspNetCore.Components/) in the project you want to use the library and its components.
26
+
To start using the **Fluent UI** library and Razor components from scratch, you first need to install the main [NuGet package](https://www.nuget.org/packages/Microsoft.FluentUI.AspNetCore.Components/) in the project you want to use the library and its components.
27
27
You can use the NuGet package manager in your IDE or use the following command when using a CLI:
28
28
29
29
```shell
@@ -123,7 +123,7 @@ We have additional packages available that include the complete **Fluent UI Syst
123
123
Please refer to the [Icons and Emoji](https://www.fluentui-blazor.net/IconsAndEmoji) page for more information.
124
124
125
125
## Usage
126
-
With the package installed, you can begin using the **Fluent UI Blazor components** in the same way as any other Blazor component.
126
+
With the package installed, you can begin using the **Fluent UI** Razor components in the same way as any other Razor component.
127
127
128
128
### Add Imports
129
129
@@ -134,7 +134,7 @@ After the package is added, you need to add the following in your `_Imports.raz
134
134
```
135
135
136
136
### Quick Start
137
-
This is literally all you need in your views to use Fluent UI Blazor components.
137
+
This is literally all you need in your views to use Fluent UI library components in your Blazor application.
138
138
139
139
```xml
140
140
<FluentCard>
@@ -144,7 +144,7 @@ This is literally all you need in your views to use Fluent UI Blazor components.
144
144
```
145
145
146
146
## Configuring the Design System
147
-
The **Fluent UI Blazor** components are built on FAST's (Adaptive UI) technology, which enables design customization and personalization, while automatically
147
+
The **Fluent UI** library components are built on FAST's (Adaptive UI) technology, which enables design customization and personalization, while automatically
148
148
maintaining accessibility. This is accomplished through setting various "design tokens". The library exposes all design tokens, which you can use both from code as in a declarative way in your `.razor` pages. The different ways of working with design tokens are described in the [design tokens](https://www.fluentui-blazor.net/DesignTokens) page.
Copy file name to clipboardExpand all lines: examples/Demo/Shared/wwwroot/docs/DesignTokens.md
+2-2
Original file line number
Diff line number
Diff line change
@@ -1,6 +1,6 @@
1
1
## Design Token support
2
2
3
-
The Fluent UI Blazor Components enable design customization and personalization, while automatically maintaining accessibility. This is
3
+
The Fluent UI library's components enable design customization and personalization, while automatically maintaining accessibility. This is
4
4
accomplished through setting various "Design Tokens". In total there are over 160 distinct design tokens defined in the library and you can
5
5
use all of these from Blazor, both from C# code as in a declarative way in your `.razor` pages.
6
6
@@ -9,7 +9,7 @@ information on how Design Tokens are implemented in the web components script.
9
9
10
10
## Styling web components with Design Tokens
11
11
12
-
Many of the Fluent UI Blazor components wrap the web components which are designed to be stylistically flexible, allowing dramatic changes to visual design with minimal code changes. This is possible through the extensive use of Design Tokens and an [adaptive color system](#adaptive-color-system).
12
+
Many of the Fluent UI library components wrap the web components which are designed to be stylistically flexible, allowing dramatic changes to visual design with minimal code changes. This is possible through the extensive use of Design Tokens and an [adaptive color system](#adaptive-color-system).
Copy file name to clipboardExpand all lines: examples/Demo/Shared/wwwroot/docs/ProjectSetup.md
+5-5
Original file line number
Diff line number
Diff line change
@@ -1,14 +1,14 @@
1
1
# Setup your project to use Fluent UI Icons and/or Emoji assets
2
2
3
-
The Fluent UI Icons and Emoji's are available as a separate Nuget package. This is done to keep the size of the main library as small as possible.
3
+
The Fluent UI Icons and Emoji's are available as a separate NuGet package. This is done to keep the size of the main library as small as possible.
4
4
If you do not want to use icons and/or emoji in your project, you do not need to install these packages.
5
5
6
6
>**If you are upgrading from a previous version of the library, please see the [Upgrade Guide](https://www.fluentui-blazor.net/UpgradeGuide) for more information.**
7
7
8
8
## Getting Started with icons
9
9
10
10
To start using the **Fluent UI System Icons**, you will need
11
-
to install the official [Nuget package](https://www.nuget.org/packages/Microsoft.Fast.Components.FluentUI.Icons/)
11
+
to install the official [NuGet package](https://www.nuget.org/packages/Microsoft.Fast.Components.FluentUI.Icons/)
12
12
in the project you would like to use the library and components. You can use the following command:
13
13
14
14
```shell
@@ -23,7 +23,7 @@ To use the icons, you will need to add the following using statement to your `_I
23
23
@using Microsoft.Fast.Components.FluentUI
24
24
```
25
25
26
-
Then you can use the icons in your Blazor components like this:
26
+
Then you can use the icons in your Blazor application like this:
27
27
28
28
> **Note:** Names are structured as follows: `Icons.[IconVariant].[IconSize].[IconName]`.
29
29
@@ -55,7 +55,7 @@ To use the emoji's, you will need to add the following using statement to your `
55
55
@using Microsoft.Fast.Components.FluentUI
56
56
```
57
57
58
-
Then you can use the emoji's in your Blazor components like this:
58
+
Then you can use the emoji's in your Blazor application like this:
59
59
60
60
> **Note:** Names are structured as follows: `Emojis.[EmojiGroup].[EmojiStyle].[EmojiSkintone].[EmojiName]`.
61
61
@@ -69,4 +69,4 @@ Then you can use the emoji's in your Blazor components like this:
69
69
Please see the [Code Setup](https://www.fluentui-blazor.net/CodeSetup) page to lean more about the neccesary changes to your `Program.cs` file.
70
70
71
71
## Can I include the library in a Razor Class Library (RCL) project?
72
-
Yes, it should work without any changes to your project.
72
+
Yes, it should work without any changes to your project.
Copy file name to clipboardExpand all lines: examples/Demo/Shared/wwwroot/docs/Templates.md
+1-1
Original file line number
Diff line number
Diff line change
@@ -5,7 +5,7 @@ To make it easier to start a project that uses the Fluent UI Web Components for
5
5
- Fluent .NET Aspire Starter app
6
6
7
7
8
-
All of these templates mimic their standard Blazor template counterpart but have the Fluent UI Blazor components already fully set up. If you choose to add sample pages when creating a project, all components have been replaced with Fluent UI components (and a few extra have been added). All Bootstrap styling is removed of course as well.
8
+
All of these templates mimic their standard Blazor template counterpart but have the Fluent UI Blazor library already fully set up. If you choose to add sample pages when creating a project, all components have been replaced with Fluent UI components (and a few extra have been added). All Bootstrap styling is removed of course as well.
9
9
10
10
If you want to use the Icon component with applications based on the templates, we have already included and set up the Icon package for you. The full collection of approximately 12 thousand icons in different variants and sizes can be browsed and searched from the [Icon](https://www.fluentui-blazor.net/Icon) page.
Copy file name to clipboardExpand all lines: examples/Demo/Shared/wwwroot/docs/WhatsNew-Archive.md
+2-2
Original file line number
Diff line number
Diff line change
@@ -1,4 +1,4 @@
1
-
## V3.2.2
1
+
## V3.2.2
2
2
- Fix [#859](https://github.com/microsoft/fluentui-blazor/issues/859) and [#884](https://github.com/microsoft/fluentui-blazor/issues/859): Fix NavMenu for real by moving `<a>` tag up in the rendering tree
3
3
4
4
### Update Fluent UI System icons to 1.1.221
@@ -535,7 +535,7 @@ unpredictable results.
535
535
536
536
> **If you are upgrading from an earlier version please remove the script from your `index.html` or `_Layout.cshtml` file.**
537
537
538
-
We made this change to make certain you'll always get the version of the script that works best with the Blazor components. It also eliminates the risk of having
538
+
We made this change to make certain you'll always get the version of the script that works best with our components. It also eliminates the risk of having
539
539
multiple versions of the script being used on a page. On top of all this, it also makes installation of the package in your new projects easier.
540
540
541
541
## Readme and docs updates
There was a problem loading the remainder of the diff.
0 commit comments