From 45d1d9e727c8fbaf41868b6e28b85f86de5d4cee Mon Sep 17 00:00:00 2001
From: tusharsingla22222-source <tusharsingla22222@gmail.com>
Date: Mon, 9 Mar 2026 22:13:41 +0530
Subject: [PATCH 1/5] fix: improve select dropdown appearance with custom
 arrows

---
 components/GettingStarted.tsx | 62 ++++++++++++++++++++++++++++++++++-
 1 file changed, 61 insertions(+), 1 deletion(-)

diff --git a/components/GettingStarted.tsx b/components/GettingStarted.tsx
index 908cf5010..52eed9e41 100644
--- a/components/GettingStarted.tsx
+++ b/components/GettingStarted.tsx
@@ -139,6 +139,7 @@ const GettingStarted = () => {
     <>
       <div className='relative'>
         <div className='flex flex-col'>
+<<<<<<< HEAD
           <div className='flex items-end flex-row justify-between mt-5 mb-3 '>
             <h2 className='text-h6 font-semibold mb-1 text-slate-900 dark:text-white'>
               JSON Schema
@@ -159,6 +160,33 @@ const GettingStarted = () => {
                   </option>
                 ))}
               </select>
+=======
+          <div className='flex items-end flex-row justify-between mt-5 mb-3'>
+            <h2 className='text-h6 font-semibold mb-1 text-slate-900 dark:text-white'>
+              JSON Schema
+            </h2>
+            <div className='select-wrap flex items-center'>
+              <label className='mr-2 max-sm:text-[12px] text-slate-700 dark:text-slate-300'>
+                Select a Schema:
+              </label>
+              <div className='relative'>
+                <select
+                  name='Select a JSON Schema Validator'
+                  className='p-2 pr-8 border dark:border-slate-300 border-slate-300 dark:bg-slate-900 bg-white text-slate-800 dark:text-white rounded-md max-sm:text-[12px] appearance-none cursor-pointer'
+                  id='Examples'
+                  onChange={handleSchemaChange}
+                >
+                  {options.map((option: any, id: number) => (
+                    <option key={id} value={option.file}>
+                      {option.name}
+                    </option>
+                  ))}
+                </select>
+                <span className='pointer-events-none absolute right-2 top-1/2 -translate-y-1/2 text-slate-500 dark:text-slate-300 text-xl'>
+                  ▾
+                </span>
+              </div>
+>>>>>>> 3e02b34 (fix: improve select dropdown appearance with custom arrows)
             </div>
           </div>
 
@@ -203,6 +231,7 @@ const GettingStarted = () => {
         </div>
 
         <div className='flex flex-col'>
+<<<<<<< HEAD
           <div className='flex items-end flex-row justify-between mt-5 mb-3 '>
             <h2 className='text-h6 font-semibold mb-1 text-slate-900 dark:text-white'>
               JSON Instance
@@ -223,6 +252,33 @@ const GettingStarted = () => {
                   </option>
                 ))}
               </select>
+=======
+          <div className='flex items-end flex-row justify-between mt-5 mb-3'>
+            <h2 className='text-h6 font-semibold mb-1 text-slate-900 dark:text-white'>
+              JSON Instance
+            </h2>
+            <div className='select-wrap flex items-center'>
+              <label className='mr-2 max-sm:text-[12px] text-slate-700 dark:text-slate-300'>
+                Select an Instance:
+              </label>
+              <div className='relative'>
+                <select
+                  name='Select a JSON Schema Validator'
+                  className='p-2 pr-8 border dark:border-slate-300 border-slate-300 dark:bg-slate-900 bg-white text-slate-800 dark:text-white rounded-md max-sm:text-[12px] appearance-none cursor-pointer'
+                  id='Examples'
+                  onChange={handleInstanceChange}
+                >
+                  {instances.map((instance: any, id: number) => (
+                    <option key={id} value={instance.file}>
+                      {instance.name}
+                    </option>
+                  ))}
+                </select>
+                <span className='pointer-events-none absolute right-2 top-1/2 -translate-y-1/2 text-slate-500 dark:text-slate-300 text-xl'>
+                  ▾
+                </span>
+              </div>
+>>>>>>> 3e02b34 (fix: improve select dropdown appearance with custom arrows)
             </div>
           </div>
           <div className='overflow-x-auto flex-basis-0 max-w-full min-w-0 shrink lg:max-w-[800px] xl:max-w-[900px]'>
