import React from "react";
import "./about.style.scss";

import { useTranslation } from "react-i18next";

import Rocket from "../../assets/images/main/about-us/rocket.png";

const About = () => {
  const { t } = useTranslation();

  return (
    <div className="about-us container">
      <div>
        <img src={Rocket} alt="" />
      </div>
      <div>
        <h5>{t("about_us.sub_title")}</h5>
        <p className="text">{t("about_us.text")}</p>

        <div className="stats">
          <div>
            <h4>{t("about_us.amount_completed")}</h4>
            <p>{t("about_us.completed")}</p>
          </div>
          <div>
            <h4>{t("about_us.amount_webpages")}</h4>
            <p>{t("about_us.webpages")}</p>
          </div>
          <div>
            <h4>{t("about_us.amount_experience")}</h4>
            <p>{t("about_us.experience")}</p>
          </div>
        </div>
      </div>
    </div>
  );
};

export default About;
