Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update demo titles and descriptions (#8530) #8572

Closed
wants to merge 1 commit into from
Closed

Update demo titles and descriptions (#8530) #8572

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion ...o/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/BitToggleButtonDemo.razor
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -209,7 +209,7 @@
</ExamplePreview>
</ComponentExampleBox>

<ComponentExampleBox Title="Controlled" RazorCode="@example6RazorCode" CsharpCode="@example6CsharpCode" Id="example6">
<ComponentExampleBox Title="Binding" RazorCode="@example6RazorCode" CsharpCode="@example6CsharpCode" Id="example6">
<ExamplePreview>
<div>Explore default checked state, two-way binding, and handling change events for a customizable user experience.</div>
<br />
Expand Down
6 changes: 2 additions & 4 deletions ...ient/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Calendar/BitCalendarDemo.razor
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -231,25 +231,23 @@

<ComponentExampleBox Title="RTL" RazorCode="@example10RazorCode" Id="example10">
<ExamplePreview>
<div>Use BitCalendar in a right-to-left (RTL) layout.</div>
<div>Use BitCalendar in right-to-left (RTL).</div>
<br />
<div class="example-content">
<BitCalendar Dir="BitDir.Rtl" />
</div>
</ExamplePreview>
</ComponentExampleBox>

<ComponentExampleBox Title="Hour/minute step" RazorCode="@example11RazorCode" Id="example11">
<ComponentExampleBox Title="Hour/Minute step" RazorCode="@example11RazorCode" Id="example11">
<ExamplePreview>
<div>Customizes the step increments for hours and minutes in the time picker.</div>
<br /><br />
<div class="example-content">
<div>HourStep = 2:</div>
<br />
<BitCalendar ShowTimePicker="true" HourStep="2" />

<br />

<div>MinuteStep = 15:</div>
<br />
<BitCalendar ShowTimePicker="true" MinuteStep="15" />
Expand Down
2 changes: 1 addition & 1 deletion ...ient/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razor
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -176,7 +176,7 @@

<ComponentExampleBox Title="RTL" RazorCode="@example10RazorCode" Id="example10">
<ExamplePreview>
<div>Use BitCheckbox in a right-to-left (RTL).</div>
<div>Use BitCheckbox in right-to-left (RTL).</div>
<br />
<div dir="rtl">
<BitCheckbox Dir="BitDir.Rtl" Label="چکباکس راست به چپ" />
Expand Down
12 changes: 6 additions & 6 deletions ...it.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ColorPicker/BitColorPickerDemo.razor
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -68,7 +68,7 @@
</ExamplePreview>
</ComponentExampleBox>

<ComponentExampleBox Title="Public Api" RazorCode="@example5RazorCode" CsharpCode="@example5CsharpCode" Id="example5">
<ComponentExampleBox Title="Public API" RazorCode="@example5RazorCode" CsharpCode="@example5CsharpCode" Id="example5">
<ExamplePreview>
<div>Explore the public API of the BitColorPicker component, including how to access different color formats such as Hex, RGB, RGBA, and HSV using component references.</div>
<br /><br />
Expand All @@ -84,18 +84,18 @@
</ExamplePreview>
</ComponentExampleBox>

<ComponentExampleBox Title="Class & Style" RazorCode="@example6RazorCode" Id="example6">
<ComponentExampleBox Title="Style & Class" RazorCode="@example6RazorCode" Id="example6">
<ExamplePreview>
<div>Apply custom CSS classes and styles to the BitColorPicker component for tailoring its appearance to fit your design needs.</div>
<br /><br />
<div class="example-content">
<div>Class</div>
<br />
<BitColorPicker ShowAlphaSlider Class="custom-class" />
<br /><br /><br />
<div>Style</div>
<br />
<BitColorPicker ShowAlphaSlider Style="width: 230px; height: 150px;" />
<br /><br /><br />
<div>Class</div>
<br />
<BitColorPicker ShowAlphaSlider Class="custom-class" />
</div>
</ExamplePreview>
</ComponentExampleBox>
Expand Down
5 changes: 3 additions & 2 deletions ...BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ColorPicker/BitColorPickerDemo.razor.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -128,7 +128,8 @@ public partial class BitColorPickerDemo
}
</style>

<BitColorPicker ShowAlphaSlider Class=""custom-class"" />

<BitColorPicker ShowAlphaSlider Style=""width: 250px; height: 150px;"" />";
<BitColorPicker ShowAlphaSlider Style=""""width: 250px; height: 150px;"""" />

<BitColorPicker ShowAlphaSlider Class=""""custom-class"""" />"";";
}
4 changes: 2 additions & 2 deletions .../Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DatePicker/BitDatePickerDemo.razor
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -254,7 +254,7 @@

