fix: fine tune scrollbar and close button of error panel

Author: ert78gb

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>

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;
+                    }
                 }
             }