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

Jump to bottom

Merge progressbar-value-2353 into production #2354

Merged
merged 2 commits into from
Aug 27, 2024
Merged

Merge progressbar-value-2353 into production #2354

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
6de17df
docs(progressbar): Improve Value and label information
dimodi Aug 27, 2024
0516516
Update components/progressbar/overview.md
dimodi Aug 27, 2024
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
14 changes: 7 additions & 7 deletions components/progressbar/overview.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ The <a href = "https://www.telerik.com/blazor-ui/progressbar" target = "_blank">

## Label

The label is a text representation of the current progress. It is rendered inside the ProgressBar and by default shows the component value in percent. The [ProgressBar allows customization of the label position and content]({%slug progressbar-label%}). Use the label template to override the default percent label if the ProgressBar `Max` is not `100`.
The label is a representation of the current progress. [Depending on the theme, it renders inside or next to the ProgressBar](https://demos.telerik.com/blazor-ui/progressbar/overview) and by default shows the component `Value` with an appended percent sign `%`. The [ProgressBar allows customization of the label position and content]({%slug progressbar-label%}). Use the label template to show the desired percent progress if the ProgressBar `Max` parameter is not `100`.

## Indeterminate State

Expand Down Expand Up @@ -61,12 +61,12 @@ The ProgressBar provides the following features to further customize its behavio

@[template](/_contentTemplates/common/parameters-table-styles.md#table-layout)

| Attribute | Type and Default Value | Description |
|----------|----------|----------|
| `Class` | `string` | The CSS class that will be rendered on the main wrapping element. You can use it to cascade styles more easily.
| `Max` | `double` <br/> 100 | The maximum value of the ProgressBar. It must be greater than `0`.
| `Value` | `double` | The value of the ProgressBar. This value indicates the progress of the tracked process. It is a fraction of the `Max`.
| `Orientation` | `ProgressBarOrientation` enum <br/> (`ProgressBarOrientation.Horizontal`) | The orientation of the ProgressBar. Takes a member of the `ProgressBarOrientation` enum - `Horizontal` or `Vertical`.
| Parameter | Type and Default&nbsp;Value | Description |
| --- | --- | --- |
| `Class` | `string` | The CSS class that will be rendered on the main wrapping element. You can use it to cascade styles more easily. |
| `Max` | `double` <br /> `100` | The maximum value of the ProgressBar. It must be greater than `0`. |
| `Value` | `double` | The value of the ProgressBar, which indicates the progress of the tracked process as a percentage. If `Max` is not `100` or `Value` is not a percent number, then use a [ProgressBar label template]({%slug progressbar-label%}) to display the component value in the desired format and precision. |
| `Orientation` | `ProgressBarOrientation` enum <br /> (`Horizontal`) | The orientation of the ProgressBar. It can be `Horizontal` or `Vertical`. |

## Next Steps

Expand Down
Loading