@@ -290,7 +346,11 @@ const GettingStarted = () => {
         </div>
 
         <button
+<<<<<<< HEAD
           className='absolute right-0 my-4 text-[17px] bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-md'
+=======
+          className='absolute right-4 my-4 text-[17px] bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-md'
+>>>>>>> 3e02b34 (fix: improve select dropdown appearance with custom arrows)
           onClick={createZip}
         >
           Download
@@ -300,4 +360,4 @@ const GettingStarted = () => {
   );
 };
 
-export default GettingStarted;
+export default GettingStarted;
\ No newline at end of file

From ea6aec1c3778c3044004e5d5417ed8cc1ccd80b7 Mon Sep 17 00:00:00 2001
From: tusharsingla22222-source <tusharsingla22222@gmail.com>
Date: Mon, 9 Mar 2026 22:33:37 +0530
Subject: [PATCH 2/5] fix: use unique IDs for schema and instance select
 elements

---
 components/GettingStarted.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/components/GettingStarted.tsx b/components/GettingStarted.tsx
index 52eed9e41..d3fe8a266 100644
--- a/components/GettingStarted.tsx
+++ b/components/GettingStarted.tsx
@@ -173,7 +173,7 @@ const GettingStarted = () => {
                 <select
                   name='Select a JSON Schema Validator'
                   className='p-2 pr-8 border dark:border-slate-300 border-slate-300 dark:bg-slate-900 bg-white text-slate-800 dark:text-white rounded-md max-sm:text-[12px] appearance-none cursor-pointer'
-                  id='Examples'
+                  id='schema-examples'
                   onChange={handleSchemaChange}
                 >
                   {options.map((option: any, id: number) => (
@@ -265,7 +265,7 @@ const GettingStarted = () => {
                 <select
                   name='Select a JSON Schema Validator'
                   className='p-2 pr-8 border dark:border-slate-300 border-slate-300 dark:bg-slate-900 bg-white text-slate-800 dark:text-white rounded-md max-sm:text-[12px] appearance-none cursor-pointer'
-                  id='Examples'
+                  id='instance-examples'
                   onChange={handleInstanceChange}
                 >
                   {instances.map((instance: any, id: number) => (

From 2384dbde88dc14b84081097446349dd906cb8aed Mon Sep 17 00:00:00 2001
From: tusharsingla22222-source <tusharsingla22222@gmail.com>
Date: Mon, 9 Mar 2026 22:34:56 +0530
Subject: [PATCH 3/5] fix: use unique IDs for schema and instance select
 elements

---
 components/GettingStarted.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/components/GettingStarted.tsx b/components/GettingStarted.tsx
index d3fe8a266..c489c3376 100644
--- a/components/GettingStarted.tsx
+++ b/components/GettingStarted.tsx
@@ -166,7 +166,7 @@ const GettingStarted = () => {
               JSON Schema
             </h2>
             <div className='select-wrap flex items-center'>
-              <label className='mr-2 max-sm:text-[12px] text-slate-700 dark:text-slate-300'>
+              <label className='mr-2 max-sm:text-[12px] text-slate-700 dark:text-slate-300' htmlFor='schema-examples'>
                 Select a Schema:
               </label>
               <div className='relative'>
@@ -258,7 +258,7 @@ const GettingStarted = () => {
               JSON Instance
             </h2>
             <div className='select-wrap flex items-center'>
-              <label className='mr-2 max-sm:text-[12px] text-slate-700 dark:text-slate-300'>
+              <label className='mr-2 max-sm:text-[12px] text-slate-700 dark:text-slate-300' htmlFor='instance-examples'>
                 Select an Instance:
               </label>
               <div className='relative'>

From 124cee904343b80329f7347523bc5277dae2acd3 Mon Sep 17 00:00:00 2001
From: tusharsingla22222-source <tusharsingla22222@gmail.com>
Date: Mon, 9 Mar 2026 22:54:53 +0530
Subject: [PATCH 4/5] fix: resolve conflicts and clean up duplicate code

---
 components/GettingStarted.tsx | 60 +++++------------------------------
 1 file changed, 8 insertions(+), 52 deletions(-)

diff --git a/components/GettingStarted.tsx b/components/GettingStarted.tsx
index c489c3376..823baab9a 100644
--- a/components/GettingStarted.tsx
+++ b/components/GettingStarted.tsx
@@ -139,34 +139,15 @@ const GettingStarted = () => {
     <>
       <div className='relative'>
         <div className='flex flex-col'>
-<<<<<<< HEAD
-          <div className='flex items-end flex-row justify-between mt-5 mb-3 '>
-            <h2 className='text-h6 font-semibold mb-1 text-slate-900 dark:text-white'>
-              JSON Schema
-            </h2>
-            <div className='select-wrap'>
-              <label className='mr-2 max-sm:text-[12px] text-slate-700 dark:text-slate-300'>
-                Select a Schema:
-              </label>
-              <select
-                name='Select a JSON Schema Validator'
-                className='p-2 border dark:border-slate-300 border-slate-300 dark:bg-slate-900 bg-white text-slate-800 dark:text-white rounded-md max-sm:text-[12px]'
-                id='Examples'
-                onChange={handleSchemaChange}
-              >
-                {options.map((option: any, id: number) => (
-                  <option key={id} value={option.file}>
-                    {option.name}
-                  </option>
-                ))}
-              </select>
-=======
           <div className='flex items-end flex-row justify-between mt-5 mb-3'>
             <h2 className='text-h6 font-semibold mb-1 text-slate-900 dark:text-white'>
               JSON Schema
             </h2>
             <div className='select-wrap flex items-center'>
-              <label className='mr-2 max-sm:text-[12px] text-slate-700 dark:text-slate-300' htmlFor='schema-examples'>
+              <label
+                htmlFor='schema-examples'
+                className='mr-2 max-sm:text-[12px] text-slate-700 dark:text-slate-300'
+              >
                 Select a Schema:
               </label>
               <div className='relative'>
@@ -186,7 +167,6 @@ const GettingStarted = () => {
                   ▾
                 </span>
               </div>
->>>>>>> 3e02b34 (fix: improve select dropdown appearance with custom arrows)
             </div>
           </div>
 
@@ -231,34 +211,15 @@ const GettingStarted = () => {
         </div>
 
         <div className='flex flex-col'>
-<<<<<<< HEAD
-          <div className='flex items-end flex-row justify-between mt-5 mb-3 '>
-            <h2 className='text-h6 font-semibold mb-1 text-slate-900 dark:text-white'>
-              JSON Instance
-            </h2>
-            <div className='select-wrap'>
-              <label className='mr-2 max-sm:text-[12px] text-slate-700 dark:text-slate-300'>
-                Select an Instance:
-              </label>
-              <select
-                name='Select a JSON Schema Validator'
-                className='p-2 border dark:border-slate-300 border-slate-300 dark:bg-slate-900 bg-white text-slate-800 dark:text-white rounded-md max-sm:text-[12px]'
-                id='Examples'
-                onChange={handleInstanceChange}
-              >
-                {instances.map((instance: any, id: number) => (
-                  <option key={id} value={instance.file}>
-                    {instance.name}
-                  </option>
-                ))}
-              </select>
-=======
           <div className='flex items-end flex-row justify-between mt-5 mb-3'>
             <h2 className='text-h6 font-semibold mb-1 text-slate-900 dark:text-white'>
               JSON Instance
             </h2>
             <div className='select-wrap flex items-center'>
-              <label className='mr-2 max-sm:text-[12px] text-slate-700 dark:text-slate-300' htmlFor='instance-examples'>
+              <label
+                htmlFor='instance-examples'
+                className='mr-2 max-sm:text-[12px] text-slate-700 dark:text-slate-300'
+              >
                 Select an Instance:
               </label>
               <div className='relative'>
@@ -278,7 +239,6 @@ const GettingStarted = () => {
                   ▾
                 </span>
               </div>
->>>>>>> 3e02b34 (fix: improve select dropdown appearance with custom arrows)
             </div>
           </div>
           <div className='overflow-x-auto flex-basis-0 max-w-full min-w-0 shrink lg:max-w-[800px] xl:max-w-[900px]'>
@@ -346,11 +306,7 @@ const GettingStarted = () => {
         </div>
 
         <button
-<<<<<<< HEAD
-          className='absolute right-0 my-4 text-[17px] bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-md'
-=======
           className='absolute right-4 my-4 text-[17px] bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-md'
->>>>>>> 3e02b34 (fix: improve select dropdown appearance with custom arrows)
           onClick={createZip}
         >
           Download

From ab7ffb9246a7cd015ba49b1e091da483b75c474a Mon Sep 17 00:00:00 2001
From: tusharsingla22222-source <tusharsingla22222@gmail.com>
Date: Mon, 9 Mar 2026 22:56:49 +0530
Subject: [PATCH 5/5] fix: apply prettier formatting

---
 components/GettingStarted.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/components/GettingStarted.tsx b/components/GettingStarted.tsx
index 823baab9a..6c16eca87 100644
--- a/components/GettingStarted.tsx
+++ b/components/GettingStarted.tsx
@@ -316,4 +316,4 @@ const GettingStarted = () => {
   );
 };
 
-export default GettingStarted;
\ No newline at end of file
+export default GettingStarted;