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.

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

Styling of toasts send to ToastProvider #5922

Closed
Herdo opened this issue Jan 6, 2025 · 10 comments
Closed

Styling of toasts send to ToastProvider #5922

Herdo opened this issue Jan 6, 2025 · 10 comments
Assignees
Labels
Type: Feature ⚙ Request or idea for a new feature.
Milestone

Comments

@Herdo
Copy link
Contributor

Herdo commented Jan 6, 2025

Is your feature request related to a problem? Please describe.
I am trying to do customize the styling of the toast messages created with the ToastProvider and IToastService, but there are currently no options to style them at all.

Describe the solution you'd like
The minimum would be optional css classes that could be passed along when using the IToastService methods.

Additional context

I think it would be enough to have the additional class(es) on the toast itself, not the header and body.
The css rules would allow for styling those as well.

@Herdo Herdo added the Type: Feature ⚙ Request or idea for a new feature. label Jan 6, 2025
@stsrki
Copy link
Collaborator

stsrki commented Jan 6, 2025

It is a good feature to have, at least for Class and Style options. We can make it for the next release.

@github-project-automation github-project-automation bot moved this to No Status in Development Jan 6, 2025
@stsrki stsrki added this to the 2.0 milestone Jan 6, 2025
@stsrki
Copy link
Collaborator

stsrki commented Jan 8, 2025

@Herdo If you have any other ideas for styling, or new options, please give your proposals.

@Herdo
Copy link
Contributor Author

Herdo commented Jan 8, 2025

@stsrki The only other thing I can think about right now is overriding the icon as well, in case you use a different icon library and want a consistent look. I'm good with the Class and Style otherwise.

@stsrki
Copy link
Collaborator

stsrki commented Jan 8, 2025

Good idea with the Icon. Thanks.

@tesar-tech
Copy link
Collaborator

tesar-tech commented Jan 9, 2025

@stsrki Wouldn't it be wiser to provide full customization right away? Not by passing all the parameters (because customizations aren't just about parameters), but rather by passing a RenderFragment and letting users have full control?

Passing just Class for the Toast will create inconsistency between the way of styling through provider and without it.

@stsrki
Copy link
Collaborator

stsrki commented Jan 10, 2025

What would RenderFragment do?

@tesar-tech
Copy link
Collaborator

That would be the Toast to be added to the ToastProvider.

RenderFragment rf =>  @<Toast >
                <ToastHeader>
                  <MyCustomIcon/>
                    <Strong>Title</Strong>
                        <CloseButton  Margin="Blazorise.Margin.IsAuto.FromStart" />
                </ToastHeader>
                <ToastBody Class="whatever">
                    some message
<SomeCustomStuff/>
                </ToastBody>
            </Toast>;

...

    Task ShowToast()
    {
       
        return ToastService.Custom(rf);
    }
    

something like that...

@stsrki
Copy link
Collaborator

stsrki commented Jan 10, 2025

I would not go that route. The idea is to use ToastService as a simple API to show notifications. It is best to just stick with the options parameters to customize the appearance and behavior of the toast.

@tesar-tech
Copy link
Collaborator

@Herdo what do you mean by "overriding the icon"?

Can you check the source and let me know what is the intended result of that line of code?

@stsrki
Copy link
Collaborator

stsrki commented Jan 10, 2025

The idea is to provide IconName as part of the options. And if defined we will override what is used by default.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Type: Feature ⚙ Request or idea for a new feature.
Projects
Status: Done
Development

No branches or pull requests

3 participants