From a22090e3dfd64410396b24dacfbefa2a3842a446 Mon Sep 17 00:00:00 2001
From: Liyas Thomas <liyascthomas@gmail.com>
Date: Tue, 19 Nov 2019 20:13:46 +0530
Subject: [PATCH] :zap: Added scroll for overflowing Docs section

---
 pages/graphql.vue | 18 +++++++++++++++---
 1 file changed, 15 insertions(+), 3 deletions(-)

diff --git a/pages/graphql.vue b/pages/graphql.vue
index 9bddaa744..2f39cda97 100644
--- a/pages/graphql.vue
+++ b/pages/graphql.vue
@@ -6,7 +6,12 @@
           <ul>
             <li>
               <label for="url">URL</label>
-              <input id="url" type="url" v-model="url" @keyup.enter="getSchema()" />
+              <input
+                id="url"
+                type="url"
+                v-model="url"
+                @keyup.enter="getSchema()"
+              />
             </li>
             <li>
               <label for="get" class="hide-on-small-screen">&nbsp;</label>
@@ -43,7 +48,9 @@
               name="side"
               checked="checked"
             />
-            <label v-if="queryFields.length > 0" for="queries-tab">Queries</label>
+            <label v-if="queryFields.length > 0" for="queries-tab"
+              >Queries</label
+            >
             <div v-if="queryFields.length > 0" class="tab">
               <div v-for="field in queryFields" :key="field.name">
                 <gql-field :gqlField="field" />
@@ -102,7 +109,12 @@
   </div>
 </template>
 
-<style></style>
+<style scoped lang="scss">
+.tab {
+  max-height: calc(100vh - 172px);
+  overflow: auto;
+}
+</style>
 
 <script>
 import axios from "axios";