Initial commit

src/components/InfoButton/InfoButton.tsx

@@ -0,0 +1,50 @@
+import { Card } from "antd";
+import BackIcon from "components/Icons/BackIcon";
+import NextIcon from "components/Icons/NextIcon";
+import { useAppSelector } from "redux/hooks";
+import ProTitle from "../ProTitle";
+import styles from "./InfoButton.module.css";
+
+export const InfoButton = ({
+  icon,
+  title,
+  onInfoClick,
+}: {
+  icon: React.ReactNode;
+  title: string;
+  onInfoClick: () => void;
+}) => {
+  const { isRTL } = useAppSelector((state) => state.locale);
+  return (
+    <Card className={styles.homeServiceCard} onClick={onInfoClick}>
+      <div
+        style={{
+          display: "flex",
+          flexDirection: "row",
+          justifyContent: "space-between",
+          marginTop: 1,
+        }}
+      >
+        <div style={{ display: "flex", flexDirection: "row", gap: 10 }}>
+          {icon}
+          <ProTitle
+            level={5}
+            style={{
+              marginTop: -2,
+              fontSize: "1rem",
+              color: "rgba(95, 108, 123, 1)",
+            }}
+          >
+            {title}
+          </ProTitle>
+        </div>
+
+        {isRTL ? (
+          <BackIcon className={styles.infoIcon} />
+        ) : (
+          <NextIcon className={styles.infoIcon} />
+        )}
+      </div>
+    </Card>
+  );
+};