mdbreact: how to make toast with fade effect and icon?


Topic: mdbreact: how to make toast with fade effect and icon?

Malasharhan asked 5 years ago

I want to use Toast, but my toast is different from mdbootstrap.com example, Example toast shows with Fade transition and Icon, I have copied the sample code, but result is different. Please help me.

  toast.error(t('COMMON.ERROR.UNKNOWN_SERVER_ERROR'), {
    transition: "fade",
  });
----------------------------------------------
  <ToastContainer
    className="text-left"
    position={t("DIRECTION") === "ltr" ? "top-right" : "top-left"}
    hideProgressBar={true}
    newestOnTop={true}
    autoClose={0}
    closeButton={false}
  >
  </ToastContainer>

Jakub Chmura staff premium answered 5 years ago

Hi @Malasharhan,

Documentation live preview is provided by MDBjQuery, and in this case, the live preview looks different than the React example. We have a plan to add a new notification layout to make it look identical to jquery, but for now, for technical reasons, we must use the MDBJQuery version as a documentation page. Unfortunately, this sometimes causes small differences in the appearance of the technology, in the future, it will be changed.

Best, Kuba


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
  • User: Free
  • Premium support: No
  • Technology: MDB React
  • MDB Version: 4.25.1
  • Device: PC
  • Browser: Chrome
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: No
Tags