mobile layout tweak

Author: devhelpr

src/components/ui/touch-tooltip.tsx

@@ -99,7 +99,17 @@ const TooltipContent = React.forwardRef<
         className={cn(
             `z-50 overflow-hidden 
 			rounded-md border 
-			bg-white px-3 py-1.5 text-sm text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2`,
+			max-w-[calc(100vw-2rem)]
+			mx-4
+			bg-white px-3 py-1.5 text-sm text-popover-foreground 
+			shadow-md animate-in fade-in-0 zoom-in-95 
+			data-[state=closed]:animate-out 
+			data-[state=closed]:fade-out-0 
+			data-[state=closed]:zoom-out-95 
+			data-[side=bottom]:slide-in-from-top-2 
+			data-[side=left]:slide-in-from-right-2 
+			data-[side=right]:slide-in-from-left-2 
+			data-[side=top]:slide-in-from-bottom-2`,
             className
         )}
         {...props}