carType page over

components/cards/innerProductcard.tsx

@@ -0,0 +1,49 @@
+"use client"
+
+import { innerCardTypes } from "@/types";
+import Link from "next/link";
+import { useParams } from "next/navigation";
+import React from "react";
+import Image from "next/image";
+import Text from "../lib_components/text";
+import { useCarDetail } from "../lib_components/carDetailProvider";
+
+export default function InnerProductcard({ data }: { data: innerCardTypes }) {
+  const route = useParams();
+  const { setDetail } = useCarDetail();
+  return (
+    <Link
+      href={`/${route.lang}/${route.carType}/${data.name}`}
+      onClick={() => setDetail(data)}
+      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">
+        <Image
+          src={data.image}
+          alt={data.name}
+          width={0}
+          height={200}
+          className="object-fill w-full max-h-[200px] h-full rounded-t-sm"
+        />
+      </div>
+      <div className="bg-[#fafafa] w-full p-2 px-4 rounded-b-lg flex flex-col items-start justify-start gap-2">
+        <div className="text-xl font-semibold ">
+          <Text txt={data.name} />
+        </div>
+        <div className="flex gap-2">
+          <Text txt="hour-price" />
+          {data.price?.toLocaleString("uz-UZ")}
+          <Text txt="wallet" />
+        </div>
+        <div className="flex gap-2">
+          <Text txt="min-time" />
+          {data.min_order_time}
+          <Text txt="time" />
+        </div>
+        <button className="w-full p-3 bg-secondary rounded-lg text-white border-2 border-secondary hover:cursor-pointer hover:bg-white hover:text-secondary">
+          <Text txt="more" />
+        </button>
+      </div>
+    </Link>
+  );
+}