<ComponentExampleBox Title="RTL" RazorCode="@example11RazorCode" Id="example11">
<ExamplePreview>
<div>Use BitDatePicker in a right-to-left (RTL) layout.</div>
<div>Use BitDatePicker in right-to-left (RTL).</div>
<br />
<div dir="rtl">
<div class="example-content">
Expand All @@ -264,7 +264,7 @@
</ExamplePreview>
</ComponentExampleBox>

<ComponentExampleBox Title="Hour/minute step" RazorCode="@example12RazorCode" Id="example12">
<ComponentExampleBox Title="Hour/Minute step" RazorCode="@example12RazorCode" Id="example12">
<ExamplePreview>
<div>Adjust the increment step for hours and minutes when using the BitDatePicker's time selection feature.</div>
<br />
Expand Down
4 changes: 2 additions & 2 deletions ...rUI.Demo.Client.Core/Pages/Components/Inputs/DateRangePicker/BitDateRangePickerDemo.razor
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -177,7 +177,7 @@
</ExamplePreview>
</ComponentExampleBox>

<ComponentExampleBox Title="Hour/minute step" RazorCode="@example8RazorCode" Id="example8">
<ComponentExampleBox Title="Hour/Minute step" RazorCode="@example8RazorCode" Id="example8">
<ExamplePreview>
<div>Adjust the increment step for hours and minutes when using the BitDateRangePicker's time selection feature.</div>
<br />
Expand Down Expand Up @@ -272,7 +272,7 @@

<ComponentExampleBox Title="RTL" RazorCode="@example11RazorCode" Id="example11">
<ExamplePreview>
<div>Use BitDateRangePicker in a right-to-left (RTL) layout.</div>
<div>Use BitDateRangePicker in right-to-left (RTL).</div>
<br />
<div dir="rtl">
<div class="example-content">
Expand Down
1 change: 1 addition & 0 deletions ...t/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/BitDropdownDemo.razor.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -398,6 +398,7 @@ public partial class BitDropdownDemo
Description = "The template for items that have not yet been rendered in virtualization mode.",
}
];

