Adam 2 miesięcy temu
rodzic
commit
dca2540ca7

+ 2 - 2
packages/app/src/pages/layout.tsx

@@ -1020,7 +1020,7 @@ export default function Layout(props: ParentProps) {
     }
 
     return (
-      <Dialog title="Delete workspace">
+      <Dialog title="Delete workspace" fit>
         <div class="flex flex-col gap-4 px-2.5 pb-3">
           <div class="flex flex-col gap-1">
             <span class="text-14-regular text-text-strong">Delete workspace "{name()}"?</span>
@@ -1097,7 +1097,7 @@ export default function Layout(props: ParentProps) {
     }
 
     return (
-      <Dialog title="Reset workspace">
+      <Dialog title="Reset workspace" fit>
         <div class="flex flex-col gap-4 px-2.5 pb-3">
           <div class="flex flex-col gap-1">
             <span class="text-14-regular text-text-strong">Reset workspace "{name()}"?</span>

+ 8 - 2
packages/ui/src/components/dialog.css

@@ -118,9 +118,15 @@
         outline: none;
       }
     }
+  }
+
+  &[data-fit] {
+    [data-slot="dialog-container"] {
+      height: auto;
 
-    &:focus-visible {
-      outline: none;
+      [data-slot="dialog-content"] {
+        min-height: 0;
+      }
     }
   }
 }

+ 2 - 1
packages/ui/src/components/dialog.tsx

@@ -8,11 +8,12 @@ export interface DialogProps extends ParentProps {
   action?: JSXElement
   class?: ComponentProps<"div">["class"]
   classList?: ComponentProps<"div">["classList"]
+  fit?: boolean
 }
 
 export function Dialog(props: DialogProps) {
   return (
-    <div data-component="dialog">
+    <div data-component="dialog" data-fit={props.fit ? true : undefined}>
       <div data-slot="dialog-container">
         <Kobalte.Content
           data-slot="dialog-content"