mirror of
https://github.com/LukeHagar/dokploy.git
synced 2025-12-06 12:27:49 +00:00
fix(ui): remove max-h-screen and overflow-y-auto from project and database dialogs
Remove problematic CSS classes from: - Project creation and management dialogs - Database backup and restore dialogs - Compose service management dialogs - Template and AI generator dialogs Ensures stable dialog behavior.
This commit is contained in:
@@ -126,7 +126,7 @@ export const DeleteService = ({ id, type }: Props) => {
|
|||||||
<Trash2 className="size-4 text-primary group-hover:text-red-500" />
|
<Trash2 className="size-4 text-primary group-hover:text-red-500" />
|
||||||
</Button>
|
</Button>
|
||||||
</DialogTrigger>
|
</DialogTrigger>
|
||||||
<DialogContent className="max-h-screen overflow-y-auto sm:max-w-lg">
|
<DialogContent className="sm:max-w-lg">
|
||||||
<DialogHeader>
|
<DialogHeader>
|
||||||
<DialogTitle>Are you absolutely sure?</DialogTitle>
|
<DialogTitle>Are you absolutely sure?</DialogTitle>
|
||||||
<DialogDescription>
|
<DialogDescription>
|
||||||
|
|||||||
@@ -52,7 +52,7 @@ export const ShowConvertedCompose = ({ composeId }: Props) => {
|
|||||||
Preview Compose
|
Preview Compose
|
||||||
</Button>
|
</Button>
|
||||||
</DialogTrigger>
|
</DialogTrigger>
|
||||||
<DialogContent className="sm:max-w-6xl max-h-[50rem] overflow-y-auto">
|
<DialogContent className="sm:max-w-6xl max-h-[50rem]">
|
||||||
<DialogHeader>
|
<DialogHeader>
|
||||||
<DialogTitle>Converted Compose</DialogTitle>
|
<DialogTitle>Converted Compose</DialogTitle>
|
||||||
<DialogDescription>
|
<DialogDescription>
|
||||||
|
|||||||
@@ -23,7 +23,7 @@ export const ShowUtilities = ({ composeId }: Props) => {
|
|||||||
<DialogTrigger asChild>
|
<DialogTrigger asChild>
|
||||||
<Button variant="ghost">Show Utilities</Button>
|
<Button variant="ghost">Show Utilities</Button>
|
||||||
</DialogTrigger>
|
</DialogTrigger>
|
||||||
<DialogContent className="max-h-screen overflow-y-auto sm:max-w-5xl">
|
<DialogContent className="sm:max-w-5xl">
|
||||||
<DialogHeader>
|
<DialogHeader>
|
||||||
<DialogTitle>Utilities </DialogTitle>
|
<DialogTitle>Utilities </DialogTitle>
|
||||||
<DialogDescription>Modify the application data</DialogDescription>
|
<DialogDescription>Modify the application data</DialogDescription>
|
||||||
|
|||||||
@@ -329,7 +329,7 @@ export const HandleBackup = ({
|
|||||||
</Button>
|
</Button>
|
||||||
)}
|
)}
|
||||||
</DialogTrigger>
|
</DialogTrigger>
|
||||||
<DialogContent className="sm:max-w-2xl max-h-screen overflow-y-auto">
|
<DialogContent className="sm:max-w-2xl">
|
||||||
<DialogHeader>
|
<DialogHeader>
|
||||||
<DialogTitle>
|
<DialogTitle>
|
||||||
{backupId ? "Update Backup" : "Create Backup"}
|
{backupId ? "Update Backup" : "Create Backup"}
|
||||||
|
|||||||
@@ -324,7 +324,7 @@ export const RestoreBackup = ({
|
|||||||
Restore Backup
|
Restore Backup
|
||||||
</Button>
|
</Button>
|
||||||
</DialogTrigger>
|
</DialogTrigger>
|
||||||
<DialogContent className="max-h-screen overflow-y-auto sm:max-w-lg">
|
<DialogContent className="sm:max-w-lg">
|
||||||
<DialogHeader>
|
<DialogHeader>
|
||||||
<DialogTitle className="flex items-center">
|
<DialogTitle className="flex items-center">
|
||||||
<RotateCcw className="mr-2 size-4" />
|
<RotateCcw className="mr-2 size-4" />
|
||||||
|
|||||||
@@ -119,7 +119,7 @@ export const AddApplication = ({ projectId, projectName }: Props) => {
|
|||||||
<span>Application</span>
|
<span>Application</span>
|
||||||
</DropdownMenuItem>
|
</DropdownMenuItem>
|
||||||
</DialogTrigger>
|
</DialogTrigger>
|
||||||
<DialogContent className="max-h-screen overflow-y-auto sm:max-w-lg">
|
<DialogContent className=" sm:max-w-lg">
|
||||||
<DialogHeader>
|
<DialogHeader>
|
||||||
<DialogTitle>Create</DialogTitle>
|
<DialogTitle>Create</DialogTitle>
|
||||||
<DialogDescription>
|
<DialogDescription>
|
||||||
|
|||||||
@@ -124,7 +124,7 @@ export const AddCompose = ({ projectId, projectName }: Props) => {
|
|||||||
<span>Compose</span>
|
<span>Compose</span>
|
||||||
</DropdownMenuItem>
|
</DropdownMenuItem>
|
||||||
</DialogTrigger>
|
</DialogTrigger>
|
||||||
<DialogContent className="max-h-screen overflow-y-auto sm:max-w-xl">
|
<DialogContent className=" sm:max-w-xl">
|
||||||
<DialogHeader>
|
<DialogHeader>
|
||||||
<DialogTitle>Create Compose</DialogTitle>
|
<DialogTitle>Create Compose</DialogTitle>
|
||||||
<DialogDescription>
|
<DialogDescription>
|
||||||
|
|||||||
@@ -283,7 +283,7 @@ export const AddDatabase = ({ projectId, projectName }: Props) => {
|
|||||||
<span>Database</span>
|
<span>Database</span>
|
||||||
</DropdownMenuItem>
|
</DropdownMenuItem>
|
||||||
</DialogTrigger>
|
</DialogTrigger>
|
||||||
<DialogContent className="max-h-screen md:max-h-[90vh] overflow-y-auto sm:max-w-2xl">
|
<DialogContent className="md:max-h-[90vh] sm:max-w-2xl">
|
||||||
<DialogHeader>
|
<DialogHeader>
|
||||||
<DialogTitle>Databases</DialogTitle>
|
<DialogTitle>Databases</DialogTitle>
|
||||||
</DialogHeader>
|
</DialogHeader>
|
||||||
|
|||||||
@@ -148,7 +148,7 @@ export const AddTemplate = ({ projectId, baseUrl }: Props) => {
|
|||||||
<span>Template</span>
|
<span>Template</span>
|
||||||
</DropdownMenuItem>
|
</DropdownMenuItem>
|
||||||
</DialogTrigger>
|
</DialogTrigger>
|
||||||
<DialogContent className="max-h-screen sm:max-w-[90vw] p-0">
|
<DialogContent className="sm:max-w-[90vw] p-0">
|
||||||
<DialogHeader className="sticky top-0 z-10 bg-background p-6 border-b">
|
<DialogHeader className="sticky top-0 z-10 bg-background p-6 border-b">
|
||||||
<div className="flex flex-col space-y-6">
|
<div className="flex flex-col space-y-6">
|
||||||
<div className="flex flex-col lg:flex-row lg:items-center lg:justify-between gap-6">
|
<div className="flex flex-col lg:flex-row lg:items-center lg:justify-between gap-6">
|
||||||
|
|||||||
@@ -158,7 +158,7 @@ export const TemplateGenerator = ({ projectId }: Props) => {
|
|||||||
<span>AI Assistant</span>
|
<span>AI Assistant</span>
|
||||||
</DropdownMenuItem>
|
</DropdownMenuItem>
|
||||||
</DialogTrigger>
|
</DialogTrigger>
|
||||||
<DialogContent className="max-h-screen overflow-y-auto sm:max-w-4xl w-full flex flex-col">
|
<DialogContent className="sm:max-w-4xl w-full flex flex-col">
|
||||||
<DialogHeader>
|
<DialogHeader>
|
||||||
<DialogTitle>AI Assistant</DialogTitle>
|
<DialogTitle>AI Assistant</DialogTitle>
|
||||||
<DialogDescription>
|
<DialogDescription>
|
||||||
|
|||||||
@@ -167,7 +167,7 @@ export const DuplicateProject = ({
|
|||||||
|
|
||||||
<div className="grid gap-2">
|
<div className="grid gap-2">
|
||||||
<Label>Selected services to duplicate</Label>
|
<Label>Selected services to duplicate</Label>
|
||||||
<div className="space-y-2 max-h-[200px] overflow-y-auto border rounded-md p-4">
|
<div className="space-y-2 max-h-[200px] border rounded-md p-4">
|
||||||
{selectedServices.map((service) => (
|
{selectedServices.map((service) => (
|
||||||
<div key={service.id} className="flex items-center space-x-2">
|
<div key={service.id} className="flex items-center space-x-2">
|
||||||
<span className="text-sm">
|
<span className="text-sm">
|
||||||
|
|||||||
@@ -94,7 +94,7 @@ export const ProjectEnvironment = ({ projectId, children }: Props) => {
|
|||||||
</DropdownMenuItem>
|
</DropdownMenuItem>
|
||||||
)}
|
)}
|
||||||
</DialogTrigger>
|
</DialogTrigger>
|
||||||
<DialogContent className="max-h-screen overflow-y-auto sm:max-w-6xl">
|
<DialogContent className="sm:max-w-6xl">
|
||||||
<DialogHeader>
|
<DialogHeader>
|
||||||
<DialogTitle>Project Environment</DialogTitle>
|
<DialogTitle>Project Environment</DialogTitle>
|
||||||
<DialogDescription>
|
<DialogDescription>
|
||||||
|
|||||||
@@ -157,7 +157,7 @@ export const ShowProjects = () => {
|
|||||||
</Button>
|
</Button>
|
||||||
</DropdownMenuTrigger>
|
</DropdownMenuTrigger>
|
||||||
<DropdownMenuContent
|
<DropdownMenuContent
|
||||||
className="w-[200px] space-y-2 overflow-y-auto max-h-[400px]"
|
className="w-[200px] space-y-2 max-h-[400px]"
|
||||||
onClick={(e) => e.stopPropagation()}
|
onClick={(e) => e.stopPropagation()}
|
||||||
>
|
>
|
||||||
{project.applications.length > 0 && (
|
{project.applications.length > 0 && (
|
||||||
@@ -265,7 +265,7 @@ export const ShowProjects = () => {
|
|||||||
</Button>
|
</Button>
|
||||||
</DropdownMenuTrigger>
|
</DropdownMenuTrigger>
|
||||||
<DropdownMenuContent
|
<DropdownMenuContent
|
||||||
className="w-[200px] space-y-2 overflow-y-auto max-h-[280px]"
|
className="w-[200px] space-y-2 max-h-[280px]"
|
||||||
onClick={(e) => e.stopPropagation()}
|
onClick={(e) => e.stopPropagation()}
|
||||||
>
|
>
|
||||||
<DropdownMenuLabel className="font-normal">
|
<DropdownMenuLabel className="font-normal">
|
||||||
|
|||||||
Reference in New Issue
Block a user