fix: placeholder styles

packages/hoppscotch-app/components/http/Headers.vue

@@ -49,6 +49,15 @@
           :spellcheck="false"
           :value="header.key"
           autofocus
+          styles="
+            bg-transparent
+            flex
+            flex-1
+            py-1
+            px-4
+            truncate
+          "
+          class="flex-1 !flex"
           @input="
             updateHeader(index, {
               key: $event,

packages/hoppscotch-app/components/smart/EnvInput.vue

@@ -28,7 +28,7 @@ import {
 } from "@codemirror/view"
 import { EditorState, Extension } from "@codemirror/state"
 import clone from "lodash/clone"
-import { baseTheme } from "~/helpers/editor/themes/baseTheme"
+import { inputTheme } from "~/helpers/editor/themes/baseTheme"
 import { HoppEnvironmentPlugin } from "~/helpers/editor/extensions/HoppEnvironment"
 import { useStreamSubscriber } from "~/helpers/utils/composables"
 
@@ -88,7 +88,7 @@ const envTooltipPlugin = new HoppEnvironmentPlugin(subscribeToStream, view)
 
 const initView = (el: any) => {
   const extensions: Extension = [
-    baseTheme,
+    inputTheme,
     envTooltipPlugin,
     placeholderExt(props.placeholder),
     ViewPlugin.fromClass(
@@ -158,6 +158,5 @@ watch(editor, () => {
 .env-input {
   @apply flex;
   @apply flex-1;
-  @apply px-2;
 }
 </style>