create sliders with vue3-carousel package

components/home-page/road-map-components/Banner.vue

@@ -1,14 +1,14 @@
-<template>
-    <div class="baner flex flex-col w-[84.61vw] lg:w-[70.41%] mt-[50vw] lg:mt-[20vw]">
-        <img src="/public/images/baner.jpg" alt="organic" class="h-[45.12vw] lg:h-[26.302vw] w-full object-cover rounded-[25px]">
-    <div class="flex flex-col flex-col-reverse px-[1vw] lg:flex-row justify-between items-center mt-12">
-        <p class="mt-[17vw] lg:mt-0 w-full lg:w-[50%] text-[3.59vw] lg:text-[1.502vw]">
-            لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است
-        </p>
-        <p class="w-full lg:w-[40%] text-[4.544vw] lg:text-[1.186vw]">
-            لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است
-        </p>
-  
-    </div>
-    </div>
+<template>
+    <div class="baner flex flex-col w-[84.61vw] lg:w-[70.41%] mt-[50vw] lg:mt-[20vw]">
+        <img src="/public/images/baner.jpg" alt="organic" class="h-[45.12vw] lg:h-[26.302vw] w-full object-cover rounded-[25px]">
+    <div class="flex flex-col flex-col-reverse px-[1vw] lg:flex-row justify-between items-center mt-12">
+        <p class="mt-[17vw] lg:mt-0 w-full lg:w-[50%] text-[3.59vw] lg:text-[1.502vw]">
+            لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است
+        </p>
+        <p class="w-full lg:w-[40%] text-[4.544vw] lg:text-[1.186vw]">
+            لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است
+        </p>
+  
+    </div>
+    </div>
 </template>