From 78f12e072dd7729e16191525a3a7162b0ebe31c5 Mon Sep 17 00:00:00 2001
From: Aayush <aayushk4980@gmail.com>
Date: Thu, 14 Nov 2024 22:43:08 +0530
Subject: [PATCH] Fixed notification style

---
 src/components/ToastContextProvider.jsx | 2 +-
 src/components/toaster/Toast.jsx        | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/ToastContextProvider.jsx b/src/components/ToastContextProvider.jsx
index 7311ec8..822540f 100644
--- a/src/components/ToastContextProvider.jsx
+++ b/src/components/ToastContextProvider.jsx
@@ -17,7 +17,7 @@ export const ToastProvider = ({ children }) => {
 
   return (
     <ToastContext.Provider value={{ addToast }}>
-      <div className="w-fit fixed bottom-5 right-5 z-50 flex flex-col duration-500 h-fit">
+      <div className="w-screen md:w-fit fixed bottom-5 md:right-5 z-50 flex flex-col duration-500 h-fit">
         {toasts.map((toast) => (
           <Toast key={toast.id} message={toast.message} success={toast.success} onClose={() => removeToast(toast.id)} />
         ))}
diff --git a/src/components/toaster/Toast.jsx b/src/components/toaster/Toast.jsx
index 29a42df..02e5409 100644
--- a/src/components/toaster/Toast.jsx
+++ b/src/components/toaster/Toast.jsx
@@ -10,7 +10,7 @@ const Toast = ({ message, onClose, success }) => {
     }, [])
 
     return (
-        <div className="bg-slate-800 max-w-[80vw] min-w-[350px] p-3 md:py-4 md:px-8 text-center text-white flex justify-between items-center rounded-xl m-2 md:text-xl overflow-ellipsis animate-in relative overflow-hidden">
+        <div className="bg-slate-800 max-w-[80vw] w-[350px] mx-auto md:mx-0 p-3 md:py-4 md:px-8 text-center text-white flex justify-between items-center rounded-xl m-2 md:text-xl overflow-ellipsis animate-in relative overflow-hidden">
             <div
             className={`absolute h-1 left-0 bottom-0 ${success ? 'bg-green-500' : 'bg-red-500'} animate-toast`}
             />