fix(devtools): styles

artalar · Jun 20, 2024 · e0b9cf8 · e0b9cf8
1 parent 3c73f8f
commit e0b9cf8
Showing 1 changed file with 14 additions and 2 deletions.
diff --git a/packages/devtools/src/index.tsx b/packages/devtools/src/index.tsx
@@ -157,17 +157,28 @@ export const connectDevtools = async (
     </button>
   )
 
-  const observableContainer = <div />
+  const observableContainer = (
+    <div
+      css={`
+        width: 100%;
+        height: 100%;
+        overflow: auto;
+      `}
+    />
+  )
 
   const containerEl = (
     <div
       css={`
         position: fixed;
         bottom: 0;
         right: 0;
+        padding-top: 2em;
         width: var(--width);
         height: var(--height);
         z-index: ${MAX_Z};
+        background: hsl(244deg 20% 90%);
+        overflow: auto;
       `}
       css:width={width}
       css:height={height}
@@ -184,7 +195,8 @@ export const connectDevtools = async (
       {observablehqStyles.replaceAll(':root', '.observablehq')}
       {`
         .observablehq {
-          margin: 2rem;
+          margin: 1rem;
+          margin-top: 0em;
         }
 
         .observablehq--inspect {