Dokploy/dokploy
1
0
Fork 0
mirror of https://github.com/Dokploy/dokploy.git synced 2026-06-19 14:15:21 +02:00
Code Issues Packages Projects Releases Wiki Activity

refactor: enhance UI components in HandleCertificate and SidebarLogo

Browse Source 
- Updated the HandleCertificate component to improve dialog content height and textarea styling for better usability.
- Adjusted the SidebarLogo component layout to enhance alignment and spacing, ensuring a more consistent appearance across the sidebar.
- Implemented responsive design adjustments to textarea elements, preventing overflow and improving user experience.
This commit is contained in:
Mauricio Siu
2026-06-17 08:13:28 -06:00
parent a54693905f
commit 381b92d5e4
2 changed files with 9 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
apps/dokploy/components/dashboard/settings/certificates/handle-certificate.tsx
View File

@@ -160,7 +160,7 @@ export const HandleCertificate = ({ certificateId }: Props) => {
</Button>
)}
</DialogTrigger>
<DialogContent className="sm:max-w-2xl">
<DialogContent className="sm:max-w-2xl max-h-[90vh] overflow-y-auto">
<DialogHeader>
<DialogTitle>
{certificateId ? "Update" : "Add New"} Certificate
@@ -200,7 +200,7 @@ export const HandleCertificate = ({ certificateId }: Props) => {
<FormLabel>Certificate Data</FormLabel>
<FormControl>
<Textarea
className="h-32"
className="h-32 max-h-32 resize-none overflow-y-auto field-sizing-fixed"
placeholder={certificateDataHolder}
{...field}
/>
@@ -217,7 +217,7 @@ export const HandleCertificate = ({ certificateId }: Props) => {
<FormLabel>Private Key</FormLabel>
<FormControl>
<Textarea
className="h-32"
className="h-32 max-h-32 resize-none overflow-y-auto field-sizing-fixed"
placeholder={privateKeyDataHolder}
{...field}
/>

16
apps/dokploy/components/layouts/side.tsx
View File

@@ -653,7 +653,7 @@ function SidebarLogo() {
const isDefault = org.members?.[0]?.isDefault ?? false;
return (
<div
className="flex flex-row justify-between"
className="flex flex-row items-center justify-between gap-1"
key={org.name}
>
<DropdownMenuItem
@@ -663,25 +663,21 @@ function SidebarLogo() {
});
window.location.reload();
}}
className="w-full gap-2 p-2"
className="flex min-w-0 flex-1 gap-2 p-2"
>
<div className="flex flex-col gap-1">
<div className="flex items-center gap-2">
{org.name}
</div>
</div>
<div className="flex size-6 items-center justify-center rounded-sm border">
<div className="flex size-6 shrink-0 items-center justify-center rounded-sm border">
<Logo
className={cn(
"transition-all",
state === "collapsed" ? "size-6" : "size-10",
state === "collapsed" ? "size-4" : "size-5",
)}
logoUrl={org.logo ?? undefined}
/>
</div>
<span className="truncate">{org.name}</span>
</DropdownMenuItem>
<div className="flex items-center gap-2">
<div className="flex shrink-0 items-center gap-2">
<Button
variant="ghost"
size="icon"