vacancy

src/components/VacancyItem/VacancyItem.jsx

@@ -0,0 +1,46 @@
+import React from "react";
+
+import { Link } from "react-router-dom";
+import titleImg from "assets/images/VacancyItemImg.svg";
+
+import "./vacancyItem.scss";
+
+export const VacancyItem= ({ vacancy: { name, description, level, price, location, count } }) => {
+  return (
+    <div className="vacancy__item">
+      <div className="vacancy__item__head">
+        <div className="vacancy__item__title">
+          <span className="vacancy__item__img">
+          <img src={titleImg} alt="img" />
+          </span>
+          <h4>{name}</h4>
+        </div>
+        <p className="vacancy__item__description">{description}</p>
+      </div>
+      <div className="vacancy__item__block">
+        <div className="vacancy__item__block--left">
+          <div className="vacancy__item__info">
+            <span>Грейд:</span>
+            <p>{level}</p>
+          </div>
+          <div className="vacancy__item__info">
+            <span>Ставка:</span>
+            <p>{price}</p>
+          </div>
+          <Link to={"/profile/open-requests/12"} className="vacancy__item__more">Все требования по вакансии</Link>
+        </div>
+        <div className="vacancy__item__block--right">
+          <div className="vacancy__item__info">
+            <span>Локация:</span>
+            <p>{location}</p>
+          </div>
+          <div className="vacancy__item__info">
+            <span>Кол-во человек:</span>
+            <p>{count}</p>
+          </div>
+        </div>
+      </div>
+      <button className="vacancy__item__btn">Откликнуться</button>
+    </div>
+  );
+};