Blazored / Toast

A JavaScript free toast library for Blazor and Razor Component applications
https://blazored.github.io/Toast/
MIT License
663 stars 92 forks source link

Added possibility to define custom close icon #121

Closed linkdotnet closed 3 years ago

linkdotnet commented 3 years ago

Essentially closes #98

This will give the option to define a custom close button. The implementation still uses the current approach as default. Therefore a custom icon is completely optional.

Usage

The definition of the custom icon will be as RenderFragment for the BlazoredToasts component. For Blazor server in _Host.cshtml / for Blazor Webassembly in MainLayout.razor:

<BlazoredToasts Position="ToastPosition.BottomRight"
                Timeout="10"
                IconType="IconType.Material"
                ErrorIcon="error_outline"
                InfoIcon="school"
                SuccessIcon="done_outline"
                WarningIcon="warning"
                ShowProgressBar="@true">
    <CloseButtonContent>
        <img src="https://media.istockphoto.com/vectors/close-thin-line-vector-icon-vector-id857112152?k=6&m=857112152&s=612x612&w=0&h=py-FFtgw7ta7FGHGM71HBehuksNs2bRSHhudMAOI3qw="
             width="32" height="32" alt="close"/>
    </CloseButtonContent>
</BlazoredToasts>

Will become: close button

I also added IsFixed to the ParentComponent (BlazoredToasts) as the child component (BlazoredToast) is not relying on updates.

chrissainty commented 3 years ago

Thanks for creating this PR @linkdotnet. However, it doesn't address the issue you've linked, at least not fully. That issue requires the ability to customise and hide the close icon. You have only implemented customising it. Could you complete the additional work or remove the link to the issue as someone else will have to finished it.

linkdotnet commented 3 years ago

I guess I can do the additional work later. That shouldn't be a problem

linkdotnet commented 3 years ago

Added the option to hide the button. The default is, that the button is visible (as it was until now).

chrissainty commented 3 years ago

This is great, thanks @linkdotnet. I have just one more request. Can you add an example to the sample add and any relevant information to the readme. Once that is done I'll get this merged.

linkdotnet commented 3 years ago

Can do so @chrissainty. BTW: You wouldn't necessarily need a "hide close button" feature as you can just set the RenderFragment for the CloseButton to empty. But I guess an explicit parameter might be better.

chrissainty commented 3 years ago

BTW: You wouldn't necessarily need a "hide close button" feature as you can just set the RenderFragment for the CloseButton to empty. But I guess an explicit parameter might be better.

That's true, but I don't think it's as nicer API to work with verses setting a explicit parameter.

linkdotnet commented 3 years ago

I changed the server sample to show how to use the Custom Icon with a4697002497d2f770c5afb39faf06b5dd36474cb

chrissainty commented 3 years ago

Thanks for this work @linkdotnet, and pologies for the delay in merging.