Fix the debug panel overflow (#653)

2023-09-20 05:36:29 -04:00
parent e34501cc5a
commit 111738f38e
1 changed files with 5 additions and 1 deletions
--- a/src/components/DebugPanel.tsx
+++ b/src/components/DebugPanel.tsx
@ -30,7 +30,11 @@ export const DebugPanel = ({ className, ...props }: CollapsiblePanelProps) => {
  return (
    <CollapsiblePanel
      {...props}
-      className={'!absolute !h-auto bottom-5 right-5 ' + className}
+      className={
+        '!absolute overflow-hidden !h-auto bottom-5 right-5 ' + className
+      }
+      // header height, top-5, and bottom-5
+      style={{ maxHeight: 'calc(100% - 3rem - 1.25rem - 1.25rem)' }}
    >
      <section className="p-4 flex flex-col gap-4">
        <Xyz