Skip to content

Commit 07233a7

Browse files
ArgoZhangArgoZhang
authored
doc(Layout): update sample (#4684)
* doc: 更正单词拼写错误 * doc: 精简示例样式 * refactor: 重构代码 * doc: 恢复 IsPage 文档 * style: 更新样式
1 parent 9a1b5cc commit 07233a7

File tree

6 files changed

+172
-167
lines changed

6 files changed

+172
-167
lines changed

‎src/BootstrapBlazor.Server/Components/Samples/Layouts.razor‎

Lines changed: 112 additions & 112 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@
1919
<p>
2020
<code>Layout</code>：@((MarkupString)Localizer["LayoutsDescription2_Layout"].Value)<br />
2121
<code>Header</code>：@Localizer["LayoutsDescription2_Header"]<br />
22-
<code>Sider</code>：@Localizer["LayoutsDescription2_Sider"]<br />
22+
<code>Side</code>：@Localizer["LayoutsDescription2_Side"]<br />
2323
<code>Main</code>：@Localizer["LayoutsDescription2_Main"]<br />
2424
<code>Footer</code>：@Localizer["LayoutsDescription2_Footer"]
2525
</p>
@@ -36,157 +36,157 @@
3636

3737
<h4>@Localizer["LayoutsDemosTitle"]</h4>
3838

39-
<div>
40-
<DemoBlock Title="@Localizer["LayoutsUpAndDownTitle"]"
41-
Introduction="@Localizer["LayoutsUpAndDownIntro"]"
42-
Name="UpAndDown">
39+
<DemoBlock Title="@Localizer["LayoutsUpAndDownTitle"]"
40+
Introduction="@Localizer["LayoutsUpAndDownIntro"]"
41+
Name="UpAndDown">
42+
<div class="layout-demo">
4343
<Layout ShowFooter="true">
4444
<Header>
45-
<div class="text-center header">Header</div>
45+
<div>Header</div>
4646
</Header>
4747
<Main>
48-
<div class="text-center main">Main</div>
48+
<div>Main</div>
4949
</Main>
5050
<Footer>
51-
<div class="text-center footer">Footer</div>
51+
<div>Footer</div>
5252
</Footer>
5353
</Layout>
54-
</DemoBlock>
54+
</div>
55+
</DemoBlock>
5556

56-
<DemoBlock Title="@Localizer["LayoutsMiddleLeftRightTitle"]"
57-
Introduction="@Localizer["LayoutsMiddleLeftRightIntro"]"
58-
Name="MiddleLeftRight">
57+
<DemoBlock Title="@Localizer["LayoutsMiddleLeftRightTitle"]"
58+
Introduction="@Localizer["LayoutsMiddleLeftRightIntro"]"
59+
Name="MiddleLeftRight">
60+
<div class="layout-demo">
5961
<Layout ShowFooter="true">
6062
<Header>
61-
<div class="text-center header">Header</div>
63+
<div>Header</div>
6264
</Header>
6365
<Side>
64-
<div class="text-center side">Side</div>
66+
<div>Side</div>
6567
</Side>
6668
<Main>
67-
<div class="text-center main">Main</div>
69+
<div>Main</div>
6870
</Main>
6971
<Footer>
70-
<div class="text-center footer">Footer</div>
72+
<div>Footer</div>
7173
</Footer>
7274
</Layout>
73-
</DemoBlock>
75+
</div>
76+
</DemoBlock>
7477

75-
<DemoBlock Title="@Localizer["LayoutsLeftRightTitle"]"
76-
Introduction="@Localizer["LayoutsLeftRightIntro"]"
77-
Name="LeftRight">
78+
<DemoBlock Title="@Localizer["LayoutsLeftRightTitle"]"
79+
Introduction="@Localizer["LayoutsLeftRightIntro"]"
80+
Name="LeftRight">
81+
<div class="layout-demo">
7882
<Layout ShowFooter="true" IsFullSide="true">
7983
<Header>
80-
<div class="text-center header">Header</div>
84+
<div>Header</div>
8185
</Header>
8286
<Side>
83-
<div class="text-center side">Side</div>
87+
<div>Side</div>
8488
</Side>
8589
<Main>
86-
<div class="text-center main">Main</div>
90+
<div>Main</div>
8791
</Main>
8892
<Footer>
89-
<div class="text-center footer">Footer</div>
93+
<div>Footer</div>
9094
</Footer>
9195
</Layout>
92-
</DemoBlock>
96+
</div>
97+
</DemoBlock>
9398

94-
<DemoBlock Title="@Localizer["LayoutsCustomPercentTitle"]"
95-
Introduction="@Localizer["LayoutsCustomPercentIntro"]"
96-
Name="CuntomPercent">
99+
<DemoBlock Title="@Localizer["LayoutsCustomPercentTitle"]"
100+
Introduction="@Localizer["LayoutsCustomPercentIntro"]"
101+
Name="CustomPercent">
102+
<div class="layout-demo">
97103
<Layout ShowFooter="true" SideWidth="200">
98104
<Header>
99-
<div class="text-center header">Header</div>
105+
<div>Header</div>
100106
</Header>
101107
<Side>
102-
<div class="text-center side">Side</div>
108+
<div>Side</div>
103109
</Side>
104110
<Main>
105-
<div class="text-center main">Main</div>
111+
<div>Main</div>
106112
</Main>
107113
<Footer>
108-
<div class="text-center footer">Footer</div>
114+
<div>Footer</div>
109115
</Footer>
110116
</Layout>
111-
</DemoBlock>
112-
113-
<DemoBlock Title="@Localizer["LayoutsAppTitle"]"
114-
Introduction="@Localizer["LayoutsAppIntro"]"
115-
Name="App">
116-
<div>@Localizer["LayoutsAppTips1"]</div>
117-
<ul class="mt-2">
118-
<li>
119-
<div>@Localizer["LayoutsAppTips2"]</div>
120-
</li>
121-
<li>
122-
<div>@Localizer["LayoutsAppTips3"]</div>
123-
</li>
124-
</ul>
125-
<div>@Localizer["LayoutsAppTips4"]</div>
126-
<p>
127-
@((MarkupString)Localizer["LayoutsAppTips5"].Value)
128-
</p>
129-
<p>
130-
@Localizer["LayoutsAppTips6"]
131-
</p>
132-
<Tips>
133-
@((MarkupString)Localizer["LayoutsAppTips7"].Value)
134-
</Tips>
135-
<div class="layout-demo layout-demo1">
136-
<Layout ShowFooter="true" SideWidth="160px">
137-
<Header>
138-
<div class="d-flex justify-content-center align-items-center header">Header</div>
139-
</Header>
140-
<Side>
141-
<div style="position: absolute; top: 0; left:0; right: 0; bottom: 0; overflow: auto; border-right: 1px solid rgba(0,0,0,.125); padding: 6px 0;">
142-
<Menu Items="@IconSideMenuItems" DisableNavigation="true" IsVertical="true"></Menu>
143-
</div>
144-
</Side>
145-
<Main>
146-
<div style="padding: 1rem;">Main</div>
147-
</Main>
148-
<Footer>
149-
<div class="d-flex justify-content-center align-items-center footer">Footer</div>
150-
</Footer>
151-
</Layout>
152-
</div>
153-
<p class="mt-3">
154-
@Localizer["LayoutsAppTips8"]
155-
</p>
156-
<div class="layout-demo layout-demo2">
157-
<Layout ShowFooter="true" SideWidth="160px">
158-
<Header>
159-
<div class="d-flex justify-content-center align-items-center header">Header</div>
160-
</Header>
161-
<Side>
162-
<div style="border-right: 1px solid rgba(0,0,0,.125); padding: 6px 0;">
163-
<Menu Items="@IconSideMenuItems" DisableNavigation="true" IsVertical="true"></Menu>
164-
</div>
165-
</Side>
166-
<Main>
167-
<div style="padding: 1rem;">Main</div>
168-
</Main>
169-
<Footer>
170-
<div class="d-flex justify-content-center align-items-center footer">Footer</div>
171-
</Footer>
172-
</Layout>
173-
</div>
174-
<p class="mt-3">
175-
@((MarkupString)Localizer["LayoutsAppTips9"].Value)
176-
</p>
177-
</DemoBlock>
178-
179-
<DemoBlock Title="@Localizer["LayoutsPageTitle"]"
180-
Introduction="@Localizer["LayoutsPageIntro"]"
181-
Name="Page">
182-
<Tips>@((MarkupString)Localizer["LayoutsPageTips1"].Value)</Tips>
183-
184-
<ul class="page-layout-demo-list">
185-
<li>
186-
<a href="layout-page" target="_blank">@Localizer["LayoutsPageHrefTitle"]</a>
187-
</li>
188-
</ul>
189-
</DemoBlock>
190-
</div>
117+
</div>
118+
</DemoBlock>
119+
120+
<DemoBlock Title="@Localizer["LayoutsAppTitle"]"
121+
Introduction="@Localizer["LayoutsAppIntro"]"
122+
Name="App">
123+
<div>@Localizer["LayoutsAppTips1"]</div>
124+
<ul class="mt-2">
125+
<li>
126+
<div>@Localizer["LayoutsAppTips2"]</div>
127+
</li>
128+
<li>
129+
<div>@Localizer["LayoutsAppTips3"]</div>
130+
</li>
131+
</ul>
132+
<div>@Localizer["LayoutsAppTips4"]</div>
133+
<p>
134+
@((MarkupString)Localizer["LayoutsAppTips5"].Value)
135+
</p>
136+
<p>
137+
@Localizer["LayoutsAppTips6"]
138+
</p>
139+
<Tips>
140+
@((MarkupString)Localizer["LayoutsAppTips7"].Value)
141+
</Tips>
142+
<div class="layout-demo1">
143+
<Layout ShowFooter="true" SideWidth="160px" Menus="IconSideMenuItems1">
144+
<Header>
145+
<div>Header</div>
146+
</Header>
147+
<Side>
148+
</Side>
149+
<Main>
150+
<div>Main</div>
151+
</Main>
152+
<Footer>
153+
<div>Footer</div>
154+
</Footer>
155+
</Layout>
156+
</div>
157+
<p class="mt-3">
158+
@Localizer["LayoutsAppTips8"]
159+
</p>
160+
<div class="layout-demo2">
161+
<Layout ShowFooter="true" SideWidth="160px" Menus="IconSideMenuItems2">
162+
<Header>
163+
<div>Header</div>
164+
</Header>
165+
<Side>
166+
</Side>
167+
<Main>
168+
<div>Main</div>
169+
</Main>
170+
<Footer>
171+
<div>Footer</div>
172+
</Footer>
173+
</Layout>
174+
</div>
175+
<p class="mt-3">
176+
@((MarkupString)Localizer["LayoutsAppTips9"].Value)
177+
</p>
178+
</DemoBlock>
179+
180+
<DemoBlock Title="@Localizer["LayoutsPageTitle"]"
181+
Introduction="@Localizer["LayoutsPageIntro"]"
182+
Name="Page">
183+
<Tips>@((MarkupString)Localizer["LayoutsPageTips1"].Value)</Tips>
184+
185+
<ul class="page-layout-demo-list">
186+
<li>
187+
<a href="layout-page" target="_blank">@Localizer["LayoutsPageHrefTitle"]</a>
188+
</li>
189+
</ul>
190+
</DemoBlock>
191191

192192
<AttributeTable Items="@GetAttributes()" />

‎src/BootstrapBlazor.Server/Components/Samples/Layouts.razor.cs‎

Lines changed: 13 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,9 @@ namespace BootstrapBlazor.Server.Components.Samples;
1010
/// </summary>
1111
public sealed partial class Layouts
1212
{
13-
private IEnumerable<MenuItem>? IconSideMenuItems { get; set; }
13+
private List<MenuItem>? IconSideMenuItems1 { get; set; }
14+
15+
private List<MenuItem>? IconSideMenuItems2 { get; set; }
1416

1517
/// <summary>
1618
/// OnInitializedAsync 方法
@@ -20,7 +22,8 @@ protected override async Task OnInitializedAsync()
2022
{
2123
await base.OnInitializedAsync();
2224

23-
IconSideMenuItems = await MenusDataGenerator.GetIconSideMenuItemsAsync(LocalizerMenu);
25+
IconSideMenuItems1 = await MenusDataGenerator.GetIconSideMenuItemsAsync(LocalizerMenu);
26+
IconSideMenuItems2 = await MenusDataGenerator.GetIconSideMenuItemsAsync(LocalizerMenu);
2427
}
2528

2629
private AttributeItem[] GetAttributes() =>
@@ -73,6 +76,14 @@ private AttributeItem[] GetAttributes() =>
7376
ValueList = " — ",
7477
DefaultValue = " — "
7578
},
79+
new()
80+
{
81+
Name = "IsPage",
82+
Description = Localizer["Layouts_IsPage_Description"],
83+
Type = "bool",
84+
ValueList = "true|false",
85+
DefaultValue = "false"
86+
},
7687
new() {
7788
Name = "IsFullSide",
7889
Description = Localizer["Layouts_IsFullSide_Description"],

0 commit comments

Comments
 (0)