diff --git a/repl/public/global.css b/repl/public/global.css
index 469626bd..f9ca8cce 100644
--- a/repl/public/global.css
+++ b/repl/public/global.css
@@ -11,6 +11,7 @@ body {
height: 100% !important;
background-color: transparent !important;
font-size: 15px;
+ z-index:20
}
.CodeMirror-line > span {
diff --git a/repl/src/App.tsx b/repl/src/App.tsx
index c0e23af8..8a5dd3a6 100644
--- a/repl/src/App.tsx
+++ b/repl/src/App.tsx
@@ -78,7 +78,7 @@ function App() {
id="header"
className={cx(
'flex-none w-full h-14 px-2 flex border-b border-gray-200 justify-between z-[10]',
- uiHidden ? 'bg-transparent text-white' : 'bg-white'
+ uiHidden ? 'bg-transparent text-white' : 'bg-white',
)}
>
@@ -135,7 +135,7 @@ function App() {
className={cx(
'h-full transition-opacity',
error ? 'focus:ring-red-500' : 'focus:ring-slate-800',
- uiHidden ? 'opacity-0' : 'opacity-100'
+ uiHidden ? 'opacity-0' : 'opacity-100',
)}
>
-
+
);
}
diff --git a/repl/src/draw.mjs b/repl/src/draw.mjs
index cc445503..6135405b 100644
--- a/repl/src/draw.mjs
+++ b/repl/src/draw.mjs
@@ -8,7 +8,7 @@ export const getDrawContext = (id = 'test-canvas') => {
canvas.id = id;
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
- canvas.style = 'pointer-events:none;width:100%;height:100%;position:fixed;top:0;left:0';
+ canvas.style = 'pointer-events:none;width:100%;height:100%;position:fixed;top:0;left:0;z-index:5';
document.body.prepend(canvas);
}
return canvas.getContext('2d');