From e9932595ecd69edc000f63f3819f58ea3fc28ecd Mon Sep 17 00:00:00 2001
From: Kang <CoderKang@hotmail.com>
Date: Mon, 24 Aug 2026 16:10:05 +0800
Subject: [PATCH] style(toaster): add default offset settings for desktop and
 mobile views

- Introduced `DEFAULT_OFFSET` and `DEFAULT_MOBILE_OFFSET` constants to define the positioning of the toaster notifications.
- Updated the `Toaster` component to utilize these new offset settings, enhancing the layout and responsiveness of notifications across different devices.
---
 src/components/ui/sonner.tsx | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)

diff --git a/src/components/ui/sonner.tsx b/src/components/ui/sonner.tsx
index 7693afd2..f20b18a9 100644
--- a/src/components/ui/sonner.tsx
+++ b/src/components/ui/sonner.tsx
@@ -1,10 +1,26 @@
 import { Toaster as Sonner, type ToasterProps } from "sonner";
 
+const DEFAULT_OFFSET = {
+  top: "3rem",
+  right: "1.5rem",
+  bottom: "1.5rem",
+  left: "1.5rem",
+} satisfies ToasterProps["offset"];
+
+const DEFAULT_MOBILE_OFFSET = {
+  top: "3rem",
+  right: "1rem",
+  bottom: "1rem",
+  left: "1rem",
+} satisfies ToasterProps["mobileOffset"];
+
 const Toaster = ({ ...props }: ToasterProps) => {
   return (
     <Sonner
       theme="dark"
       position="top-right"
+      offset={DEFAULT_OFFSET}
+      mobileOffset={DEFAULT_MOBILE_OFFSET}
       className="toaster group"
       richColors
       style={