From ac2951ddc4dccba5eea313915a8959f1f65aec4a Mon Sep 17 00:00:00 2001
From: Dennis Collaris <d.collaris@me.com>
Date: Fri, 23 Aug 2024 11:06:33 +0200
Subject: [PATCH] fix: reshuffle z-index and rely on natural order instead of
forced z-indexes
---
libs/shared/lib/components/tooltip/Tooltip.tsx | 2 +-
libs/shared/lib/vis/components/VisualizationPanel.tsx | 4 ++--
libs/shared/lib/vis/components/VisualizationTabBar.tsx | 2 +-
3 files changed, 4 insertions(+), 4 deletions(-)
diff --git a/libs/shared/lib/components/tooltip/Tooltip.tsx b/libs/shared/lib/components/tooltip/Tooltip.tsx
index 4f6b91f7d..ac37a2506 100644
--- a/libs/shared/lib/components/tooltip/Tooltip.tsx
+++ b/libs/shared/lib/components/tooltip/Tooltip.tsx
@@ -205,7 +205,7 @@ export const TooltipContent = React.forwardRef<
<FloatingPortal>
<div
ref={ref}
- className={`z-50 max-w-64 rounded bg-light px-2 py-2 shadow text-xs border border-secondary-200
+ className={`max-w-64 rounded bg-light px-2 py-2 shadow text-xs border border-secondary-200
text-dark animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0
data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2
data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2${className ? ` ${className}` : ''}`}
diff --git a/libs/shared/lib/vis/components/VisualizationPanel.tsx b/libs/shared/lib/vis/components/VisualizationPanel.tsx
index b3aa4c103..65772caaa 100644
--- a/libs/shared/lib/vis/components/VisualizationPanel.tsx
+++ b/libs/shared/lib/vis/components/VisualizationPanel.tsx
@@ -81,10 +81,9 @@ export const VisualizationPanel = ({ fullSize }: { fullSize: () => void }) => {
return (
<div
- className="vis-panel h-full w-full flex flex-col border bg-light"
+ className="relative pt-7 vis-panel h-full w-full flex flex-col border bg-light"
onMouseDownCapture={() => dispatch(resultSetFocus({ focusType: 'visualization' }))}
>
- <VisualizationTabBar fullSize={fullSize} />
<div className="grow overflow-y-auto" style={graphQueryResult.nodes.length === 0 ? { overflow: 'hidden' } : {}}>
{graphQueryResult.queryingBackend ? (
<Querying />
@@ -116,6 +115,7 @@ export const VisualizationPanel = ({ fullSize }: { fullSize: () => void }) => {
</div>
)}
</div>
+ <VisualizationTabBar fullSize={fullSize} />
</div>
);
};
diff --git a/libs/shared/lib/vis/components/VisualizationTabBar.tsx b/libs/shared/lib/vis/components/VisualizationTabBar.tsx
index 8ff06c7a4..96b68a034 100644
--- a/libs/shared/lib/vis/components/VisualizationTabBar.tsx
+++ b/libs/shared/lib/vis/components/VisualizationTabBar.tsx
@@ -36,7 +36,7 @@ export default function VisualizationTabBar(props: { fullSize: () => void }) {
};
return (
- <div className="sticky shrink-0 top-0 flex items-stretch justify-between h-7 bg-secondary-100 border-b border-secondary-200 max-w-full">
+ <div className="absolute shrink-0 top-0 left-0 right-0 flex items-stretch justify-between h-7 bg-secondary-100 border-b border-secondary-200 max-w-full">
<div className="flex items-center">
<h1 className="text-xs font-semibold text-secondary-600 px-2 truncate">Visualization</h1>
</div>
--
GitLab