From f1e324e129c3b6eb70806fb411e03dcbf259cca3 Mon Sep 17 00:00:00 2001
From: Andras Bacsai <5845193+andrasbacsai@users.noreply.github.com>
Date: Fri, 30 May 2025 13:35:16 +0200
Subject: [PATCH] refactor(activity-monitor): enhance layout responsiveness by
 adjusting class bindings and structure for better display

---
 .../views/livewire/activity-monitor.blade.php     | 15 ++++++++++-----
 1 file changed, 10 insertions(+), 5 deletions(-)

diff --git a/resources/views/livewire/activity-monitor.blade.php b/resources/views/livewire/activity-monitor.blade.php
index 40de86c47..ce012e724 100644
--- a/resources/views/livewire/activity-monitor.blade.php
+++ b/resources/views/livewire/activity-monitor.blade.php
@@ -1,8 +1,11 @@
 @php use App\Actions\CoolifyTask\RunRemoteProcess; @endphp
-<div class="h-full">
+<div @class([
+    'h-full flex flex-col overflow-hidden' => $fullHeight,
+    'h-full overflow-hidden' => !$fullHeight,
+])>
     @if ($activity)
         @if (isset($header))
-            <div class="flex gap-2 pb-2">
+            <div class="flex gap-2 pb-2 flex-shrink-0">
                 <h3>{{ $header }}</h3>
                 @if ($isPollingActive)
                     <x-loading />
@@ -10,15 +13,17 @@
             </div>
         @endif
         <div @class([
-            'flex flex-col-reverse w-full px-4 py-2 overflow-y-auto bg-white border border-solid rounded-sm dark:text-white dark:bg-coolgray-100 scrollbar border-neutral-300 dark:border-coolgray-300',
-            'h-full' => $fullHeight,
+            'flex flex-col w-full px-4 py-2 overflow-y-auto bg-white border border-solid rounded-sm dark:text-white dark:bg-coolgray-100 scrollbar border-neutral-300 dark:border-coolgray-300',
+            'flex-1 min-h-0' => $fullHeight,
             'max-h-96' => !$fullHeight,
         ])>
             <pre class="font-mono whitespace-pre-wrap" @if ($isPollingActive) wire:poll.1000ms="polling" @endif>{{ RunRemoteProcess::decodeOutput($activity) }}</pre>
         </div>
     @else
         @if ($showWaiting)
-            <x-loading text="Waiting..." />
+            <div class="flex justify-start">
+                <x-loading text="Waiting..." />
+            </div>
         @endif
     @endif
 </div>