From ef0cf9bd02be4569b1e0077bc5fd69162b63f097 Mon Sep 17 00:00:00 2001
From: Nahidujjaman Hridoy <75487507+nhridoy@users.noreply.github.com>
Date: Wed, 13 May 2026 13:03:59 +0600
Subject: [PATCH] fix: responsive layout (#4391)

Signed-off-by: Nahidujjaman Hridoy <hridoyboss12@gmail.com>
---
 .../dashboard/docker/logs/analyze-logs.tsx    |  2 +-
 .../dashboard/docker/logs/docker-logs-id.tsx  | 25 +++++++++++--------
 2 files changed, 16 insertions(+), 11 deletions(-)

diff --git a/apps/dokploy/components/dashboard/docker/logs/analyze-logs.tsx b/apps/dokploy/components/dashboard/docker/logs/analyze-logs.tsx
index d40697437..1b8ec736a 100644
--- a/apps/dokploy/components/dashboard/docker/logs/analyze-logs.tsx
+++ b/apps/dokploy/components/dashboard/docker/logs/analyze-logs.tsx
@@ -90,7 +90,7 @@ export function AnalyzeLogs({ logs, context }: Props) {
 					disabled={logs.length === 0}
 					title="Analyze logs with AI"
 				>
-					<Bot className="mr-2 h-4 w-4" />
+					<Bot className="mr-2 size-4" />
 					AI
 				</Button>
 			</PopoverTrigger>
diff --git a/apps/dokploy/components/dashboard/docker/logs/docker-logs-id.tsx b/apps/dokploy/components/dashboard/docker/logs/docker-logs-id.tsx
index 8d8842ac0..3a5f460e9 100644
--- a/apps/dokploy/components/dashboard/docker/logs/docker-logs-id.tsx
+++ b/apps/dokploy/components/dashboard/docker/logs/docker-logs-id.tsx
@@ -347,11 +347,13 @@ export const DockerLogsId: React.FC<Props> = ({
 								title={isPaused ? "Resume logs" : "Pause logs"}
 							>
 								{isPaused ? (
-									<Play className="mr-2 h-4 w-4" />
+									<Play className="size-4" />
 								) : (
-									<Pause className="mr-2 h-4 w-4" />
+									<Pause className="size-4" />
 								)}
-								{isPaused ? "Resume" : "Pause"}
+								<span className="hidden lg:ml-2 lg:inline">
+									{isPaused ? "Resume" : "Pause"}
+								</span>
 							</Button>
 							<Button
 								variant="outline"
@@ -362,11 +364,13 @@ export const DockerLogsId: React.FC<Props> = ({
 								title="Copy logs to clipboard"
 							>
 								{copied ? (
-									<Check className="mr-2 h-4 w-4" />
+									<Check className="size-4" />
 								) : (
-									<Copy className="mr-2 h-4 w-4" />
+									<Copy className="size-4" />
 								)}
-								Copy
+								<span className="hidden lg:ml-2 lg:inline">
+									{copied ? "Copied" : "Copy"}
+								</span>
 							</Button>
 							<Button
 								variant="outline"
@@ -374,17 +378,18 @@ export const DockerLogsId: React.FC<Props> = ({
 								className="h-9 sm:w-auto w-full"
 								onClick={handleDownload}
 								disabled={filteredLogs.length === 0 || !data?.Name}
+								title="Download logs as text file"
 							>
-								<DownloadIcon className="mr-2 h-4 w-4" />
-								Download logs
+								<DownloadIcon className="size-4" />
+								<span className="hidden lg:ml-2 lg:inline">Download logs</span>
 							</Button>
 							<AnalyzeLogs logs={filteredLogs} context="runtime" />
 						</div>
 					</div>
 					{isPaused && (
-						<AlertBlock type="warning">
+						<AlertBlock type="warning" className="items-center">
 							<div className="flex items-center gap-2">
-								<Pause className="h-4 w-4" />
+								<Pause className="size-4" />
 								<span>
 									Logs paused
 									{messageBuffer.length > 0 && (