From e6a2c45caabd35c76a7032be45cd2d175aaf8172 Mon Sep 17 00:00:00 2001
From: wil <wilwong@users.noreply.github.com>
Date: Mon, 6 May 2024 23:47:09 -0400
Subject: [PATCH] Timeline Border overlaps Loading Bar Screen (#312)

css issue, simple fix

Co-authored-by: wil <wil@storyteller.ai>
---
 app/modules/TopBar/TopBar.tsx       | 2 +-
 app/pages/PageEnigma/PageEnigma.tsx | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/app/modules/TopBar/TopBar.tsx b/app/modules/TopBar/TopBar.tsx
index 8f20d38a33..cb079c7709 100644
--- a/app/modules/TopBar/TopBar.tsx
+++ b/app/modules/TopBar/TopBar.tsx
@@ -20,7 +20,7 @@ export const TopBar = ({ pageName }: Props) => {
   const currentLocation = getCurrentLocationWithoutParams(useLocation().pathname, useParams());
 
   return (
-    <header className="fixed left-0 top-0 z-10 w-full border-b border-ui-panel-border bg-ui-panel">
+    <header className="fixed left-0 top-0 z-30 w-full border-b border-ui-panel-border bg-ui-panel">
       <nav
         className="mx-auto grid h-[64px] w-screen grid-cols-3 items-center justify-between p-3"
         aria-label="Global">
diff --git a/app/pages/PageEnigma/PageEnigma.tsx b/app/pages/PageEnigma/PageEnigma.tsx
index 3b6dffa8d1..a10cf43e1d 100644
--- a/app/pages/PageEnigma/PageEnigma.tsx
+++ b/app/pages/PageEnigma/PageEnigma.tsx
@@ -23,7 +23,7 @@ export const PageEnigma = ({
       </EngineProvider>
       <LoadingBar
         id="editor-loading-bar"
-        wrapperClassName="absolute top-0 left-0"
+        wrapperClassName="absolute top-0 left-0 z-20"
         innerWrapperClassName="max-w-screen-sm"
       />
     </TrackProvider>