Fix Toast weird position and styles

niktekusho · Jul 25, 2024 · ad8ad43 · ad8ad43
1 parent 9438041
commit ad8ad43
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 2 deletions.
diff --git a/src/components/ArtifactsRulePage.tsx b/src/components/ArtifactsRulePage.tsx
@@ -501,8 +501,10 @@ Thank you so much for your help! 🙌
   toast({
     title: "Bug found!",
     description: toastDesc,
+    // duration: 1_000_000,
     variant: "destructive",
     action: toastAction,
-    className: "grid gap-4 space-x-0",
+    className:
+      "grid gap-4 items-center justify-stretch p-6 space-x-0 sm:grid-cols-2 md:grid-cols-1",
   });
 }
diff --git a/src/components/ui/toast.tsx b/src/components/ui/toast.tsx
@@ -16,7 +16,7 @@ const ToastViewport = React.forwardRef<
   <ToastPrimitives.Viewport
     ref={ref}
     className={cn(
-      "fixed top-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 sm:bottom-0 sm:right-0 sm:top-auto sm:flex-col md:max-w-[420px]",
+      "fixed top-0 left-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 sm:bottom-0 sm:right-0 sm:top-auto sm:flex-col md:max-w-[420px] md:left-auto",
       className
     )}
     {...props}