Icons don't display on warn, info type

[FuckingToasters]

Hello, so let's get straight to the point:

var notyf = new Notyf({
  types: [
    {
      type: 'info',
      background: 'blue',
      icon: {
        className: 'material-icons',
        tagName: 'i',
        text: 'info'
      }
    },
    {
      type: 'warning',
      background: 'orange',
      icon: {
        className: 'material-icons',
        tagName: 'i',
        text: 'warning'
      }
    },
  ]
});

// Function to show the success message
function showMessage(msgtype, msg) {
    var showMsg = document.getElementById("showMsg");
    
    // Check if the success message should be displayed
    if (showMsg.dataset.display !== 'false') {

        // Use Notyf for displaying success message
        if (msgtype == 'success') {
            notyf.success({
                message: msg,
                duration: 9500,
                dismissible: true
            });
        } else if (msgtype == 'warn') {
            notyf.open({
                type: "warning",
                message: msg,
                duration: 9500,
                dismissible: true
            });
        } else if (msgtype == 'info') {
            notyf.open({
                type: "info",
                message: msg,
                duration: 9500,
                dismissible: true
            });
        } else if (msgtype == 'error') {
            notyf.error({
                message: msg,
                duration: 9500,
                dismissible: true
            });
        }
    }
}

The issue is, that the icons are not displayd correctly (only if you select everything on a notification modal, you see the icon. Otherwise it won't display.

[Plazzmex]

Hey, I know you probably moved on or figured it out,
but maybe someone else will find it useful, because I had the same problem and then i realized you need to set the color of the icon, as mentioned in the readme

Icon color. It must be a valid CSS color value. Defaults to background color.

So the notification is basically shown flush with the background.
If you set the color, for example like this:

type: 'info', background: 'blue', icon: { className: 'material-icons', tagName: 'i', text: 'info', color: 'white' }

then it will work.