MDB React toast color & icon

hi @rashesh patel,

Q-1.

It's impossible to get the same result as an example because an example is written i jQuery. This component is different in react due to differences in technology.

I can add a task to figure out how to add these icons and some transparency to the notification component.

Q-2.

I've made you a snippet but remember to learn how to use any of the components in our documentation and read API. There you find answers to most of your questions. Searching solutions on your own will be much faster than waiting for our response.

import React from "react";
import { toast, ToastContainer, MDBContainer } from "mdbreact";

const NotificationPage = () => {
  const notify = type => {
    return () => {
      switch (type) {
        case "info":
          toast.info("Info message", {
            closeButton: false,
            position: "top-left"

          });
          break;
        case "success":
          toast.success("Success message", {
            position: "top-center"
          });
          break;
        case "warning":
          toast.warn("Warning message", {
            position: "bottom-center",
          });
          break;
        case "error":
          toast.error("Error message");
          break;
        default:
          toast.error("Error message");
      }
    };
  };

  return (
    <MDBContainer>
      <button className="btn btn-info" onClick={notify("info")}>
        Info
        </button>

      <button className="btn btn-success" onClick={notify("success")}>
        Success
        </button>

      <button className="btn btn-warning" onClick={notify("warning")}>
        Warning
        </button>

      <button className="btn btn-danger" onClick={notify("error")}>
        Error
        </button>
      <ToastContainer
        hideProgressBar={true}
        newestOnTop={true}
        autoClose={5000}
      />
    </MDBContainer>
  );
};

export default NotificationPage;

Hi Jakub,

I have tried the same example. I am not able to add an icon. Please let me know if we can add the icon for the toast component.