From 9082152f1a63cb9c0b451de74b83d34f060ad68d Mon Sep 17 00:00:00 2001
From: liyasthomas <liyascthomas@gmail.com>
Date: Sun, 12 Sep 2021 02:08:37 +0530
Subject: [PATCH] fix: editor width

---
 assets/scss/styles.scss               | 20 +++++++++++++-------
 components/graphql/RequestOptions.vue |  4 +---
 components/http/Headers.vue           |  4 +---
 components/http/Parameters.vue        |  4 +---
 4 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/assets/scss/styles.scss b/assets/scss/styles.scss
index 5efd9ee22..bc9f98a97 100644
--- a/assets/scss/styles.scss
+++ b/assets/scss/styles.scss
@@ -463,23 +463,29 @@ input[type="checkbox"] {
 }
 
 .CodeMirror {
-  @apply block;
-  @apply w-full;
-  @apply !h-full;
+  @apply !h-auto;
 
   &:not(.CodeMirror-focused) .CodeMirror-activeline-background {
     background: transparent !important;
   }
 
+  .CodeMirror-dialog-top {
+    @apply bg-primaryLight;
+    @apply border-dividerLight;
+    @apply px-4;
+    @apply py-2;
+    @apply z-5;
+  }
+
+  .CodeMirror-scroll {
+    @apply min-h-64;
+  }
+
   * {
     font-family: "Roboto Mono", monospace;
   }
 }
 
-.CodeMirror-scroll {
-  @apply min-h-64;
-}
-
 @media (max-width: 767px) {
   main {
     margin-bottom: env(safe-area-inset-bottom);
diff --git a/components/graphql/RequestOptions.vue b/components/graphql/RequestOptions.vue
index 048dad9ec..cd17475be 100644
--- a/components/graphql/RequestOptions.vue
+++ b/components/graphql/RequestOptions.vue
@@ -146,9 +146,7 @@
               />
             </div>
           </div>
-          <div v-if="bulkMode" class="flex">
-            <div ref="bulkEditor"></div>
-          </div>
+          <div v-if="bulkMode" ref="bulkEditor"></div>
           <div v-else>
             <div
               v-for="(header, index) in headers"
diff --git a/components/http/Headers.vue b/components/http/Headers.vue
index 14d39646a..55ffce53d 100644
--- a/components/http/Headers.vue
+++ b/components/http/Headers.vue
@@ -47,9 +47,7 @@
         />
       </div>
     </div>
-    <div v-if="bulkMode" class="flex">
-      <div ref="bulkEditor"></div>
-    </div>
+    <div v-if="bulkMode" ref="bulkEditor"></div>
     <div v-else>
       <div
         v-for="(header, index) in headers$"
diff --git a/components/http/Parameters.vue b/components/http/Parameters.vue
index eb91835db..037f6c597 100644
--- a/components/http/Parameters.vue
+++ b/components/http/Parameters.vue
@@ -47,9 +47,7 @@
         />
       </div>
     </div>
-    <div v-if="bulkMode" class="flex">
-      <div ref="bulkEditor"></div>
-    </div>
+    <div v-if="bulkMode" ref="bulkEditor"></div>
     <div v-else>
       <div
         v-for="(param, index) in params$"