feat: use monospace input for json and sql inputs

src/components/FormatTransformer.vue

@@ -45,6 +45,7 @@ const output = computed(() => transformer.value(input.value));
     multiline
     test-id="input"
     :validation-rules="inputValidationRules"
+    monospace
   />
 
   <div>

src/tools/json-diff/json-diff.vue

@@ -29,6 +29,7 @@ const jsonValidationRules = [
     multiline
     test-id="leftJson"
     raw-text
+    monospace
   />
 
   <c-input-text
@@ -40,6 +41,7 @@ const jsonValidationRules = [
     multiline
     test-id="rightJson"
     raw-text
+    monospace
   />
 
   <DiffsViewer :left-json="leftJson" :right-json="rightJson" />

src/tools/sql-prettify/sql-prettify.vue

@@ -64,16 +64,17 @@ const prettySQL = computed(() => formatSQL(rawSQL.value, config));
   </div>
 
   <n-form-item label="Your SQL query">
-    <n-input
+    <c-input-text
       ref="inputElement"
       v-model:value="rawSQL"
       placeholder="Put your SQL query here..."
-      type="textarea"
       rows="20"
+      multiline
       autocomplete="off"
       autocorrect="off"
       autocapitalize="off"
       spellcheck="false"
+      monospace
     />
   </n-form-item>
   <n-form-item label="Prettify version of your query">