!3664 doc(#I67B60): update Anchor demo

* Merge branch 'main' into I67B60-Anchor
* update Anchor demos

src/BootstrapBlazor.Shared/Demos/Anchor/AnchorNormal.razor

@@ -0,0 +1,25 @@
+@inject IStringLocalizer<AnchorNormal> Localizer
+<p>@((MarkupString)Localizer["IntroText2"].Value)</p>
+<ul class="demo-ul">
+    <li>
+        <Anchor Target="anchor1" Offset="50">Anchor1</Anchor>
+    </li>
+    <li>
+        <Anchor Target="anchor2" Offset="50">Anchor2</Anchor>
+    </li>
+    <li>
+        <Anchor Target="anchor3" Offset="50">Anchor3</Anchor>
+    </li>
+    <li>
+        <Anchor Target="anchor4" Offset="50">Anchor4</Anchor>
+    </li>
+</ul>
+
+<h4 id="anchor1">Archor1</h4>
+<div>@((MarkupString)Localizer["ContentText1"].Value)</div>
+<h4 id="anchor2">Archor2</h4>
+<div>@((MarkupString)Localizer["ContentText1"].Value)</div>
+<h4 id="anchor3">Archor3</h4>
+<div>@((MarkupString)Localizer["ContentText1"].Value)</div>
+<h4 id="anchor4">Archor4</h4>
+<div>@((MarkupString)Localizer["ContentText1"].Value)</div>

src/BootstrapBlazor.Shared/Locales/en.json

@@ -4168,7 +4168,9 @@
     "Title": "Anchor",
     "SubTitle": "Hyperlinks to scroll on one page.",
     "BaseUsageText": "Basic usage",
-    "IntroText1": "For displaying anchor hyperlinks on page and jumping between them.",
+    "IntroText1": "For displaying anchor hyperlinks on page and jumping between them."
+  },
+  "BootstrapBlazor.Shared.Demos.Anchor.AnchorNormal": {
     "IntroText2": "Click <code>Anchor</code> item try it",
     "ContentText1": "<p>Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p><p>Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</p><p>Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.</p><p>Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p><p>Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</p>",
     "Desc1": "Anchor Target Id",

src/BootstrapBlazor.Shared/Locales/zh.json

@@ -4167,7 +4167,9 @@
     "Title": "Anchor 锚点",
     "SubTitle": "用于跳转到页面指定位置",
     "BaseUsageText": "基础用法",
-    "IntroText1": "需要展现当前页面上可供跳转的锚点链接，以及快速在锚点之间跳转",
+    "IntroText1": "需要展现当前页面上可供跳转的锚点链接，以及快速在锚点之间跳转"
+  },
+  "BootstrapBlazor.Shared.Demos.Anchor.AnchorNormal": {
     "IntroText2": "点击下面 <code>Anchor</code> 项目，页面滚动到相对应的章节",
     "ContentText1": "<p>与现实生活一致：与现实生活的流程、逻辑保持一致，遵循用户习惯的语言和概念；在界面中一致：所有的元素和结构需保持一致，比如：设计样式、图标和文本、元素的位置等。</p><p>控制反馈：通过界面样式和交互动效让用户可以清晰的感知自己的操作；</p><p>页面反馈：操作后，通过页面元素的变化清晰地展现当前状态。</p><p>简化流程：设计简洁直观的操作流程；</p><p>清晰明确：语言表达清晰且表意明确，让用户快速理解进而作出决策；</p><p>帮助用户识别：界面简单直白，让用户快速识别而非回忆，减少用户记忆负担。</p>",
     "Desc1": "锚点目标 Id",

src/BootstrapBlazor.Shared/Samples/Anchors.razor

@@ -4,23 +4,54 @@
 
 <h4>@Localizer["SubTitle"]</h4>
 
-<DemoBlock Title="@Localizer["BaseUsageText"]" Introduction="@Localizer["IntroText1"]" Name="Normal">
-    <p>@((MarkupString)Localizer["IntroText2"].Value)</p>
-    <ul class="demo-ul">
-        <li><Anchor Target="anchor1" Offset="50">Anchor1</Anchor></li>
-        <li><Anchor Target="anchor2" Offset="50">Anchor2</Anchor></li>
-        <li><Anchor Target="anchor3" Offset="50">Anchor3</Anchor></li>
-        <li><Anchor Target="anchor4" Offset="50">Anchor4</Anchor></li>
-    </ul>
+<DemoBlock Title="@Localizer["BaseUsageText"]" Introduction="@Localizer["IntroText1"]" Name="Normal" demo="Anchor.AnchorNormal"/>
 
-    <h4 id="anchor1">Archor1</h4>
-    <div>@((MarkupString)Localizer["ContentText1"].Value)</div>
-    <h4 id="anchor2">Archor2</h4>
-    <div>@((MarkupString)Localizer["ContentText1"].Value)</div>
-    <h4 id="anchor3">Archor3</h4>
-    <div>@((MarkupString)Localizer["ContentText1"].Value)</div>
-    <h4 id="anchor4">Archor4</h4>
-    <div>@((MarkupString)Localizer["ContentText1"].Value)</div>
-</DemoBlock>
+<AttributeTable Items="@GetAttributes()"/>
 
-<AttributeTable Items="@GetAttributes()" />
+@code
+{
+    [Inject]
+    [NotNull]
+    private IStringLocalizer<Anchors>? Localizer { get; set; }
+
+    /// <summary>
+    /// 获得属性方法
+    /// </summary>
+    /// <returns></returns>
+    private IEnumerable<AttributeItem> GetAttributes() => new[]
+    {
+        new AttributeItem()
+        {
+            Name = "Target",
+            Description = Localizer["Desc1"],
+            Type = "string",
+            ValueList = " — ",
+            DefaultValue = " — "
+        },
+        new AttributeItem()
+        {
+            Name = "Container",
+            Description = Localizer["Desc2"],
+            Type = "string",
+            ValueList = " — ",
+            DefaultValue = " — "
+        },
+        new AttributeItem()
+        {
+            Name = "Offset",
+            Description = Localizer["Desc3"],
+            Type = "int",
+            ValueList = " — ",
+            DefaultValue = "0"
+        },
+        new AttributeItem()
+        {
+            Name = "ChildContent",
+            Description = Localizer["Desc4"],
+            Type = "RenderFragment",
+            ValueList = " — ",
+            DefaultValue = " — "
+        }
+    };
+
+}

src/BootstrapBlazor.Shared/Samples/Anchors.razor.cs

@@ -1,52 +0,0 @@
-// Copyright (c) Argo Zhang (argo@163.com). All rights reserved.
-// Licensed under the Apache License, Version 2.0. See License.txt in the project root for license information.
-// Website: https://www.blazor.zone or https://argozhang.github.io/
-
-namespace BootstrapBlazor.Shared.Samples;
-
-/// <summary>
-/// 
-/// </summary>
-public sealed partial class Anchors
-{
-    [Inject]
-    [NotNull]
-    private IStringLocalizer<Anchors>? Localizer { get; set; }
-
-    /// <summary>
-    /// 获得属性方法
-    /// </summary>
-    /// <returns></returns>
-    private IEnumerable<AttributeItem> GetAttributes() => new[]
-    {
-            // TODO: 移动到数据库中
-            new AttributeItem() {
-                Name = "Target",
-                Description = Localizer["Desc1"],
-                Type = "string",
-                ValueList = " — ",
-                DefaultValue = " — "
-            },
-            new AttributeItem() {
-                Name = "Container",
-                Description = Localizer["Desc2"],
-                Type = "string",
-                ValueList = " — ",
-                DefaultValue = " — "
-            },
-            new AttributeItem() {
-                Name = "Offset",
-                Description = Localizer["Desc3"],
-                Type = "int",
-                ValueList = " — ",
-                DefaultValue = "0"
-            },
-            new AttributeItem() {
-                Name = "ChildContent",
-                Description = Localizer["Desc4"],
-                Type = "RenderFragment",
-                ValueList = " — ",
-                DefaultValue = " — "
-            }
-        };
-}