fix: editor width

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);

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"

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$"

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$"