fix: dialog content screen overflow (#109)

If the screen gets small enough for the dialog content to overflow it,
the content is not scrollable and the user has no chance to see all of
it. This can easily happen on mobile with keyboard open.

The solution I chose is to limit the height to viewport height and
let the browser handle the overflow by showing a scrollbar.

.changeset/old-cameras-smoke.md

@@ -0,0 +1,5 @@
+---
+"solidui-cli": patch
+---
+
+It makes dialog content vertically scrollable should it overflow the vertical space given by the viewport.

apps/docs/src/registry/ui/dialog.tsx

@@ -53,7 +53,7 @@ const DialogContent = <T extends ValidComponent = "div">(
       <DialogOverlay />
       <DialogPrimitive.Content
         class={cn(
-          "fixed left-1/2 top-1/2 z-50 grid w-full max-w-lg -translate-x-1/2 -translate-y-1/2 gap-4 border bg-background p-6 shadow-lg duration-200 data-[expanded]:animate-in data-[closed]:animate-out data-[closed]:fade-out-0 data-[expanded]:fade-in-0 data-[closed]:zoom-out-95 data-[expanded]:zoom-in-95 data-[closed]:slide-out-to-left-1/2 data-[closed]:slide-out-to-top-[48%] data-[expanded]:slide-in-from-left-1/2 data-[expanded]:slide-in-from-top-[48%] sm:rounded-lg",
+          "fixed left-1/2 top-1/2 z-50 grid max-h-screen w-full max-w-lg -translate-x-1/2 -translate-y-1/2 gap-4 overflow-y-auto border bg-background p-6 shadow-lg duration-200 data-[expanded]:animate-in data-[closed]:animate-out data-[closed]:fade-out-0 data-[expanded]:fade-in-0 data-[closed]:zoom-out-95 data-[expanded]:zoom-in-95 data-[closed]:slide-out-to-left-1/2 data-[closed]:slide-out-to-top-[48%] data-[expanded]:slide-in-from-left-1/2 data-[expanded]:slide-in-from-top-[48%] sm:rounded-lg",
           props.class
         )}
         {...rest}