Refine Sonner layout and timing

This commit is contained in:
MOH
2026-03-10 18:07:47 +01:00
parent 67447bbe4b
commit 7877c8ae63
2 changed files with 33 additions and 3 deletions
+31
View File
@@ -197,6 +197,37 @@ html[lang="ar"] {
color: hsl(var(--foreground));
}
[data-sonner-toaster][data-x-position="center"] {
left: 0;
right: 0;
width: 100%;
transform: none;
}
[data-sonner-toaster][data-x-position="center"] [data-sonner-toast] {
left: 0;
right: 0;
width: fit-content;
min-width: 0;
max-width: min(calc(100vw - 2rem), 32rem);
margin-inline: auto;
}
@media (max-width: 600px) {
[data-sonner-toaster][data-x-position="center"] {
left: 0;
right: 0;
width: 100%;
transform: none;
}
[data-sonner-toaster][data-x-position="center"] [data-sonner-toast] {
width: fit-content;
max-width: calc(100vw - 2rem);
margin-inline: auto;
}
}
@layer utilities {
.hero-noise {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.1' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='0.28'/%3E%3C/svg%3E");