Change the UI of an Ext.toast()?

[CrazyMenConnected]

Hi all, and thanks in advance

Has anyone been able to chage the UI of an Ext.toast()?
I've been trying and with no success...

I have this code on classic/sass/var/all.scss

@include extjs-panel-ui(
        $ui: 'warn-framed',
        $ui-header-background-color: red,
        $ui-border-color: red,
        $ui-header-border-color: red,
        $ui-body-border-color: red,
        $ui-border-width: 5px,
        $ui-border-radius: 5px,
        $ui-header-color: white
);

And i call toast just like this:

        Ext.toast({
            title: 'Title',
            html: 'Text line 1 </br><strong> text line 2 </strong>',
            align: 't',
            iconCls: Ext.Msg.WARNING,
            ui: 'warn',
            frame: true
        }, 3000);

After sencha app build no matter what i do, the toast does not get styled...
Could anyone help with this issue please?

Thank you for your time!

[NoahK17]

Same issue. I'll post here if this ever gets solved.

[NoahK17]

It looks like there's a bug in applying an UI to a Toast, but there's an override solution you can use: https://fiddle.sencha.com/#fiddle/1q8m

You'll want to override the show() method in Ext.Toast and manually set the UI or Cls directly. See the fiddle above for an example. Good luck!