RC-7-home-page (#5)

https://ru.yougile.com/team/a605078664af/#chat:2ae00178ba0d
Reviewed-on: #5

src/app/main/home/components/AboutUs.js

@@ -0,0 +1,37 @@
+import { memo } from 'react';
+import { withTranslation } from 'react-i18next';
+import { Link } from 'react-router-dom';
+
+function AboutUs({ t }) {
+  return (
+    <section id="about-us" className="flex flex-col items-center pt-72 mb-80">
+      <h2 className="self-start mb-56 text-[48px] font-semibold">{t('about_us_title')}</h2>
+      <div className="flex gap-64 mb-[126px]">
+        <div className="flex items-center">
+          <iframe
+            className="rounded-[20px]"
+            width="715"
+            height="402"
+            src="https://www.youtube.com/embed/rNSIwjmynYQ?controls=0"
+            title="YouTube video player"
+            allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+            allowFullScreen
+          />
+        </div>
+        <aside className="flex flex-col items-center py-40 px-52 bg-primary-light rounded-[20px]">
+          <h3 className="mb-16 text-lg text-common-layout font-medium">{t('about_us_subject')}</h3>
+          <p className="mb-16 text-lg text-common-layout font-light">{t('about_us_text_1')}</p>
+          <p className="mb-16 text-lg text-common-layout font-light">{t('about_us_text_2')}</p>
+        </aside>
+      </div>
+      <Link
+        className="w-[220px] py-[17px] text-center text-base text-primary-light font-semibold tracking-widest uppercase rounded-2xl bg-secondary-light shadow hover:shadow-hover hover:shadow-secondary-light ease-in-out duration-300"
+        to="/rent-and-buy"
+      >
+        {t('research_btn')}
+      </Link>
+    </section>
+  );
+}
+
+export default withTranslation('homePage')(memo(AboutUs));