From 9d6dbc9b49ce9a1fc9864f70c08fc2967d989c48 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Kiss=20R=C3=B3bert?= <ert78gb@gmail.com>
Date: Wed, 28 Jan 2026 00:56:08 +0100
Subject: [PATCH] fix: fine tune scrollbar and close button of error panel

---
 packages/uhk-web/src/app/app.component.html |  4 +++-
 packages/uhk-web/src/app/app.component.scss | 16 +++++++++++-----
 2 files changed, 14 insertions(+), 6 deletions(-)

diff --git a/packages/uhk-web/src/app/app.component.html b/packages/uhk-web/src/app/app.component.html
index be00dccf3c0..ba2def56b50 100644
--- a/packages/uhk-web/src/app/app.component.html
+++ b/packages/uhk-web/src/app/app.component.html
@@ -41,8 +41,10 @@
                 <router-outlet></router-outlet>
             </as-split-area>
             <as-split-area *ngIf="statusBuffer" [size]="splitSizes.bottom" class="error-panel" [@errorPanel]>
-                <pre [innerHTML]="statusBuffer | newLineToBr | safeHtml"></pre>
                 <button type="button" class="btn-close" aria-label="Close" (click)="closeErrorPanel()"></button>
+                <div class="error-panel-content">
+                    <pre [innerHTML]="statusBuffer | newLineToBr | safeHtml"></pre>
+                </div>
             </as-split-area>
         </as-split>
     </div>
diff --git a/packages/uhk-web/src/app/app.component.scss b/packages/uhk-web/src/app/app.component.scss
index 0ad061daf6e..af3210646e5 100644
--- a/packages/uhk-web/src/app/app.component.scss
+++ b/packages/uhk-web/src/app/app.component.scss
@@ -24,17 +24,23 @@
                 .btn-close {
                     position: absolute;
                     top: 2px;
-                    right: 2px;
+                    right: 14px;
                     display: inline;
+                    z-index: 10;
                 }
 
-                pre {
+                .error-panel-content {
+                    overflow: auto;
                     position: absolute;
+                    top: 0;
+                    bottom: 0;
                     left: 0;
                     right: 0;
-                    bottom: 0;
-                    top: 0;
-                    margin: 0;
+
+                    pre {
+                        overflow: visible;
+                        margin: 0;
+                    }
                 }
             }