feat: add PaymentGood component

src/pages/payment/payment-good/index.tsx

@@ -0,0 +1,34 @@
+import { Link } from 'react-router-dom';
+import Payment from '..';
+import OrderStatusTracker from '@components/order-status-tracker';
+import { useAuth } from '@hooks/use-auth';
+import successIcon from '@images/circle-ok-min.svg';
+import styles from './payment-good.module.scss';
+
+const PaymentGood = () => {
+	const { isLoggedIn } = useAuth();
+	const text = 'Пока вы ждёте заказ, можете ознакомиться с рецептами из нашего блога';
+
+	return (
+		<Payment adviceText={text}>
+			<section className={styles.container}>
+				<img className={styles.image} src={successIcon}></img>
+				<h1 className={styles.title}>Успешно!</h1>
+				{isLoggedIn ? (
+					<p className={styles.info}>
+						Ваш платеж принят в обработку. Отслеживать его вы можете в
+						<Link to={'/profile'}> личном кабинете</Link>
+					</p>
+				) : (
+					<p className={styles.info}>
+						Ваш платеж принят в обработку. История заказов доступна для зарегистрированных
+						пользователей.
+					</p>
+				)}
+				<OrderStatusTracker />
+			</section>
+		</Payment>
+	);
+};
+
+export default PaymentGood;

src/pages/payment/payment-good/payment-good.module.scss

@@ -0,0 +1,52 @@
+@use '@scss/variables' as *;
+
+.image {
+	width: 66px;
+	height: 66px;
+}
+
+.container {
+	padding: 108px 128px 100px;
+	max-width: 1024px;
+	flex-grow: 1;
+	display: flex;
+	flex-direction: column;
+	justify-content: center;
+	align-items: center;
+	font-family: $ubuntu-font;
+
+	@media screen and (width <= 768px) {
+		padding: 40px 20px;
+	}
+}
+
+.title {
+	color: $active-text-color;
+	font-size: 36px;
+	font-style: normal;
+	font-weight: 700;
+	line-height: 140%;
+	text-align: center;
+	padding-top: 12px;
+
+	@media screen and (width <= 768px) {
+		font-size: 24px;
+	}
+}
+
+.info {
+	color: $active-text-color;
+	text-align: center;
+	font-size: 20px;
+	font-style: normal;
+	font-weight: 400;
+	line-height: 140%;
+	margin: 0;
+	padding: 20px 0 40px;
+	max-width: 450px;
+
+	@media screen and (width <= 768px) {
+		font-size: 14px;
+		max-width: 225px;
+	}
+}