ScroolToTop icon button

components/carPageParts/carType_head.tsx

@@ -0,0 +1,10 @@
+"use client"
+
+import { useParams } from "next/navigation"
+
+export default function CarType_Header() {
+  const router = useParams();
+  return (
+    <div>Header</div>
+  )
+}

components/carPageParts/productCard.tsx

@@ -0,0 +1,25 @@
+"use client";
+
+import { ProductTypes } from "@/types";
+import Image from "next/image";
+import Link from "next/link";
+
+export default function ProductCard({data}:{data: ProductTypes}) {
+    return (
+    <Link href={`/${data.path}`} className="flex flex-col items-center justify-between rounded-sm hover:scale-105 hover:cursor-pointer hover:shadow-[0px_0px_5px_10px_#ebebeb]">
+      <div className="rounded-t-lg bg-white py-15 px-2" >
+        <Image
+          src={data.image}
+          alt={data.truck_name}
+          width={200}
+          height={200}
+          className="object-contain h-auto"
+        />
+      </div>
+      <div className="bg-[#fafafa] w-full py-5 rounded-b-lg flex flex-col items-center justify-center ">
+        <p>{data.truck_name}</p>
+        <p className="text-secondary">{data.desc}</p>
+      </div>
+    </Link>
+  );
+}