From 1d02927f6b01c72bcc6e3f3f7ce9e5b070bc30c3 Mon Sep 17 00:00:00 2001
From: "SPRINX0\\prochazka" <jan.prochazka@sprinx.com>
Date: Thu, 27 Feb 2025 12:44:34 +0100
Subject: [PATCH] scroll in xml cell data view

---
 packages/web/src/celldata/XmlCellView.svelte  | 19 ++++++++++++++++---
 .../web/src/celldata/XmlHighlighter.svelte    |  8 +-------
 .../web/src/widgets/CellDataWidget.svelte     |  1 +
 3 files changed, 18 insertions(+), 10 deletions(-)

diff --git a/packages/web/src/celldata/XmlCellView.svelte b/packages/web/src/celldata/XmlCellView.svelte
index 523076ff8..ea52859a5 100644
--- a/packages/web/src/celldata/XmlCellView.svelte
+++ b/packages/web/src/celldata/XmlCellView.svelte
@@ -4,6 +4,19 @@
   export let selection;
 </script>
 
-{#each selection as cell}
-  <XmlHighlighter code={cell.value} />
-{/each}
+<div class="wrapper">
+  {#each selection as cell}
+    <XmlHighlighter code={cell.value} />
+  {/each}
+</div>
+
+<style>
+  .wrapper {
+    overflow: scroll;
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+  }
+</style>
diff --git a/packages/web/src/celldata/XmlHighlighter.svelte b/packages/web/src/celldata/XmlHighlighter.svelte
index f6df74049..a2973c5e6 100644
--- a/packages/web/src/celldata/XmlHighlighter.svelte
+++ b/packages/web/src/celldata/XmlHighlighter.svelte
@@ -24,19 +24,13 @@
 </script>
 
 {#key formattedCode}
-  <pre><code bind:this={codeBlock}>{formattedCode}</code></pre>
+  <pre bind:this={codeBlock}>{formattedCode}</pre>
 {/key}
 
 <style>
   pre {
     margin: 0;
     padding: 0;
-    width: 100%;
-  }
-
-  code {
-    display: block;
     padding: 0.5em;
-    overflow-x: auto;
   }
 </style>
diff --git a/packages/web/src/widgets/CellDataWidget.svelte b/packages/web/src/widgets/CellDataWidget.svelte
index 380c8baae..783b8084c 100644
--- a/packages/web/src/widgets/CellDataWidget.svelte
+++ b/packages/web/src/widgets/CellDataWidget.svelte
@@ -156,6 +156,7 @@
     display: flex;
     flex: 1;
     flex-direction: column;
+    position: relative;
   }
 
   .toolbar {