Progress Telerik UI for Blazor
The Telerik UI for Blazor Notification Component offers sleek animated ways to display notifications which can then be dismissed manually by the users or automatically after some time. The Notification component is useful when building applications that require messages such as events reminders, alarm snoozing or any status updates coming from an application process.
The component comes with the option to set one of the predefined colors (ThemeColor parameter) for the notification such as Primary, Secondary, Tertiary, Success, Info, Warning, Error, Dark, Light, Inverse or build your own. It lets you match the use case logic and the color associated with it.
See more about Blazor Notification component themes
The Notification Component is fully customizable, and you can choose the preferred position to display your messages on the page – top, bottom, right, left, or to set a specific custom position as well. The UI component offers the feature to personalize the notification content by including images or other elements.
A crucial part of Notifications is how they appear on the page. You can control the animation of your message by choosing from the predefined options and setting an animation type.
The Notification component uses a Show method which has an overload for common parameters like Text and Color and overloads which accept the whole Notification model. You can also choose how your notification will disappear. If you want this to happen automatically, you can set a specified time for the notification duration. The message can also be dismissed manually by pressing a close button that will be visible near the message. The component also has a hiding feature which means that even if the user does not click the closing button within a specified time, the notification will still hide automatically.
Learn more about the Notification component animation types
The component has several built-in themes such as Default, Material and Bootstrap. You can easily customize any of out-of-the-box themes with a few lines of CSS or create new theme to match your colors and branding by using the Telerik SASS ThemeBuilder application.