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
cgxxv · Apr 3, 2020 · eb2aa3d · eb2aa3d
1 parent 61aeeb0
commit eb2aa3d
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
@@ -645,15 +645,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`