create single page of courses

components/home-page/courses-section/Categories.vue

@@ -53,7 +53,7 @@
       </svg>
 
       <input
-        class="w-[100%] md:w-[45vw] h-[10.769vw] md:h-[3.333vw] text-[2.836vw] md:text-[0.741vw] text-[#878787] rounded-[2.564vw] md:rounded-[0.781vw] ps-[12vw] md:ps-[3vw] md:ms-[1.563vw] shadow-sm"
+        class="thin w-[100%] md:w-[45vw] h-[10.769vw] md:h-[3.333vw] text-[2.836vw] md:text-[0.741vw] text-[#878787] rounded-[2.564vw] md:rounded-[0.781vw] ps-[12vw] md:ps-[3vw] md:ms-[1.563vw] shadow-sm"
         type="text"
         placeholder="نام آموزش ، دوره و ... را وارد کنید"
       />
@@ -120,12 +120,12 @@ const breakpoints = {
     snapAlign: "end",
   },
   700: {
-    itemsToShow: 7.3,
+    itemsToShow: 8.6,
     snapAlign: "end",
   },
   // 1024 and up
   1024: {
-    itemsToShow: 8.3,
+    itemsToShow: 8.6,
     snapAlign: "end",
   },
 };

components/home-page/courses-section/WatchCoursesButton.vue

@@ -1,6 +1,6 @@
 <template>
     <div
-      class="flex text-[#383E43] font-semibold py-[4vw] md:py-[1.1vw] md:pt-[1.9vw] text-[3.59vw] md:text-[0.938vw] justify-center mt-[2vw] md:mt-[0.417vw]"
+      class="flex text-[#383E43] py-[4vw] md:py-[1.1vw] md:pt-[1.9vw] text-[3.59vw] md:text-[0.938vw] justify-center mt-[2vw] md:mt-[0.417vw]"
   >
     <nuxt-link to="/courses"
       class="flex justify-center items-center border-b-2 border-[#878787] w-[45.59vw] md:w-[13.542vw]"