private readonly List<ComponentSubClass> componentSubClasses =
[
new()
Expand Down
4 changes: 2 additions & 2 deletions .../Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/FileUpload/BitFileUploadDemo.razor
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
ComponentSubClasses="componentSubClasses"
ComponentSubEnums="componentSubEnums">

<ComponentExampleBox Title="Basic FileUpload" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
<ComponentExampleBox Title="Basic" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
<ExamplePreview>
<div class="example-desc">Files can be uploaded automatically after selecting them.</div>
<div>
Expand Down Expand Up @@ -119,7 +119,7 @@
</ExamplePreview>
</ComponentExampleBox>

<ComponentExampleBox Title="Custom FileUpload" RazorCode="@example9RazorCode" CsharpCode="@example9CsharpCode" Id="example9">
<ComponentExampleBox Title="Templates" RazorCode="@example9RazorCode" CsharpCode="@example9CsharpCode" Id="example9">
<ExamplePreview>
<div class="example-desc">Use custom template for file upload.</div>
<div>
Expand Down
4 changes: 2 additions & 2 deletions ...ient/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/OtpInput/BitOtpInputDemo.razor
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -188,8 +188,8 @@

<ComponentExampleBox Title="RTL" RazorCode="@example10RazorCode" Id="example10">
<ExamplePreview>
<div>Use the BitOtpInput component in right-to-left (RTL).</div>
<br />
<div>Use BitOtpInput in right-to-left (RTL).</div>
<br /><br />
<div dir="rtl">
<BitOtpInput Label="Default" Dir="BitDir.Rtl" />
<br /><br />
Expand Down
2 changes: 1 addition & 1 deletion ...nt/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/TextField/BitTextFieldDemo.razor
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@
</ExamplePreview>
</ComponentExampleBox>

<ComponentExampleBox Title="Underline" RazorCode="@example2RazorCode" Id="example2">
<ComponentExampleBox Title="Underlined" RazorCode="@example2RazorCode" Id="example2">
<ExamplePreview>
<div>Showcases the BitTextField with an underlined style, including variations with placeholders, disabled state, and required fields.</div>
<br />
Expand Down
2 changes: 1 addition & 1 deletion .../Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Layouts/Header/BitHeaderDemo.razor
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@
ChevronDownIcon="@BitIconName.More"
Variant="BitVariant.Text"
title="See more"
Styles="@(new() { OperatorButton = "padding: 0.5rem; color: dodgerblue" })">
Styles="@(new() { OperatorButton = "padding: 0.5rem;" })">
<BitMenuButtonOption Text="Settings" IconName="@BitIconName.Settings" />
<BitMenuButtonOption Text="About" IconName="@BitIconName.Info" />
<BitMenuButtonOption Text="Feedback" IconName="@BitIconName.Feedback" />
Expand Down
2 changes: 1 addition & 1 deletion ...ient/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Layouts/Header/BitHeaderDemo.razor.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@ public partial class BitHeaderDemo
ChevronDownIcon=""@BitIconName.More""
Variant=""BitVariant.Text""
title=""See more""
Styles=""@(new() { OperatorButton = ""padding: 0.5rem; color: dodgerblue"" })"">
Styles=""@(new() { OperatorButton = ""padding: 0.5rem;"" })"">
<BitMenuButtonOption Text=""Settings"" IconName=""@BitIconName.Settings"" />
<BitMenuButtonOption Text=""About"" IconName=""@BitIconName.Info"" />
<BitMenuButtonOption Text=""Feedback"" IconName=""@BitIconName.Feedback"" />
Expand Down
4 changes: 4 additions & 0 deletions ...ent/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/BasicList/BitBasicListDemo.razor
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -176,6 +176,10 @@
<ComponentExampleBox Title="RTL" RazorCode="@example7RazorCode" CsharpCode="@example7CsharpCode" Id="example7">
<ExamplePreview>
<div>
<div>
Use BitBasicList in right-to-left (RTL).
</div>
<br />
<BitBasicList Dir="BitDir.Rtl" Items="FewPeopleRtl" Style="border: 1px #a19f9d solid; border-radius: 4px;">
<RowTemplate Context="person">
<div style="padding: 5px 20px; margin: 10px; background-color: #75737329;">
Expand Down
20 changes: 10 additions & 10 deletions ...BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbCustomDemo.razor
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -98,33 +98,33 @@
</ExamplePreview>
</ComponentExampleBox>

<ComponentExampleBox Title="Class & Style" RazorCode="@example4RazorCode" CsharpCode="@example4CsharpCode" Id="example4">
<ComponentExampleBox Title="Style & Class" RazorCode="@example4RazorCode" CsharpCode="@example4CsharpCode" Id="example4">
<ExamplePreview>
<div>Customize the appearance of BitBreadcrumb using styles and CSS classes.</div>
<br /><br />
<div class="example-box">
<div>
<div>Items Class</div>
<BitBreadcrumb Items="CustomBreadcrumbItemsWithClass"
<div>Items Style</div>
<BitBreadcrumb Items="CustomBreadcrumbItemsWithStyle"
NameSelectors="nameSelectors" />
</div>
<div>
<div>Items Style</div>
<BitBreadcrumb Items="CustomBreadcrumbItemsWithStyle"
<div>Items Class</div>
<BitBreadcrumb Items="CustomBreadcrumbItemsWithClass"
NameSelectors="nameSelectors" />
</div>
<br />
<div>
<div>Selected Item Class</div>
<BitBreadcrumb Items="CustomBreadcrumbItems"
NameSelectors="nameSelectors"
SelectedItemClass="custom-selected-item" />
</div>
<div>
<div>Selected Item Style</div>
<BitBreadcrumb Items="CustomBreadcrumbItems"
NameSelectors="nameSelectors"
SelectedItemStyle="color: lightseagreen; text-shadow: lightseagreen 0 0 1rem;" />
<div>
<div>Selected Item Class</div>
<BitBreadcrumb Items="CustomBreadcrumbItems"
NameSelectors="nameSelectors"
SelectedItemClass="custom-selected-item" />
</div>
</div>
</ExamplePreview>
Expand Down
9 changes: 4 additions & 5 deletions ...mo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbCustomDemo.razor.samples.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -181,20 +181,19 @@ public class PageInfoModel
</style>


<BitBreadcrumb Items=""CustomBreadcrumbItemsWithClass""
NameSelectors=""nameSelectors"" />

<BitBreadcrumb Items=""CustomBreadcrumbItemsWithStyle""
NameSelectors=""nameSelectors"" />

<BitBreadcrumb Items=""CustomBreadcrumbItemsWithClass""
NameSelectors=""nameSelectors"" />

<BitBreadcrumb Items=""CustomBreadcrumbItems""
NameSelectors=""nameSelectors""
SelectedItemClass=""custom-selected-item"" />
SelectedItemStyle=""color: lightseagreen; text-shadow: lightseagreen 0 0 1rem;"" />

<BitBreadcrumb Items=""CustomBreadcrumbItems""
NameSelectors=""nameSelectors""
SelectedItemStyle=""color: lightseagreen; text-shadow: lightseagreen 0 0 1rem;"" />";
SelectedItemClass=""custom-selected-item"" />";
private readonly string example4CsharpCode = @"
public class PageInfoModel
{
Expand Down
18 changes: 9 additions & 9 deletions ...t.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbItemDemo.razor
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -77,30 +77,30 @@
</ExamplePreview>
</ComponentExampleBox>

<ComponentExampleBox Title="Class & Style" RazorCode="@example4RazorCode" CsharpCode="@example4CsharpCode" Id="example4">
<ComponentExampleBox Title="Style & Class" RazorCode="@example4RazorCode" CsharpCode="@example4CsharpCode" Id="example4">
<ExamplePreview>
<div>Customize the appearance of BitBreadcrumb using styles and CSS classes.</div>
<br /><br />
<div class="example-box">
<div>
<div>Items Class</div>
<BitBreadcrumb Items="BreadcrumbItemsWithClass" />
</div>
<div>
<div>Items Style</div>
<BitBreadcrumb Items="BreadcrumbItemsWithStyle" />
</div>
<br />
<div>
<div>Selected Item Class</div>
<BitBreadcrumb Items="BreadcrumbItems"
SelectedItemClass="custom-selected-item" />
<div>Items Class</div>
<BitBreadcrumb Items="BreadcrumbItemsWithClass" />
</div>
<br />
<div>
<div>Selected Item Style</div>
<BitBreadcrumb Items="BreadcrumbItems"
SelectedItemStyle="color: lightseagreen; text-shadow: lightseagreen 0 0 1rem;" />
</div>
<div>
<div>Selected Item Class</div>
<BitBreadcrumb Items="BreadcrumbItems"
SelectedItemClass="custom-selected-item" />
</div>
</div>
</ExamplePreview>
</ComponentExampleBox>
Expand Down
8 changes: 4 additions & 4 deletions ...Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbItemDemo.razor.samples.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -89,16 +89,16 @@ public partial class _BitBreadcrumbItemDemo
</style>


<BitBreadcrumb Items=""BreadcrumbItemsWithClass"" />

<BitBreadcrumb Items=""BreadcrumbItemsWithStyle"" />

<BitBreadcrumb Items=""BreadcrumbItemsWithClass"" />


<BitBreadcrumb Items=""BreadcrumbItems""
SelectedItemClass=""custom-selected-item"" />
SelectedItemStyle=""color: lightseagreen; text-shadow: lightseagreen 0 0 1rem;"" />

<BitBreadcrumb Items=""BreadcrumbItems""
SelectedItemStyle=""color: lightseagreen; text-shadow: lightseagreen 0 0 1rem;"" />";
SelectedItemClass=""custom-selected-item"" />";
private readonly string example4CsharpCode = @"
private readonly List<BitBreadcrumbItem> BreadcrumbItems =
[
Expand Down
28 changes: 14 additions & 14 deletions ...BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbOptionDemo.razor
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -128,20 +128,11 @@
</ExamplePreview>
</ComponentExampleBox>

<ComponentExampleBox Title="Class & Style" RazorCode="@example4RazorCode" Id="example4">
<ComponentExampleBox Title="Style & Class" RazorCode="@example4RazorCode" Id="example4">
<ExamplePreview>
<div>Customize the appearance of BitBreadcrumb using styles and CSS classes.</div>
<br /><br />
<div class="example-box">
<div>
<div>Options Class</div>
<BitBreadcrumb TItem="BitBreadcrumbOption">
<BitBreadcrumbOption Text="Option 1" Href="/components/breadcrumb" Class="custom-item" />
<BitBreadcrumbOption Text="Option 2" Href="/components/breadcrumb" Class="custom-item" />
<BitBreadcrumbOption Text="Option 3" Href="/components/breadcrumb" Class="custom-item" />
<BitBreadcrumbOption Text="Option 4" Href="/components/breadcrumb" Class="custom-item" IsSelected />
</BitBreadcrumb>
</div>
<div>
<div>Options Style</div>
<BitBreadcrumb TItem="BitBreadcrumbOption">
Expand All @@ -151,19 +142,28 @@
<BitBreadcrumbOption Text="Option 4" Href="/components/breadcrumb" Style="color: dodgerblue; text-shadow: dodgerblue 0 0 1rem;" IsSelected />
</BitBreadcrumb>
</div>
<div>
<div>Options Class</div>
<BitBreadcrumb TItem="BitBreadcrumbOption">
<BitBreadcrumbOption Text="Option 1" Href="/components/breadcrumb" Class="custom-item" />
<BitBreadcrumbOption Text="Option 2" Href="/components/breadcrumb" Class="custom-item" />
<BitBreadcrumbOption Text="Option 3" Href="/components/breadcrumb" Class="custom-item" />
<BitBreadcrumbOption Text="Option 4" Href="/components/breadcrumb" Class="custom-item" IsSelected />
</BitBreadcrumb>
</div>
<br />
<div>
<div>Selected Option Class</div>
<BitBreadcrumb TItem="BitBreadcrumbOption" SelectedItemClass="custom-selected-item">
<div>Selected Option Style</div>
<BitBreadcrumb TItem="BitBreadcrumbOption" SelectedItemStyle="color: lightseagreen; text-shadow: lightseagreen 0 0 1rem;">
<BitBreadcrumbOption Text="Option 1" Href="/components/breadcrumb" />
<BitBreadcrumbOption Text="Option 2" Href="/components/breadcrumb" />
<BitBreadcrumbOption Text="Option 3" Href="/components/breadcrumb" />
<BitBreadcrumbOption Text="Option 4" Href="/components/breadcrumb" IsSelected />
</BitBreadcrumb>
</div>
<div>
<div>Selected Option Style</div>
<BitBreadcrumb TItem="BitBreadcrumbOption" SelectedItemStyle="color: lightseagreen; text-shadow: lightseagreen 0 0 1rem;">
<div>Selected Option Class</div>
<BitBreadcrumb TItem="BitBreadcrumbOption" SelectedItemClass="custom-selected-item">
<BitBreadcrumbOption Text="Option 1" Href="/components/breadcrumb" />
<BitBreadcrumbOption Text="Option 2" Href="/components/breadcrumb" />
<BitBreadcrumbOption Text="Option 3" Href="/components/breadcrumb" />
Expand Down
Loading
Loading