Skip to content

Commit

Permalink
Update home banner
Browse files Browse the repository at this point in the history
  • Loading branch information
@vnbaaij
vnbaaij committed Jun 27, 2024
1 parent 64d86a3 commit 2a9c45a
Showing 1 changed file with 14 additions and 15 deletions.
29 changes: 14 additions & 15 deletions examples/Demo/Shared/Pages/Index/Index.razor
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,32 +6,31 @@

<h1>Welcome to the Fluent UI Blazor components library</h1>
<div class="demopanel" style="margin: 1rem 0; padding: 2.5rem; text-align: center">
<p>This is the demo and documentation site for version <strong>@_version</strong> of the library. This version <strong>only</strong> supports .NET 6 and 7.</p>
<p>This is the demo and documentation site for version <strong>@_version</strong> of the library.</p>
<p>This version <strong>only</strong> supports .NET 6 (supported till November 12 2024) and .NET 7 (out of support since May 14 2024).</p>
<p>The site reflects the latest state of the v3 development. The version shown above might be newer than what is available on NuGet.</p>
<br />
<p>
The <a href="https://www.fluentui-blazor.net/"> version 4 demo and documentation</a> site (supporting .NET 8) is available as well.
</p>
<p>See <a href="https://www.fluentui-blazor.net/">https://www.fluentui-blazor.net/</a> for the v4 demo and documentation site (supporting .NET 8).</p>
</div>

<h2 id="introduction">Introduction</h2>
<p>
The <code>Microsoft.Fast.Components.FluentUI</code> package provides a set of <a href="https://blazor.net">Blazor</a> components. Some of the
The <code>Microsoft.Fast.Components.FluentUI</code> package provides a set of <a href="https://blazor.net">Blazor</a> components. Some of the
components are wrappers around Microsoft's official Fluent UI Blazor components. Others are components that leverage the Fluent UI design system
or make it easier to work with Fluent UI. To get up and running with <code>Microsoft.Fast.Components.FluentUI</code> library, see the Getting Started section below.
</p>
<p>
The source for the library is hosted in the <a href="https://github.com/microsoft/fluentui-blazor">fluentui-blazor</a> repository at GitHub.
The source for the library is hosted in the <a href="https://github.com/microsoft/fluentui-blazor">fluentui-blazor</a> repository at GitHub.
Documentation on the components is available at this <a href="https://aka.ms/fluentui-blazor">demo site</a>.
</p>
<p>
The source for the <code>@@fluentui/web-components</code> is hosted in the <a href="https://github.com/microsoft/fluentui/tree/master/packages/web-components">fluentui</a> mono-repository.
The source for the <code>@@fluentui/web-components</code> is hosted in the <a href="https://github.com/microsoft/fluentui/tree/master/packages/web-components">fluentui</a> mono-repository.
Documentation on the components is available at <a href="https://docs.microsoft.com/en-us/fluent-ui/web-components/">docs.microsoft.com</a>. The Fluent UI Blazor components are built on <a href="https://www.fast.design/">FAST</a> and work in every major browser.
</p>

<h2 id="whatsnew">What's new?</h2>
<p>
If you are already up-and-running and upgrading from an earlier version of the library, please see the <a href="/WhatsNew">What's new'</a> section
If you are already up-and-running and upgrading from an earlier version of the library, please see the <a href="/WhatsNew">What's new'</a> section
for information on (breaking) changes.
</p>

Expand All @@ -44,7 +43,7 @@
<h3>Scripts</h3>
<p>
The hart of this library is formed by the Fluent UI Web Components and the accompanying <code>web-components.min.js</code> file. From now
on, the script is included in the library itself and no longer needs to be added to your <code>index.html</code> or <code>_Layout.cshtml</code>.
on, the script is included in the library itself and no longer needs to be added to your <code>index.html</code> or <code>_Layout.cshtml</code>.
In fact, doing this might lead to unpredictable results.

<blockquote>
Expand All @@ -56,13 +55,13 @@

<h3>Styles</h3>
<p>
In order for this library to work as expected, you will need to add the composed scoped CSS file for the components. This can be done by
adding the following line to the <code>&lt;head&gt;</code> section of your <code>index.html</code> or <code>_Layout.cshtml</code> file in the
In order for this library to work as expected, you will need to add the composed scoped CSS file for the components. This can be done by
adding the following line to the <code>&lt;head&gt;</code> section of your <code>index.html</code> or <code>_Layout.cshtml</code> file in the
project you installed the package:
</p>
<CodeSnippet>&lt;link href="{PROJECT_NAME}.styles.css" rel="stylesheet" /&gt;</CodeSnippet>
<p>
It is possible that the line is already there (but commented out). <b>IMPORTANT:</b> When you change the root namespace/assembly name of your project,
It is possible that the line is already there (but commented out). <b>IMPORTANT:</b> When you change the root namespace/assembly name of your project,
you need to update the {PROJECT_NAME} part of the CSS file accordingly.
</p>

Expand All @@ -78,7 +77,7 @@
It is entirely possible to build a site without using Reboot. If you choose not to use it, please do add the <code>variables.css</code> file (which is otherwise imported through the <code>reboot.css</code> file)
to your <code>index.html</code> or <code>_Layout.cshtml</code> file in the <code>&lt;head&gt;</code> section like this:
<CodeSnippet Language="language-html">&lt;link href="_content/Microsoft.Fast.Components.FluentUI/css/variables.css" rel="stylesheet" /&gt;</CodeSnippet>
The file contains a number of CSS variables that are required to be defined for the components to work correctly.
The file contains a number of CSS variables that are required to be defined for the components to work correctly.
</p>

<h3>Project file setup</h3>
Expand Down Expand Up @@ -168,7 +167,7 @@

<h2>Use the DataGrid component with EF Core</h2>
<p>
If you want to use the <code>FluentDataGrid</code> with data provided through EF Core, you need to install an additional package so the
If you want to use the <code>FluentDataGrid</code> with data provided through EF Core, you need to install an additional package so the
grid knows how to resolve queries asynchronously for efficiency.
</p>

Expand All @@ -182,7 +181,7 @@ In your <code>Program.cs</code> file you need to add the following after the <co

<h3 id="joining-the-community">Joining the Community</h3>
<p>
Looking to get answers to questions or engage with us in real-time?
Looking to get answers to questions or engage with us in real-time?
<ul>
<li>Join the DotNetEvolution server and chat with us in real-time on <a target="_blank" href="https://discord.gg/M5cBTfp6J2">Discord</a>. You can also find us on <a target="_blank" href="https://app.gitter.im/#/room/#fluentui-blazor:gitter.im">Gitter</a>.</li>
<li>Submit requests and issues on <a target="top" href="https://github.com/microsoft/fluentui-blazor/issues/new/choose">GitHub</a>.</li>
Expand Down

0 comments on commit 2a9c45a

Please sign in to comment.