gsadmin/dokploy
1
0
Fork 0
mirror of https://github.com/Dokploy/dokploy.git synced 2026-10-19 07:01:35 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(ui): prevent service header overflow on mobile

Browse Source
This commit is contained in:
Glebson Santos
2026-10-05 12:29:44 -03:00
parent 48504fde4e
commit 5ccc15f00d
8 changed files with 32 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/dokploy/pages/dashboard/project/[projectId]/environment/[environmentId]/services/application/[applicationId].tsx
+4 -4
View File
@@ -123,9 +123,9 @@ const Service = (
<div className="w-full">
<Card className="h-full bg-sidebar p-2.5 rounded-xl w-full">
<div className="rounded-xl bg-background shadow-md ">
<CardHeader className="flex flex-row justify-between items-center">
<div className="flex flex-col">
<CardTitle className="text-xl flex flex-row gap-2 items-center">
<CardHeader className="flex w-full min-w-0 flex-row justify-between items-center">
<div className="flex min-w-0 flex-1 flex-col">
<CardTitle className="text-xl flex min-w-0 flex-row gap-2 items-center">
<div className="relative flex flex-row gap-4 items-center">
<ShowIconSettings
serviceId={applicationId}
@@ -136,7 +136,7 @@ const Service = (
<StatusTooltip status={data?.applicationStatus} />
</div>
</div>
{data?.name}
<span className="min-w-0 truncate">{data?.name}</span>
</CardTitle>
{data?.description && (
<CardDescription>{data?.description}</CardDescription>
apps/dokploy/pages/dashboard/project/[projectId]/environment/[environmentId]/services/compose/[composeId].tsx
+4 -4
View File
@@ -114,9 +114,9 @@ const Service = (
<Card className="h-full bg-sidebar p-2.5 rounded-xl w-full">
<div className="rounded-xl bg-background shadow-md ">
<div className="flex flex-col gap-4">
<CardHeader className="flex flex-row justify-between items-center">
<div className="flex flex-col">
<CardTitle className="text-xl flex flex-row gap-2 items-center">
<CardHeader className="flex w-full min-w-0 flex-row justify-between items-center">
<div className="flex min-w-0 flex-1 flex-col">
<CardTitle className="text-xl flex min-w-0 flex-row gap-2 items-center">
<div className="relative flex flex-row gap-4 items-center">
<ShowIconSettings
serviceId={composeId}
@@ -127,7 +127,7 @@ const Service = (
<StatusTooltip status={data?.composeStatus} />
</div>
</div>
{data?.name}
<span className="min-w-0 truncate">{data?.name}</span>
</CardTitle>
{data?.description && (
<CardDescription>{data?.description}</CardDescription>
apps/dokploy/pages/dashboard/project/[projectId]/environment/[environmentId]/services/libsql/[libsqlId].tsx
+4 -4
View File
@@ -80,9 +80,9 @@ const Libsql = (
</Head>
<Card className="h-full bg-sidebar p-2.5 rounded-xl w-full">
<div className="rounded-xl bg-background shadow-md ">
<CardHeader className="flex flex-row justify-between items-center">
<div className="flex flex-col">
<CardTitle className="text-xl flex flex-row gap-2">
<CardHeader className="flex w-full min-w-0 flex-row justify-between items-center">
<div className="flex min-w-0 flex-1 flex-col">
<CardTitle className="text-xl flex min-w-0 flex-row gap-2">
<div className="relative flex flex-row gap-4">
<div className="absolute -right-1 -top-2">
<StatusTooltip status={data?.applicationStatus} />
@@ -90,7 +90,7 @@ const Libsql = (
<LibsqlIcon className="h-6 w-6 text-muted-foreground" />
</div>
{data?.name}
<span className="min-w-0 truncate">{data?.name}</span>
</CardTitle>
{data?.description && (
<CardDescription>{data?.description}</CardDescription>
apps/dokploy/pages/dashboard/project/[projectId]/environment/[environmentId]/services/mariadb/[mariadbId].tsx
+4 -4
View File
@@ -92,9 +92,9 @@ const Mariadb = (
</Head>
<Card className="h-full bg-sidebar p-2.5 rounded-xl w-full">
<div className="rounded-xl bg-background shadow-md ">
<CardHeader className="flex flex-row justify-between items-center">
<div className="flex flex-col">
<CardTitle className="text-xl flex flex-row gap-2">
<CardHeader className="flex w-full min-w-0 flex-row justify-between items-center">
<div className="flex min-w-0 flex-1 flex-col">
<CardTitle className="text-xl flex min-w-0 flex-row gap-2">
<div className="relative flex flex-row gap-4">
<div className="absolute -right-1 -top-2">
<StatusTooltip status={data?.applicationStatus} />
@@ -102,7 +102,7 @@ const Mariadb = (
<MariadbIcon className="h-6 w-6 text-muted-foreground" />
</div>
{data?.name}
<span className="min-w-0 truncate">{data?.name}</span>
</CardTitle>
{data?.description && (
<CardDescription>{data?.description}</CardDescription>
apps/dokploy/pages/dashboard/project/[projectId]/environment/[environmentId]/services/mongo/[mongoId].tsx
+4 -4
View File
@@ -91,9 +91,9 @@ const Mongo = (
<div className="w-full">
<Card className="h-full bg-sidebar p-2.5 rounded-xl w-full">
<div className="rounded-xl bg-background shadow-md ">
<CardHeader className="flex flex-row justify-between items-center">
<div className="flex flex-col">
<CardTitle className="text-xl flex flex-row gap-2">
<CardHeader className="flex w-full min-w-0 flex-row justify-between items-center">
<div className="flex min-w-0 flex-1 flex-col">
<CardTitle className="text-xl flex min-w-0 flex-row gap-2">
<div className="relative flex flex-row gap-4">
<div className="absolute -right-1 -top-2">
<StatusTooltip status={data?.applicationStatus} />
@@ -101,7 +101,7 @@ const Mongo = (
<MongodbIcon className="h-6 w-6 text-muted-foreground" />
</div>
{data?.name}
<span className="min-w-0 truncate">{data?.name}</span>
</CardTitle>
{data?.description && (
<CardDescription>{data?.description}</CardDescription>
apps/dokploy/pages/dashboard/project/[projectId]/environment/[environmentId]/services/mysql/[mysqlId].tsx
+4 -4
View File
@@ -91,9 +91,9 @@ const MySql = (
<div className="w-full">
<Card className="h-full bg-sidebar p-2.5 rounded-xl w-full">
<div className="rounded-xl bg-background shadow-md ">
<CardHeader className="flex flex-row justify-between items-center">
<div className="flex flex-col">
<CardTitle className="text-xl flex flex-row gap-2">
<CardHeader className="flex w-full min-w-0 flex-row justify-between items-center">
<div className="flex min-w-0 flex-1 flex-col">
<CardTitle className="text-xl flex min-w-0 flex-row gap-2">
<div className="relative flex flex-row gap-4">
<div className="absolute -right-1 -top-2">
<StatusTooltip status={data?.applicationStatus} />
@@ -101,7 +101,7 @@ const MySql = (
<MysqlIcon className="h-6 w-6 text-muted-foreground" />
</div>
{data?.name}
<span className="min-w-0 truncate">{data?.name}</span>
</CardTitle>
{data?.description && (
<CardDescription>{data?.description}</CardDescription>
apps/dokploy/pages/dashboard/project/[projectId]/environment/[environmentId]/services/postgres/[postgresId].tsx
+4 -4
View File
@@ -90,9 +90,9 @@ const Postgresql = (
<div className="w-full">
<Card className="h-full bg-sidebar p-2.5 rounded-xl w-full">
<div className="rounded-xl bg-background shadow-md ">
<CardHeader className="flex flex-row justify-between items-center">
<div className="flex flex-col">
<CardTitle className="text-xl flex flex-row gap-2">
<CardHeader className="flex w-full min-w-0 flex-row justify-between items-center">
<div className="flex min-w-0 flex-1 flex-col">
<CardTitle className="text-xl flex min-w-0 flex-row gap-2">
<div className="relative flex flex-row gap-4">
<div className="absolute -right-1 -top-2">
<StatusTooltip status={data?.applicationStatus} />
@@ -100,7 +100,7 @@ const Postgresql = (
<PostgresqlIcon className="h-6 w-6 text-muted-foreground" />
</div>
{data?.name}
<span className="min-w-0 truncate">{data?.name}</span>
</CardTitle>
{data?.description && (
<CardDescription>{data?.description}</CardDescription>
apps/dokploy/pages/dashboard/project/[projectId]/environment/[environmentId]/services/redis/[redisId].tsx
+4 -4
View File
@@ -90,9 +90,9 @@ const Redis = (
<div className="w-full">
<Card className="h-full bg-sidebar p-2.5 rounded-xl w-full">
<div className="rounded-xl bg-background shadow-md ">
<CardHeader className="flex flex-row justify-between items-center">
<div className="flex flex-col">
<CardTitle className="text-xl flex flex-row gap-2">
<CardHeader className="flex w-full min-w-0 flex-row justify-between items-center">
<div className="flex min-w-0 flex-1 flex-col">
<CardTitle className="text-xl flex min-w-0 flex-row gap-2">
<div className="relative flex flex-row gap-4">
<div className="absolute -right-1 -top-2">
<StatusTooltip status={data?.applicationStatus} />
@@ -100,7 +100,7 @@ const Redis = (
<RedisIcon className="h-6 w-6 text-muted-foreground" />
</div>
{data?.name}
<span className="min-w-0 truncate">{data?.name}</span>
</CardTitle>
{data?.description && (
<CardDescription>{data?.description}</CardDescription>