Files
nobat724_front/components/booking/failedPay/index.js
T

44 lines
2.1 KiB
JavaScript

import Link from "next/link";
import { Button } from "@mui/material";
import RedoA from "@/components/icons/RedoA";
import RefreshA from "@/components/icons/RefreshA";
import InfoCircleRedA from "@/components/icons/InfoCircleRedA";
function FailedPay({ setStep, fadeElement }) {
return (
<div className='w-full lg:w-[59%]'>
<div
className={`opacity-page bg-transparent lg:bg-[#FFF] border border-solid border-transparent lg:border-[#EFEFEF]
rounded-[8px] p-[12px] sm:p-[16px] md:p-[20px] lg:p-[24px]`}
>
<div className="mt-[7px]">
<div className="flex flex-col justify-center items-center gap-[14px]">
<InfoCircleRedA />
<p className="text-[#D32F2F] text-[16px] md:text-[18px] lg:text-[20px] font-bold">پرداخت شما انجام نشد.</p>
</div>
<div className="flex mt-[32px] sm:mt-[29px] md:mt-[27px] lg:mt-[24px] items-center justify-center gap-[24px]">
<Link href='/'>
<Button
variant="outlined"
className="!flex !rounded-[8px] !items-center !p-2 !justify-center !gap-[4px]"
>
<RedoA />
<p className="text-[#5559CE] text-[16px] font-medium">صفحه اصلی</p>
</Button>
</Link>
<Button
variant="contained"
onClick={() => setStep(prev => prev - 2)}
className="!flex !rounded-[8px] !items-center !p-2 !justify-center !gap-[4px]"
>
<RefreshA />
<p className="text-[#FAFAFA] text-[16px] font-medium">تلاش دوباره</p>
</Button>
</div>
</div>
</div>
</div>
)
}
export default FailedPay