upd

2023-12-05 18:24:45 +05:00
parent edcd51599c
commit f198ff9dfe
29 changed files with 632 additions and 559 deletions
@@ -1,6 +1,5 @@
 /* eslint-disable no-irregular-whitespace */
 import "./App.css";
-import LogoIcon from "./components/icons/LogoIcon";
 import BlendingHeader from "./components/blendings/BlendingHeader";
 import FeatureItem from "./components/FeatureItem";
 // import BlendVR from "./components/blendings/BlendVR";
@@ -23,6 +22,7 @@ import VideoSliderMobile from "./components/VideoSliderMobile";
 // import { isMobile } from "react-device-detect";
 import IProject from "./types/IProject";
 import api from "./utils/api";
+import ArrowRightIcon from "./components/icons/ArrowRightIcon";

 function App() {
  const [selectedVideo, setSelectedVideo] = useState<string>(
@@ -53,7 +53,16 @@ function App() {
      <div className="relative conatiner mx-auto 2xl:max-w-screen-2xl">
        <div className="flex justify-between py-6 2xl:mb-28 xl:mb-[88px] sm:mb-12 mb-14">
          <div>
-            <LogoIcon />
+            <img
+              src="/images/Logo.svg"
+              alt=""
+              className="sm:block hidden max-h-fit"
+            />
+            <img
+              src="/images/LogoMobile.svg"
+              alt=""
+              className="sm:hidden block"
+            />
          </div>
          <div className="flex sm:gap-8 gap-2">
            <Button>
@@ -104,10 +113,9 @@ function App() {

        <div className="flex flex-col 2xl:gap-16 xl:gap-10 gap-8 2xl:mb-40 sm:mb-[120px] mb-20">
          <div className="grid xl:grid-cols-4 xl:gap-0 sm:gap-6 gap-4">
-            <div className="col-span-3">
+            <div className="col-span-full">
              <Heading2>
-                Помогаем продавать
-                <br />
+                Помогаем продавать{" "}
                <span style={{ WebkitTextFillColor: "#fff" }}>
                  проще и{" "}
                  <span
@@ -120,12 +128,32 @@ function App() {
                </span>
              </Heading2>
            </div>
-            <p className="2xl:text-base text-sm">
-              Мы собрали статистику за 10 лет работы
-              <br />
-              с застройщиками, реализовав 31 проект
-            </p>
+            <div className="relative flex items-center gap-4 col-span-full h-[400px]">
+              <p className="2xl:text-2xl text-sm font-gilroy font-medium min-w-[496px] ">
+                Мы собрали статистику{" "}
+                <span className="text-gradient font-semibold">за 13 лет</span>{" "}
+                работы
+                <br />
+                с застройщиками,{" "}
+                <span className="text-gradient font-semibold">
+                  реализовав 31 проект
+                </span>
+              </p>
+
+              <div className="">
+                <img
+                  src="/images/Map.png"
+                  alt=""
+                  className="relative top-8 -z-10"
+                />
+              </div>
+            </div>
          </div>
+
+          <p className="text-gradient font-gilroy font-medium text-5xl w-fit">
+            Graff.estate
+          </p>
+
          <div className="grid xl:grid-cols-4 sm:grid-cols-2 grid-cols-1 xl:gap-0 gap-3">
            <div className="px-8 py-4 flex flex-col gap-4 border-l border-[#3D425C]">
              <p className="2xl:text-base text-sm">На</p>
@@ -296,7 +324,76 @@ function App() {
          <VideoSliderMobile />
        </div>

-        <div className="relative grid grid-cols-2 gap-4 2xl:mb-40 sm:mb-[120px] mb-20">
+        <div className="relative 2xl:mb-40 sm:mb-[120px] mb-20">
+          <div className="grid grid-cols-4 mb-16">
+            <Heading2 className="col-span-3">
+              Graff.estate stream —{" "}
+              <span style={{ WebkitTextFillColor: "#fff" }}>
+                удаленная демонстрация жилого комплекса
+              </span>
+            </Heading2>
+
+            <p>
+              Высокий уровень графики и полное
+              <br />
+              погружение покупателя в процесс
+              <br />
+              выбора квартиры
+            </p>
+          </div>
+
+          <div className="relative mb-[120px]">
+            <img src="/images/Stream.jpg" alt="" />
+
+            <div className="absolute bottom-10 left-10">
+              <p className="flex flex-col gap-4 text-2xl font-gilroy font-medium">
+                <span>
+                  Местоположение и устройство
+                  <br />
+                  значения не имеют
+                </span>
+                <span>Нужен только интернет</span>
+              </p>
+            </div>
+          </div>
+
+          <div className="flex justify-between mb-16">
+            <p className="text-5xl font-gilroy font-medium">
+              Демонстрация технологии
+            </p>
+            <Button icon={<ArrowRightIcon />}>Узнать больше</Button>
+          </div>
+
+          <div>
+            <StreamButton
+              icon="/icons/Revolution.svg"
+              title="МФК «Re:volution towers»"
+              location="Россия, Екатеринбург"
+              background="/images/stream/nks.jpg"
+              link="https://stream.graff.tech/?build=nksJukovaDev&location=a1"
+            />
+            <StreamButton
+              icon="/icons/Residence.svg"
+              title="ЖК «Life Резиденция»"
+              location="Россия, Тюмень"
+              background="/images/stream/liferes.jpg"
+              link="https://stream.graff.tech/?build=lifeResidence&location=a1"
+            />
+            <StreamButton
+              icon="/icons/Aivaz.svg"
+              title="ЖК «Айвазовский City»"
+              location="Россия, Тюмень"
+              background="/images/stream/aivaz.jpg"
+              link="https://stream.graff.tech/?build=Ivazowsky&location=a1"
+            />
+          </div>
+
+          <div className="absolute -bottom-[2%] -right-[30%] -z-10 blur-[18px]">
+            <BlendStream />
+          </div>
+        </div>
+
+        {/* <div className="relative grid grid-cols-2 gap-4 2xl:mb-40 sm:mb-[120px] mb-20">
          <div className="flex flex-col gap-8">
            <Heading2>
              Экскурсия
@@ -314,7 +411,7 @@ function App() {
            <Button className="sm:block hidden">Записаться в шоу-рум</Button>
          </div>
          <div className=""></div>
-        </div>
+        </div> */}

        <div className="grid grid-cols-2 gap-4 2xl:mb-40 sm:mb-[120px] mb-20">
          <div>
@@ -342,61 +439,6 @@ function App() {
          <img src="/images/Analysis.jpg" alt="" className="w-full" />
        </div>

-        <div className="relative grid grid-cols-4 gap-4 mb-16">
-          <div className="col-span-2 flex flex-col justify-between">
-            <Heading2>
-              Graff.estate stream —
-              <br />
-              <span style={{ WebkitTextFillColor: "#fff" }}>
-                удаленная демонстрация
-                <br />
-                жилого комплекса
-              </span>
-            </Heading2>
-            <Button>Узнать больше</Button>
-          </div>
-          <div className="flex flex-col gap-12">
-            <p>
-              Высокий уровень графики и полное погружение покупателя в процесс
-              выбора квартиры
-            </p>
-            <img src="/images/Stream.jpg" alt="" />
-          </div>
-          <div>
-            <p>
-              Местоположение и устройство значения не имеют. Нужен только
-              интернет
-            </p>
-          </div>
-          <div className="absolute top-[50%] -translate-y-[50%] left-0 -z-10 blur-[30px]">
-            <BlendStream />
-          </div>
-        </div>
-
-        <div className="2xl:mb-40 sm:mb-[120px] mb-20">
-          <StreamButton
-            icon="/icons/Revolution.svg"
-            title="МФК «Re:volution towers»"
-            location="Россия, Екатеринбург"
-            background="/images/stream/nks.jpg"
-            link="https://stream.graff.tech/?build=nksJukovaDev&location=a1"
-          />
-          <StreamButton
-            icon="/icons/Residence.svg"
-            title="ЖК «Life Резиденция»"
-            location="Россия, Тюмень"
-            background="/images/stream/liferes.jpg"
-            link="https://stream.graff.tech/?build=lifeResidence&location=a1"
-          />
-          <StreamButton
-            icon="/icons/Aivaz.svg"
-            title="ЖК «Айвазовский City»"
-            location="Россия, Тюмень"
-            background="/images/stream/aivaz.jpg"
-            link="https://stream.graff.tech/?build=Ivazowsky&location=a1"
-          />
-        </div>
-
        <div className="relative flex flex-col gap-16 2xl:mb-40 sm:mb-[120px] mb-20">
          <div className="flex flex-col gap-8">
            <Heading2>