fix: Allow scroll in result panel (graphql#1023)

* Limit the height of the result panel to the max size * Pin scrollbar position in the subscription result pane
apollographql · May 11, 2021 · 8d09e5d · 8d09e5d
1 parent 6dd73db
commit 8d09e5d
Showing 1 changed file with 3 additions and 0 deletions.
diff --git a/packages/graphql-playground-react/src/components/Playground/GraphQLEditor.tsx b/packages/graphql-playground-react/src/components/Playground/GraphQLEditor.tsx
@@ -690,15 +690,18 @@ const EditorBar = styled.div`
   display: flex;
   flex-direction: row;
   flex: 1;
+  height: 100%;
 `
 
 const ResultWrap = styled.div`
   display: flex;
   flex-direction: column;
   flex: 1;
+  height: 100%;
   position: relative;
   border-left: none;
   background: ${p => p.theme.editorColours.resultBackground};
+  overflow-anchor: auto;
 `
 
 const DragBar = styled.div`