-
Notifications
You must be signed in to change notification settings - Fork 159
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
📝 docs: Update the css href of icon (#476)
- Loading branch information
Showing
4 changed files
with
15 additions
and
15 deletions.
There are no files selected for viewing
2 changes: 1 addition & 1 deletion
2
src/Doc/Masa.Blazor.Doc/wwwroot/docs/getting-started/installation.en-US.json
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,5 +1,5 @@ | ||
{ | ||
"Order": 0, | ||
"Title": "Install", | ||
"Html": "<section id=\"section-577242659\">\r\n <h1 class=\"m-heading text-h3 text-sm-h3 mb-2\">\r\n <a class=\"text-decoration-none text-right text-md-left\">#</a>\r\n Install\r\n </h1>\n<p>Let's start with MASA Blazor. MASA Blazor is the UI component library of the .NET Blazor framework for building feature-rich and fast applications.</p>\n\r\n <div class=\"mb-8\"> </div><section id=section-741625053>\r\n <h2 class=\"m-heading text-h4 text-sm-h4 mb-3\">\r\n <a class=\"text-decoration-none text-right text-md-left\">#</a>\r\n Prerequisites\r\n </h2>\n<p>All products of the MASA series are developed based on .Net 6.0, please make sure that you have installed <a href=\"https://dotnet.microsoft.com/download/dotnet/6.0\" target=\"_blank\">.NET 6.0</a> 。</p>\n<br/>\n\r\n </section><section id=section-118153470>\r\n <h2 class=\"m-heading text-h4 text-sm-h4 mb-3\">\r\n <a class=\"text-decoration-none text-right text-md-left\">#</a>\r\n Presentation\r\n </h2>\n<p>The video content is the MASA Blazor template to create the Blazor Server demo video, you can choose to view or directly view the CLI creation part.</p>\n<iframe src=\"https://cdn.masastack.com/stack/images/website/masa-blazor/video.mp4\" scrolling=\"no\" width=\"800px\" height=\"600px\" border=\"0\" frameborder=\"no\" framespacing=\"0\" allowfullscreen=\"true\"> </iframe>\n<br/>\n\r\n </section><section id=section-700434144>\r\n <h2 class=\"m-heading text-h4 text-sm-h4 mb-3\">\r\n <a class=\"text-decoration-none text-right text-md-left\">#</a>\r\n CLI Creation\r\n </h2>\n<h3>Install Masa.Template</h3>\n<p>Masa.Template, contains all project templates of the MASA series. The corresponding template of MASA Blazor is named <code>masab</code></p>\n<pre><code>dotnet new --install Masa.Template\n</code></pre>\n<br/>\n<h3>Create project</h3>\n<p>Create a project based on the project template name and specify the output directory, which is the root folder of the project.</p>\n<pre><code>dotnet new masab -o MasaBlazorApp\n</code></pre>\n<blockquote>\n<p>The default is Server mode, through the parameter --mode WebAssembly to create a WebAssembly mode project.</p>\n</blockquote>\n<br/>\n<h3>Startup project</h3>\n<p>Switch to the MasaBlazorApp directory by command <code>cd MasaBlazorApp</code>. \nStart the project with <code>dotnet run</code>, open the corresponding URL according to the program output, and you can see the effect of the MASA Blazor template project.</p>\n<br/>\n\r\n </section><section id=section-773856508>\r\n <h2 class=\"m-heading text-h4 text-sm-h4 mb-3\">\r\n <a class=\"text-decoration-none text-right text-md-left\">#</a>\r\n Create manually\r\n </h2>\n<h3>Create a Blazor Server project</h3>\n<p>Create a new Blazor application named BlazorApp in the command line interface:</p>\n<pre><code class=\"language-sh\">$ dotnet new blazorserver -o BlazorApp\n</code></pre>\n<p>or</p>\n<pre><code class=\"language-sh\">$ dotnet new blazorwasm -o BlazorApp\n</code></pre>\n<blockquote>\n<p><code>blazorserver</code> is Blazor Server App template shortname。<code>blazorwasm</code> is Blazor WebAssembly App template shortname</p>\n</blockquote>\n<br/>\n<h3>Install NuGet package</h3>\n<pre><code class=\"language-sh\">$ dotnet add package Masa.Blazor\n</code></pre>\n<br/>\n<h3>Import resource files</h3>\n<h4>Blazor Server</h4>\n<p>in <code>Pages/_Host.cshtml</code> import resource files:</p>\n<pre><code class=\"language-html\"><!--masa blazor css style-->\n<link href="_content/Masa.Blazor/css/masa-blazor.css" rel="stylesheet" />\n<link href="_content/Masa.Blazor/css/masa-extend-blazor.css" rel="stylesheet" />\n<!--icon file,import need to use-->\n<link href="https://cdn.masastack.com/npm/@("@mdi")/[email protected]/css/materialdesignicons.min.css" rel="stylesheet">\n<link href="https://cdn.masastack.com/npm/materialicons/materialicons.css" rel="stylesheet">\n<link href="https://cdn.masastack.com/npm/fontawesome/v5.0.13/css/all.css" rel="stylesheet">\n<!--js(should lay the end of file)-->\n<script src="_content/BlazorComponent/js/blazor-component.js"></script>\n</code></pre>\n<br/>\n<h4>Blazor WebAssembly</h4>\n<p>in <code>wwwroot\\index.html</code> import resource files:</p>\n<pre><code class=\"language-html\"><link href="_content/Masa.Blazor/css/masa-blazor.css" rel="stylesheet" />\n<link href="_content/Masa.Blazor/css/masa-extend-blazor.css" rel="stylesheet" />\n<link\n href="https://cdn.jsdelivr.net/npm/@mdi/[email protected]/css/materialdesignicons.min.css"\n rel="stylesheet"\n/>\n<link href="https://fonts.googleapis.com/css2?family=Material+Icons" rel="stylesheet" />\n<link href="https://use.fontawesome.com/releases/v5.0.13/css/all.css" rel="stylesheet" />\n<script src="_content/BlazorComponent/js/blazor-component.js"></script>\n</code></pre>\n<br/>\n<h3>Inject services</h3>\n<p>Program.cs file add Masa.Blazor related services:</p>\n<pre><code class=\"language-c#\">// Add services to the container.\nbuilder.Services.AddMasaBlazor();\n</code></pre>\n<br/>\n<h3>Global reference</h3>\n<p>update <code>_Imports.razor</code> file,Add:</p>\n<pre><code class=\"language-c#\">@using Masa.Blazor\n</code></pre>\n<p>update <code>Shared/MainLayout.razor</code> file,set MApp as root element:</p>\n<pre><code class=\"language-html\"><MApp> //layout </MApp>\n</code></pre>\n<br/>\n\r\n </section><section id=section-2023003>\r\n <h2 class=\"m-heading text-h4 text-sm-h4 mb-3\">\r\n <a class=\"text-decoration-none text-right text-md-left\">#</a>\r\n Use\r\n </h2>\n<p>Refer to official documents <a href=\"https://masa-blazor-docs-dev.lonsid.cn/components/application\">Component</a>,Add related components。\n<code>dotnet run</code> start project Preview the MasaBlazor。</p>\n</section>" | ||
"Html": "<section id=\"section-577242659\">\r\n <h1 class=\"m-heading text-h3 text-sm-h3 mb-2\">\r\n <a class=\"text-decoration-none text-right text-md-left\">#</a>\r\n Install\r\n </h1>\n<p>Let's start with MASA Blazor. MASA Blazor is the UI component library of the .NET Blazor framework for building feature-rich and fast applications.</p>\n\r\n <div class=\"mb-8\"> </div><section id=section-741625053>\r\n <h2 class=\"m-heading text-h4 text-sm-h4 mb-3\">\r\n <a class=\"text-decoration-none text-right text-md-left\">#</a>\r\n Prerequisites\r\n </h2>\n<p>All products of the MASA series are developed based on .Net 6.0, please make sure that you have installed <a href=\"https://dotnet.microsoft.com/download/dotnet/6.0\" target=\"_blank\">.NET 6.0</a> 。</p>\n<br/>\n\r\n </section><section id=section-118153470>\r\n <h2 class=\"m-heading text-h4 text-sm-h4 mb-3\">\r\n <a class=\"text-decoration-none text-right text-md-left\">#</a>\r\n Presentation\r\n </h2>\n<p>The video content is the MASA Blazor template to create the Blazor Server demo video, you can choose to view or directly view the CLI creation part.</p>\n<iframe src=\"https://cdn.masastack.com/stack/images/website/masa-blazor/video.mp4\" scrolling=\"no\" width=\"800px\" height=\"600px\" border=\"0\" frameborder=\"no\" framespacing=\"0\" allowfullscreen=\"true\"> </iframe>\n<br/>\n\r\n </section><section id=section-700434144>\r\n <h2 class=\"m-heading text-h4 text-sm-h4 mb-3\">\r\n <a class=\"text-decoration-none text-right text-md-left\">#</a>\r\n CLI Creation\r\n </h2>\n<h3>Install Masa.Template</h3>\n<p>Masa.Template, contains all project templates of the MASA series. The corresponding template of MASA Blazor is named <code>masab</code></p>\n<pre><code>dotnet new --install Masa.Template\n</code></pre>\n<br/>\n<h3>Create project</h3>\n<p>Create a project based on the project template name and specify the output directory, which is the root folder of the project.</p>\n<pre><code>dotnet new masab -o MasaBlazorApp\n</code></pre>\n<blockquote>\n<p>The default is Server mode, through the parameter --mode WebAssembly to create a WebAssembly mode project.</p>\n</blockquote>\n<br/>\n<h3>Startup project</h3>\n<p>Switch to the MasaBlazorApp directory by command <code>cd MasaBlazorApp</code>. \nStart the project with <code>dotnet run</code>, open the corresponding URL according to the program output, and you can see the effect of the MASA Blazor template project.</p>\n<br/>\n\r\n </section><section id=section-773856508>\r\n <h2 class=\"m-heading text-h4 text-sm-h4 mb-3\">\r\n <a class=\"text-decoration-none text-right text-md-left\">#</a>\r\n Create manually\r\n </h2>\n<h3>Create a Blazor Server project</h3>\n<p>Create a new Blazor application named BlazorApp in the command line interface:</p>\n<pre><code class=\"language-sh\">$ dotnet new blazorserver -o BlazorApp\n</code></pre>\n<p>or</p>\n<pre><code class=\"language-sh\">$ dotnet new blazorwasm -o BlazorApp\n</code></pre>\n<blockquote>\n<p><code>blazorserver</code> is Blazor Server App template shortname。<code>blazorwasm</code> is Blazor WebAssembly App template shortname</p>\n</blockquote>\n<br/>\n<h3>Install NuGet package</h3>\n<pre><code class=\"language-sh\">$ dotnet add package Masa.Blazor\n</code></pre>\n<br/>\n<h3>Import resource files</h3>\n<h4>Blazor Server</h4>\n<p>in <code>Pages/_Host.cshtml</code> import resource files:</p>\n<pre><code class=\"language-html\"><!--masa blazor css style-->\n<link href="_content/Masa.Blazor/css/masa-blazor.css" rel="stylesheet" />\n<link href="_content/Masa.Blazor/css/masa-extend-blazor.css" rel="stylesheet" />\n<!--icon file,import need to use-->\n<link href="https://cdn.masastack.com/npm/@("@mdi")/[email protected]/css/materialdesignicons.min.css" rel="stylesheet">\n<link href="https://cdn.masastack.com/npm/materialicons/materialicons.css" rel="stylesheet">\n<link href="https://cdn.masastack.com/npm/fontawesome/v5.0.13/css/all.css" rel="stylesheet">\n<!--js(should lay the end of file)-->\n<script src="_content/BlazorComponent/js/blazor-component.js"></script>\n</code></pre>\n<br/>\n<h4>Blazor WebAssembly</h4>\n<p>in <code>wwwroot\\index.html</code> import resource files:</p>\n<pre><code class=\"language-html\"><link href="_content/Masa.Blazor/css/masa-blazor.css" rel="stylesheet" />\n<link href="_content/Masa.Blazor/css/masa-extend-blazor.css" rel="stylesheet" />\n\n<link href="https://cdn.masastack.com/npm/@mdi/[email protected]/css/materialdesignicons.min.css" rel="stylesheet">\n<link href="https://cdn.masastack.com/npm/materialicons/materialicons.css" rel="stylesheet">\n<link href="https://cdn.masastack.com/npm/fontawesome/v5.0.13/css/all.css" rel="stylesheet">\n\n<script src="_content/BlazorComponent/js/blazor-component.js"></script>\n</code></pre>\n<br/>\n<h3>Inject services</h3>\n<p>Program.cs file add Masa.Blazor related services:</p>\n<pre><code class=\"language-c#\">// Add services to the container.\nbuilder.Services.AddMasaBlazor();\n</code></pre>\n<br/>\n<h3>Global reference</h3>\n<p>update <code>_Imports.razor</code> file,Add:</p>\n<pre><code class=\"language-c#\">@using Masa.Blazor\n</code></pre>\n<p>update <code>Shared/MainLayout.razor</code> file,set MApp as root element:</p>\n<pre><code class=\"language-html\"><MApp> //layout </MApp>\n</code></pre>\n<br/>\n\r\n </section><section id=section-2023003>\r\n <h2 class=\"m-heading text-h4 text-sm-h4 mb-3\">\r\n <a class=\"text-decoration-none text-right text-md-left\">#</a>\r\n Use\r\n </h2>\n<p>Refer to official documents <a href=\"https://masa-blazor-docs-dev.lonsid.cn/components/application\">Component</a>,Add related components。\n<code>dotnet run</code> start project Preview the MasaBlazor。</p>\n</section>" | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -110,12 +110,11 @@ in `wwwroot\index.html` import resource files: | |
```html | ||
<link href="_content/Masa.Blazor/css/masa-blazor.css" rel="stylesheet" /> | ||
<link href="_content/Masa.Blazor/css/masa-extend-blazor.css" rel="stylesheet" /> | ||
<link | ||
href="https://cdn.jsdelivr.net/npm/@mdi/[email protected]/css/materialdesignicons.min.css" | ||
rel="stylesheet" | ||
/> | ||
<link href="https://fonts.googleapis.com/css2?family=Material+Icons" rel="stylesheet" /> | ||
<link href="https://use.fontawesome.com/releases/v5.0.13/css/all.css" rel="stylesheet" /> | ||
|
||
<link href="https://cdn.masastack.com/npm/@mdi/[email protected]/css/materialdesignicons.min.css" rel="stylesheet"> | ||
<link href="https://cdn.masastack.com/npm/materialicons/materialicons.css" rel="stylesheet"> | ||
<link href="https://cdn.masastack.com/npm/fontawesome/v5.0.13/css/all.css" rel="stylesheet"> | ||
|
||
<script src="_content/BlazorComponent/js/blazor-component.js"></script> | ||
``` | ||
|
||
|
Oops, something went wrong.