Skip to content

Commit ad9054d

Browse files
ArgoZhangCopilot
andauthored
doc(Theme): improve documentation localization (#8387)
* fix(Table): keep configured column width stable Apply explicit width constraints to table headers instead of inner header text so rendered widths match fixed-column offsets. Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com> * chore: bump version 10.10.0 * doc(Theme): improve documentation localization Add the Fluent theme package tip, localize the component preview description, and replace numeric resource keys with semantic names. Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com> --------- Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
1 parent 24c50ef commit ad9054d

3 files changed

Lines changed: 62 additions & 59 deletions

File tree

‎src/BootstrapBlazor.Server/Components/Pages/Theme.razor‎

Lines changed: 18 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -3,41 +3,42 @@
33
@inject MessageService MessageService
44
@inject ToastService ToastService
55

6-
<h3>@Localizer["H1"]</h3>
6+
<h3>@Localizer["Title"]</h3>
77

8-
<h4>@Localizer["H2"]</h4>
8+
<h4>@Localizer["BuiltInThemesTitle"]</h4>
99

10-
<p>@Localizer["P1"]:</p>
10+
<p>@Localizer["SupportedThemesDescription"]:</p>
1111

1212
<ul class="ul-demo">
13-
<li>@Localizer["P2"]</li>
14-
<li>@Localizer["P11"]</li>
15-
<li>@Localizer["P3"]</li>
16-
<li>@Localizer["P4"]</li>
17-
<li>@Localizer["P5"]</li>
13+
<li>@Localizer["MotronicTheme"]</li>
14+
<li>@Localizer["FluentTheme"]</li>
15+
<li>@Localizer["LayUITheme"]</li>
16+
<li>@Localizer["BlumaTheme"]</li>
17+
<li>@Localizer["AntDesignTheme"]</li>
1818
</ul>
1919

20-
<h4>@Localizer["P6"]</h4>
20+
<PackageTips Name="BootstrapBlazor.Theme.Fluent" />
2121

22-
<p>@Localizer["P12"] <code>head</code> @Localizer["P14"]:</p>
22+
<h4>@Localizer["ThemeSwitchTitle"]</h4>
2323

24-
<Pre>// @Localizer["P23"]
24+
<p>@Localizer["ThemeStylesPrefix"] <code>head</code> @Localizer["ThemeStylesSuffix"]:</p>
25+
26+
<Pre>// @Localizer["RequiredBaseStylesheet"]
2527
&lt;link rel="stylesheet" href="_content/BootstrapBlazor/css/bootstrap.blazor.bundle.min.css"&gt;
2628

27-
// @Localizer["P15"] Fluent UI
28-
dotnet add package BootstrapBlazor.Theme.Fluent
29+
// @Localizer["EnableTheme"] Fluent UI
2930
&lt;link rel="stylesheet" href="_content/BootstrapBlazor.Theme.Fluent/fluent.css"&gt;
3031

31-
// @Localizer["P19"] Motronic
32+
// @Localizer["OptionalTheme"] Motronic
3233
&lt;link rel="stylesheet" href="_content/BootstrapBlazor/css/motronic.min.css"&gt;</Pre>
3334

34-
<p>@Localizer["P24"] <code>BootstrapBlazor.Theme.Fluent</code> @Localizer["P25"] <code>_content/BootstrapBlazor.Theme.Fluent/fluent.css</code></p>
35+
<p>@Localizer["FluentPackagePrefix"] <code>BootstrapBlazor.Theme.Fluent</code> @Localizer["FluentPackageSuffix"] <code>_content/BootstrapBlazor.Theme.Fluent/fluent.css</code></p>
3536

36-
<p>@Localizer["P16"] <code>data-bs-theme</code> @Localizer["P17"] <code>&lt;html&gt;</code> @Localizer["P20"] <code>data-bs-theme="dark"</code> @Localizer["P21"] <code>ThemeProvider</code> @Localizer["P22"]</p>
37+
<p>@Localizer["ThemeModeIntro"] <code>data-bs-theme</code> @Localizer["ThemeModeAttributePlacement"] <code>&lt;html&gt;</code> @Localizer["ThemeModeDarkSetting"] <code>data-bs-theme="dark"</code> @Localizer["ThemeModeRuntimeSwitch"] <code>ThemeProvider</code> @Localizer["ThemeModeSiteButtonReference"]</p>
3738

3839
<h4>Component preview</h4>
3940

40-
<p>Sections below exercise the core components with minimal parameters. Use the theme button at the bottom-right corner of this site to switch between Fluent UI, Motronic and Bootstrap in light or dark mode and eyeball the result in one place.</p>
41+
<p>@Localizer["ComponentPreviewDescription"]</p>
4142

4243
<h4>Buttons</h4>
4344

‎src/BootstrapBlazor.Server/Locales/en-US.json‎

Lines changed: 22 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -724,27 +724,28 @@
724724
"Title": "Project Template"
725725
},
726726
"BootstrapBlazor.Server.Components.Pages.Theme": {
727-
"H1": "Component theme",
728-
"H2": "Built-in Themes",
729-
"P1": "The current website theme supports the following",
730-
"P11": "Fluent UI (integrated)",
731-
"P12": "Theme styles are provided as static web assets. In the",
732-
"P14": "section, add the theme stylesheet after the base bundle",
733-
"P15": "Enable",
734-
"P16": "The built-in themes support both light and dark modes through the",
735-
"P17": "attribute on the",
736-
"P19": "Optional theme:",
737-
"P2": "Motronic (integrated)",
738-
"P20": "element: set",
739-
"P21": "for dark mode, or toggle it at runtime with the",
740-
"P22": "component, just like the mode button at the bottom-right corner of this site",
741-
"P23": "Required base stylesheet",
742-
"P24": "The Fluent UI theme is distributed through the standalone NuGet package",
743-
"P25": "and its stylesheet is available at",
744-
"P3": "LayUI (in progress)",
745-
"P4": "Bluma (in progress)",
746-
"P5": "Ant Design (in progress)",
747-
"P6": "Theme switch"
727+
"AntDesignTheme": "Ant Design (in progress)",
728+
"BlumaTheme": "Bluma (in progress)",
729+
"BuiltInThemesTitle": "Built-in Themes",
730+
"ComponentPreviewDescription": "The sections below demonstrate core components with minimal parameters. Use the theme button at the bottom-right corner of this site to switch Fluent UI, Motronic, and Bootstrap between light and dark modes and compare their appearance on one page.",
731+
"EnableTheme": "Enable",
732+
"FluentPackagePrefix": "The Fluent UI theme is distributed through the standalone NuGet package",
733+
"FluentPackageSuffix": "and its stylesheet is available at",
734+
"FluentTheme": "Fluent UI (integrated)",
735+
"LayUITheme": "LayUI (in progress)",
736+
"MotronicTheme": "Motronic (integrated)",
737+
"OptionalTheme": "Optional theme:",
738+
"RequiredBaseStylesheet": "Required base stylesheet",
739+
"SupportedThemesDescription": "The current website theme supports the following",
740+
"ThemeModeAttributePlacement": "attribute on the",
741+
"ThemeModeDarkSetting": "element: set",
742+
"ThemeModeIntro": "The built-in themes support both light and dark modes through the",
743+
"ThemeModeRuntimeSwitch": "for dark mode, or toggle it at runtime with the",
744+
"ThemeModeSiteButtonReference": "component, just like the mode button at the bottom-right corner of this site",
745+
"ThemeStylesPrefix": "Theme styles are provided as static web assets. In the",
746+
"ThemeStylesSuffix": "section, add the theme stylesheet after the base bundle",
747+
"ThemeSwitchTitle": "Theme switch",
748+
"Title": "Component theme"
748749
},
749750
"BootstrapBlazor.Server.Components.Samples.Affixs": {
750751
"AffixIntro": "Fix the element to a specific visible area",

‎src/BootstrapBlazor.Server/Locales/zh-CN.json‎

Lines changed: 22 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -724,27 +724,28 @@
724724
"Title": "项目模板"
725725
},
726726
"BootstrapBlazor.Server.Components.Pages.Theme": {
727-
"H1": "组件主题",
728-
"H2": "内置主题",
729-
"P1": "目前网站主题支持如下",
730-
"P11": "Fluent UI (已集成)",
731-
"P12": "主题样式通过静态 Web 资源提供,请在",
732-
"P14": "内、基础样式之后增加对应的主题样式文件即可",
733-
"P15": "启用",
734-
"P16": "内置主题通过",
735-
"P17": "属性适配明暗两种模式,该属性设置于",
736-
"P19": "可选主题:",
737-
"P2": "Motronic (已集成)",
738-
"P20": "元素上,设置",
739-
"P21": "即为深色模式,也可以在运行时通过",
740-
"P22": "组件切换,与本站右下角的模式按钮一致",
741-
"P23": "基础样式(必需)",
742-
"P24": "Fluent UI 主题由独立 NuGet 包",
743-
"P25": "提供,样式资源路径为",
744-
"P3": "LayUI (完善中)",
745-
"P4": "Bluma (完善中)",
746-
"P5": "Ant Design (完善中)",
747-
"P6": "主题切换"
727+
"AntDesignTheme": "Ant Design (完善中)",
728+
"BlumaTheme": "Bluma (完善中)",
729+
"BuiltInThemesTitle": "内置主题",
730+
"ComponentPreviewDescription": "以下区域使用最少参数展示核心组件。可通过本站右下角的主题按钮切换 Fluent UI、Motronic 与 Bootstrap 的明暗模式,并在同一页面中直观比较显示效果。",
731+
"EnableTheme": "启用",
732+
"FluentPackagePrefix": "Fluent UI 主题由独立 NuGet 包",
733+
"FluentPackageSuffix": "提供,样式资源路径为",
734+
"FluentTheme": "Fluent UI (已集成)",
735+
"LayUITheme": "LayUI (完善中)",
736+
"MotronicTheme": "Motronic (已集成)",
737+
"OptionalTheme": "可选主题:",
738+
"RequiredBaseStylesheet": "基础样式(必需)",
739+
"SupportedThemesDescription": "目前网站主题支持如下",
740+
"ThemeModeAttributePlacement": "属性适配明暗两种模式,该属性设置于",
741+
"ThemeModeDarkSetting": "元素上,设置",
742+
"ThemeModeIntro": "内置主题通过",
743+
"ThemeModeRuntimeSwitch": "即为深色模式,也可以在运行时通过",
744+
"ThemeModeSiteButtonReference": "组件切换,与本站右下角的模式按钮一致",
745+
"ThemeStylesPrefix": "主题样式通过静态 Web 资源提供,请在",
746+
"ThemeStylesSuffix": "内、基础样式之后增加对应的主题样式文件即可",
747+
"ThemeSwitchTitle": "主题切换",
748+
"Title": "组件主题"
748749
},
749750
"BootstrapBlazor.Server.Components.Samples.Affixs": {
750751
"AffixIntro": "将页面元素钉在可视范围",

0 commit comments

Comments
 (0)