diff --git a/apps/web/src/app.css b/apps/web/src/app.css index 2e00c37c..f44313b9 100644 --- a/apps/web/src/app.css +++ b/apps/web/src/app.css @@ -12,6 +12,21 @@ @import "@corbits/tasks-ui/styles.css"; @import "@corbits/plugins-ui/styles.css"; +/* react-ui's `.corbits-toast` ships a hardcoded horizontal-center transform + (`left: 50%; transform: translateX(-50%) !important`) regardless of the + `position` prop passed to `` — main.tsx now mounts it + bottom-right, and without this the toast would still visually sit + centered while claiming to be on the right. Sonner itself already + right-aligns the toast via its own `[data-x-position="right"]` rule + (injected at runtime, unrelated to this stylesheet); this just stops + react-ui's override from fighting it. Higher specificity than that rule + wins the cascade on its own, so this is safe regardless of load order. */ +[data-sonner-toaster][data-x-position="right"] + [data-sonner-toast].corbits-toast { + left: auto !important; + transform: none !important; +} + /* Mock chrome: 15px root so rem-based density matches the interactive mock. */ html { font-size: 15px; diff --git a/apps/web/src/main.tsx b/apps/web/src/main.tsx index 96f591d2..bca0b99d 100644 --- a/apps/web/src/main.tsx +++ b/apps/web/src/main.tsx @@ -114,7 +114,7 @@ function Root() { provisioningErrorRefId={provisioningError?.refId} onRetryProvisioning={handleRetryProvisioning} /> - + ); } diff --git a/apps/web/src/pages/library-page.tsx b/apps/web/src/pages/library-page.tsx index 14e26c6b..7f6b8b43 100644 --- a/apps/web/src/pages/library-page.tsx +++ b/apps/web/src/pages/library-page.tsx @@ -251,7 +251,7 @@ function PreviewPane({ ? artifactPreviewPath(tenantId, detail.id) : undefined; return ( -