working on the alignment of sets input and reps input

src/components/ExerciseList.vue

@@ -1,11 +1,10 @@
 <template>
     <input class="search " type="text" v-model="input" placeholder="Search..." />
+    <div class="flex">
     <div class="exerciseList">
       <ul class="exerciseItem" v-for="exercise in filterExercises()" :key="exercise.name">
         <Button class="btn bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4" :class="{'btn--primary': primary}">{{ exercise.name }}</Button>
       </ul>
-      <div class="weights">
-        <WeightsInput/>
     </div>
   </div>
 </template>

src/views/muscles/Chest.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="flex">
-    <div class="w-1/3">
+    <div class="w-1/2">
       <h1>Chest</h1>
        <ExerciseList muscle="Chest"/>
     </div>

src/views/weight/WeightsInput.vue

@@ -1,5 +1,5 @@
 <template>
-    <div class="w-2/3 mx-auto ml-5">
+    <div class="w-2/3 mx-auto">
       <div class="warmup-sets mt-12 w-2/3">
         <label>Warm-Up Sets</label>
         <button @click="warmUpAddSet()" class="add-btn bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded ml-5">Add</button>
@@ -8,20 +8,25 @@
           <input type="warmUpInput" name="warmupweight" class="mt-1 px-3 py-2 bg-black border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none focus:border-sky-500 focus:ring-sky-500 block rounded-md sm:text-sm focus:ring-1" placeholder="Weight in Kg" />
         </div>
       </div>
-      <div class="working-sets w-2/3 mt-5">
+
+      <div class="working-set mt-5">
         <label>Working Sets</label>
         <button @click="workingAddSet()" class="add-btn bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded ml-7">Add</button>
-        <div v-for="workingset in workingSets" class="item" :key="workingset">
-          {{ workingset }}  
+        
         <div>
+          <div v-for="workingset in workingSets" class="item flex justify-smart mt-3" :key="workingset">
+            {{ workingset }}  
+          <div class="ml-3">
             <input type="workingInput" name="workinweight" class="mt-1 px-3 py-2 bg-black border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none focus:border-sky-500 focus:ring-sky-500 block rounded-md sm:text-sm focus:ring-1" placeholder="Weight in Kg"/>
           </div>
-          <div>
-          <label class="">Reps</label>
+          <label>Reps</label>
+          <div class="ml-3">
             <input type="workingInput" name="workinweight" class="mt-1 px-3 py-2 bg-black border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none focus:border-sky-500 focus:ring-sky-500 block rounded-md sm:text-sm focus:ring-1" placeholder="Reps"/>
           </div>
         </div>  
       </div>
+      
+      </div>
     </div>
 </template>