import PersianNumber from "plugins/PersianNumber";
import React from "react";

const PaginationCategoory = (props) => {
  return (
    <div className="flex justify-center rtl mb-10">
      <div className="w-[25px] h-[25px] rounded-full bg-primary-300 mx-2">
        <svg
          width="13"
          height="13"
          viewBox="0 0 88 151"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className="mx-auto mt-[6px] "
        >
          <path
            d="M12.9525 138.35L75.249 75.6471L12.5462 13.3506"
            stroke="white"
            stroke-width="25"
            stroke-linecap="round"
            stroke-linejoin="round"
          />
        </svg>
      </div>
      <div className="w-[25px] h-[25px] rounded-full bg-primary-200 mx-1">
        <p className="mb-0 text-center pt-[2px]">
          <PersianNumber number={1} style=" !text-[14px]  " />
        </p>
      </div>
      <div className="w-[25px] h-[25px] rounded-full bg-primary-200 mx-1">
        <p className="mb-0 text-center pt-[2px]">
          <PersianNumber number={2} style=" !text-[14px]  " />
        </p>
      </div>
      <div className="w-[25px] h-[25px] rounded-full bg-primary-200 mx-1">
        <p className="mb-0 text-center pt-[2px]">
          <PersianNumber number={3} style=" !text-[14px]  " />
        </p>
      </div>
      <div className="w-[25px] h-[25px] rounded-full bg-primary-200 mx-1">
        <p className="mb-0 text-center pt-[2px]">
          <PersianNumber number={4} style=" !text-[14px]  " />
        </p>
      </div>
      <div className="w-[25px] h-[25px] rounded-full bg-primary-800 mx-1">
        <p className="mb-0 text-center pt-[2px]">
          <PersianNumber number={5} style=" !text-[14px] text-white " />
        </p>
      </div>
      <div className="w-[25px] h-[25px] rounded-full bg-primary-300 mx-2">
        <svg
          width="13"
          height="13"
          viewBox="0 0 88 151"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
          className="mx-auto mt-[6px] rotate-180 "
        >
          <path
            d="M12.9525 138.35L75.249 75.6471L12.5462 13.3506"
            stroke="white"
            stroke-width="25"
            stroke-linecap="round"
            stroke-linejoin="round"
          />
        </svg>
      </div>
    </div>
  );
};

export default PaginationCategoory;
