nshop-front-pc/src/components/cart/OpenCart.tsx

import { ShoppingCartIcon } from "@heroicons/react/24/outline";
import clsx from "clsx";

export default function OpenCart({
  className,
  quantity,
}: {
  className?: string;
  quantity?: number | string;
}) {
  return (
    <div className="relative flex  items-center justify-center rounded-md w-6 h-6 border-0 lg:border border-solid border-neutral-200 dark:border-neutral-700 lg:h-11 lg:w-11">
      <ShoppingCartIcon className={clsx("h-5 w-5", className)} />
{/* -mr-2  */}
      {quantity ? (
        <div className="absolute right-0 bottom-0 margin-t lg:-mt-2 w-3 h-3  rounded-full bg-[#FF4500FF]  text-[11px] text-center leading-3 font-medium text-white">
          {quantity}
        </div>
      ) : null}
    </div>
  );
}