Topic: Toast positionClass doesn't work after 7.4.0 update

akrolis pro asked 5 years ago


After updating from Angular 6.1.0 to Angular 7.2.3 and MDBootstrap from v7.3.0 to v.7.4.0 the positionClass option in toastOptions doesn't seem to work.

I have this in my toastOptions:

private toastOptions = { positionClass: 'toast-bottom-right', tapToDismiss: true };

With MDBootstrap version 7.3.0 it worked ok, but after updating to v7.4.0 the notification appears in the bottom left, not right. I tried adding a custom position class in the scss file and it doesn't work also.

If no positionClass is defined it appears in the default top-right position, but with any positionClass defined in toastOptions it always appears in the bottom-left position


Arkadiusz Idzikowski staff answered 5 years ago


Hello,

Please change the position class to 'md-toast-bottom-right'. Some of the toast classes were changed to avoid overwritting those used by bootstrap. We will update class names in notification documentation as well.


japan priority commented 4 years ago

Hi, it would be handy to change the docs as well - it still says { positionClass: 'toast-bottom-right' } at this page https://mdbootstrap.com/docs/angular/advanced/notifications/ Thanks


Arkadiusz Idzikowski staff commented 4 years ago

We updated the docs. Thank you for pointing that out.


Arkadiusz Idzikowski staff answered 5 years ago


We will take a closer look at the problem with centering. You can find the documentation here:

Toast documentation


rernens pro answered 5 years ago


right and left work but center does not !

BTW ToastService documentation has vanished !


akrolis pro answered 5 years ago


Worked perfect, Thanks!



Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

  • ForumUser: Pro
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: 7.0.0
  • Device: Desktop / Mobile
  • Browser: Chrome
  • OS: Windows
  • Provided sample code: No
  • Provided link: No