Improved the sheet style

apps/webapp/app/components/integrations/NoIntegrationSheet.tsx

@@ -41,7 +41,7 @@ export function NoIntegrationSheet({
             <div className="flex items-center gap-1">
               <CheckIcon className="h-4 w-4 text-green-500" />
               <Paragraph variant="small">
-                We'll let you know when the integration is available.
+                We'll let you know when the Integration is available.
               </Paragraph>
             </div>
           ) : (

apps/webapp/app/components/primitives/Sheet.tsx

@@ -46,7 +46,7 @@ const SheetOverlay = React.forwardRef<
 >(({ className, children, ...props }, ref) => (
   <SheetPrimitive.Overlay
     className={cn(
-      "fixed inset-0 z-50 bg-slate-900/50 transition-all duration-100 data-[state=closed]:animate-out data-[state=closed]:fade-out data-[state=open]:fade-in",
+      "fixed inset-0 z-50 bg-midnight-900/80 transition animate-in duration-200 data-[state=closed]:animate-out data-[state=closed]:fade-out data-[state=open]:fade-in",
       className
     )}
     {...props}
@@ -56,14 +56,14 @@ const SheetOverlay = React.forwardRef<
 SheetOverlay.displayName = SheetPrimitive.Overlay.displayName;
 
 const sheetVariants = cva(
-  "fixed z-50 scale-100 gap-4 bg-midnight-900 opacity-100 shadow-lg rounded-md border border-slate-800 mr-4 mt-4",
+  "fixed z-50 scale-100 gap-4 bg-midnight-900 shadow-lg shadow-indigo-900 opacity-100 border-l border-y border-slate-800",
   {
     variants: {
       position: {
-        top: "animate-in slide-in-from-top w-full duration-300",
-        bottom: "animate-in slide-in-from-bottom w-full duration-300",
-        left: "animate-in slide-in-from-left h-full duration-300",
-        right: "animate-in slide-in-from-right h-[97vh] duration-300",
+        top: "animate-in slide-in-from-top w-full duration-200",
+        bottom: "animate-in slide-in-from-bottom w-full duration-200",
+        left: "animate-in slide-in-from-left h-full duration-200",
+        right: "animate-in slide-in-from-right h-screen duration-200",
       },
       size: {
         content: "",