chore: minor ui fixes

This commit is contained in:
Zakher Masri 2025-03-11 18:10:55 +03:00
parent 8edfd658f6
commit f84929af35
3 changed files with 158 additions and 158 deletions

View File

@ -259,7 +259,7 @@ const TemplateGrid: React.FC<TemplateGridProps> = ({ view }) => {
open={!!selectedTemplate}
onOpenChange={() => setSelectedTemplate(null)}
>
<DialogContent className="max-w-[90vw] w-full lg:max-w-[90vw] max-h-[85vh] overflow-y-auto p-0">
<DialogContent className="!max-w-[90vw] w-full lg:max-w-[90vw] max-h-[85vh] overflow-y-auto p-0">
<DialogHeader className="space-y-4 border-b sticky top-0 p-4 bg-background z-10">
<div className="flex items-center gap-4">
{selectedTemplate?.logo && (
@ -313,7 +313,7 @@ const TemplateGrid: React.FC<TemplateGridProps> = ({ view }) => {
</div>
</DialogHeader>
<div className="p-6 pt-3 flex flex-col gap-2">
<div className="p-6 pt-3 max-w-[100%] flex flex-col gap-2">
<DialogDescription className="text-base">
{selectedTemplate?.description}
</DialogDescription>
@ -374,7 +374,7 @@ const TemplateGrid: React.FC<TemplateGridProps> = ({ view }) => {
</TabsList>
<TabsContent value="docker-compose">
{templateFiles?.dockerCompose && (
<div className="max-w-6xl w-full relative">
<div className=" flex flex-col relative">
<Label className=" flex mb-2 flex-col items-start w-fit justify-start gap-1">
<span className="leading-tight text-xl font-semibold">
Docker Compose

View File

@ -87,7 +87,7 @@ const dockerComposeServiceOptions = [
}));
function dockerComposeComplete(
context: CompletionContext,
context: CompletionContext
): CompletionResult | null {
const word = context.matchBefore(/\w*/);
if (!word) return null;
@ -165,11 +165,11 @@ export const CodeEditor = ({
className={cn(
"w-full h-full text-sm leading-relaxed",
`cm-theme-${theme}`,
className,
className
)}
/>
{props.disabled && (
<div className="absolute top-0 rounded-md left-0 w-full h-full flex items-center justify-center z-[10] [background:var(--overlay)] h-full" />
<div className="absolute top-0 rounded-md left-0 w-full flex items-center justify-center z-[10] [background:var(--overlay)] h-full" />
)}
</div>
);

View File

@ -1,31 +1,31 @@
import * as React from "react"
import * as DialogPrimitive from "@radix-ui/react-dialog"
import { XIcon } from "lucide-react"
import * as React from "react";
import * as DialogPrimitive from "@radix-ui/react-dialog";
import { XIcon } from "lucide-react";
import { cn } from "@/lib/utils"
import { cn } from "@/lib/utils";
function Dialog({
...props
}: React.ComponentProps<typeof DialogPrimitive.Root>) {
return <DialogPrimitive.Root data-slot="dialog" {...props} />
return <DialogPrimitive.Root data-slot="dialog" {...props} />;
}
function DialogTrigger({
...props
}: React.ComponentProps<typeof DialogPrimitive.Trigger>) {
return <DialogPrimitive.Trigger data-slot="dialog-trigger" {...props} />
return <DialogPrimitive.Trigger data-slot="dialog-trigger" {...props} />;
}
function DialogPortal({
...props
}: React.ComponentProps<typeof DialogPrimitive.Portal>) {
return <DialogPrimitive.Portal data-slot="dialog-portal" {...props} />
return <DialogPrimitive.Portal data-slot="dialog-portal" {...props} />;
}
function DialogClose({
...props
}: React.ComponentProps<typeof DialogPrimitive.Close>) {
return <DialogPrimitive.Close data-slot="dialog-close" {...props} />
return <DialogPrimitive.Close data-slot="dialog-close" {...props} />;
}
function DialogOverlay({
@ -41,7 +41,7 @@ function DialogOverlay({
)}
{...props}
/>
)
);
}
function DialogContent({
@ -62,12 +62,12 @@ function DialogContent({
>
{children}
<DialogPrimitive.Close className="p-2 ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 z-20 cursor-pointer">
<XIcon className="size-5"/>
<XIcon className="size-5" />
<span className="sr-only">Close</span>
</DialogPrimitive.Close>
</DialogPrimitive.Content>
</DialogPortal>
)
);
}
function DialogHeader({ className, ...props }: React.ComponentProps<"div">) {
@ -77,7 +77,7 @@ function DialogHeader({ className, ...props }: React.ComponentProps<"div">) {
className={cn("flex flex-col gap-2 text-center sm:text-left", className)}
{...props}
/>
)
);
}
function DialogFooter({ className, ...props }: React.ComponentProps<"div">) {
@ -90,7 +90,7 @@ function DialogFooter({ className, ...props }: React.ComponentProps<"div">) {
)}
{...props}
/>
)
);
}
function DialogTitle({
@ -103,7 +103,7 @@ function DialogTitle({
className={cn("text-lg leading-none font-semibold", className)}
{...props}
/>
)
);
}
function DialogDescription({
@ -116,7 +116,7 @@ function DialogDescription({
className={cn("text-muted-foreground text-sm", className)}
{...props}
/>
)
);
}
export {
@ -130,4 +130,4 @@ export {
DialogPortal,
DialogTitle,
DialogTrigger,
}
};