commonscomputer/cal.diy
4
0
Fork 0
Code Issues Pull Requests Actions 2.1k Packages Projects Releases Wiki Activity

fix: align toast icons with message text vertically (#22614)

Browse Source 
* fix: align toast icons with message text vertically

* fix: align toast icons with message text vertically

* fix: align toast icons with message text vertically
This commit is contained in:
Kartik
2025-07-22 14:07:05 +00:00
committed by GitHub
parent 42a4a38939
commit dbaa0727ae
1 changed files with 6 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/ui/components/toast/showToast.tsx
+6 -6
View File
@@ -16,7 +16,7 @@ export const SuccessToast = ({ message, onClose, toastId }: IToast) => (
"data-testid-toast-success bg-default dark:bg-inverted text-emphasis dark:text-inverted shadow-elevation-low border-subtle mb-2 flex h-auto items-center justify-between space-x-2 rounded-lg border px-3 py-2.5 text-sm font-semibold rtl:space-x-reverse md:max-w-sm"
)}
onClick={() => onClose(toastId)}>
<span className="mt-1">
<span>
<Icon name="check" className="size-4" />
</span>
<div className="flex items-center">
@@ -24,7 +24,7 @@ export const SuccessToast = ({ message, onClose, toastId }: IToast) => (
{message}
</p>
</div>
<span className="mt-1">
<span>
<Icon name="x" className="size-4 hover:cursor-pointer" />
</span>
</button>
@@ -36,7 +36,7 @@ export const ErrorToast = ({ message, onClose, toastId }: IToast) => (
"animate-fade-in-up bg-semantic-error-subtle text-semantic-error shadow-elevation-low border-semantic-error-subtle mb-2 flex h-auto items-center justify-between space-x-2 rounded-md border px-3 py-2.5 text-sm font-semibold rtl:space-x-reverse md:max-w-sm"
)}
onClick={() => onClose(toastId)}>
<span className="mt-1">
<span>
<Icon name="info" className="text-semantic-error size-4" />
</span>
<div className="flex items-center">
@@ -44,7 +44,7 @@ export const ErrorToast = ({ message, onClose, toastId }: IToast) => (
{message}
</p>
</div>
<span className="mt-1">
<span>
<Icon name="x" className="text-semantic-error size-4 hover:cursor-pointer" />
</span>
</button>
@@ -56,7 +56,7 @@ export const WarningToast = ({ message, onClose, toastId }: IToast) => (
"animate-fade-in-up bg-semantic-attention-subtle text-semantic-attention shadow-elevation-low border-semantic-attention-subtle mb-2 flex h-auto items-center justify-between space-x-2 rounded-md border px-3 py-2.5 text-sm font-semibold rtl:space-x-reverse md:max-w-sm"
)}
onClick={() => onClose(toastId)}>
<span className="mt-1">
<span>
<Icon name="info" className="text-semantic-attention size-4" />
</span>
<div className="flex items-center">
@@ -64,7 +64,7 @@ export const WarningToast = ({ message, onClose, toastId }: IToast) => (
{message}
</p>
</div>
<span className="mt-1">
<span>
<Icon name="x" className="text-semantic-attention size-4 hover:cursor-pointer" />
</span>
</button>