mikhail_lanskikh/graff.estate-nextjs-updated
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Pravki ot 13.11;

Browse Source
This commit is contained in:
C4rnivore
2025-11-17 12:22:44 +05:00
parent 84a18f7dd9
commit c8ee2f7a8c
15 changed files with 157 additions and 370 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/img/pages/about/team/designers.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 93 KiB

After

Width:  |  Height:  |  Size: 192 KiB

public/img/pages/web/experience/options.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 75 KiB

After

Width:  |  Height:  |  Size: 75 KiB

public/img/pages/web/experience/options_tablet.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 64 KiB

After

Width:  |  Height:  |  Size: 65 KiB

src/app/(main)/year-results/layout.tsx
+18
View File
@@ -0,0 +1,18 @@
import { Metadata, ResolvingMetadata } from "next";
export async function generateMetadata(
{},
_: ResolvingMetadata
): Promise<Metadata> {
return {
title: "Итоги 2025 года",
};
}
export default function YearResultsLayout({
children,
}: {
children: React.ReactNode;
}) {
return <section>{children}</section>;
}
src/app/(main)/year-results/page.tsx
+6
View File
@@ -0,0 +1,6 @@
import { InProcess } from "@/components/pages/InProcess";
export default function YearResults() {
return <InProcess />;
// return <AboutMain />;
}
src/components/pages/AboutPage/AboutAchievementsCard.tsx
-129
View File
@@ -1,129 +0,0 @@
/* eslint-disable @next/next/no-img-element */
import { useMediaQueries } from "@/hooks/useMediaQueries";
import { motion } from "framer-motion";
import React, { useRef, useEffect, useState } from "react";
export default function AboutAchievementsCard({
img,
title,
className,
imageClassName,
labelClassName,
video,
}: {
img?: string;
title: string;
className?: string;
imageClassName?: string;
labelClassName?: string;
video?: string;
}) {
const cardRef = useRef<HTMLDivElement>(null);
const videoRef = useRef<HTMLDivElement>(null);
const [mousePosition, setMousePosition] = useState({ x: 0, y: 0 });
const [cardTransform, setCardTransform] = useState({ x: 0, y: 0 });
const { isLg } = useMediaQueries();
// useEffect(() => {
// const handleMouseMove = (e: MouseEvent) => {
// setMousePosition({ x: e.clientX, y: e.clientY });
// };
// window.addEventListener("mousemove", handleMouseMove);
// return () => window.removeEventListener("mousemove", handleMouseMove);
// }, []);
//
// useEffect(() => {
// if ((!video && !cardRef.current) || !isLg) return;
// if ((video && videoRef.current) || !isLg) return;
// const card = video ? videoRef.current : cardRef.current;
// const rect = card!.getBoundingClientRect();
// const cardCenterX = rect.left + rect.width / 2;
// const cardCenterY = rect.top + rect.height / 2;
// const deltaX = mousePosition.x - cardCenterX;
// const deltaY = mousePosition.y - cardCenterY;
// const distance = Math.hypot(deltaX, deltaY);
// const maxDistance = 1000;
// const maxOffset = 20;
// if (distance < maxDistance) {
// const strength = 1 - distance / maxDistance;
// const offsetX = (deltaX / distance) * strength * maxOffset;
// const offsetY = (deltaY / distance) * strength * maxOffset;
// setCardTransform({
// x: isNaN(offsetX) ? 0 : offsetX,
// y: isNaN(offsetY) ? 0 : offsetY,
// });
// } else {
// setCardTransform({ x: 0, y: 0 });
// }
// }, [isLg, mousePosition, video]);
return video ? (
<motion.div
ref={videoRef}
animate={
isLg
? {
x: cardTransform.x,
y: cardTransform.y,
}
: {}
}
transition={{
type: "spring",
stiffness: 550,
damping: 15,
mass: 0.1,
}}
className={
"aspect-[223/240] rounded-[16px] bg-[radial-gradient(circle,rgba(0,0,0,1)_-70%,rgba(34,36,37,1)_100%);] flex flex-col items-center justify-between p-[1.111vw] max-lg:flex max-lg:top-0 md:max-lg:p-[2.083vw] max-md:p-[4.444vw] top-[8.333vw] left-0 relative w-full max-md:aspect-[165/240]"
}
>
<div className="flex w-[12.361vw] h-[12.361vw] overflow-hidden rounded-full aspect-square md:max-lg:w-[17.448vw] md:max-lg:h-[17.448vw] max-lg:my-auto max-md:w-[37.222vw] max-md:h-[37.222vw]">
<video
src={video}
muted
loop
autoPlay
playsInline
className="scale-[1.9]"
/>
</div>
<p className="z-10 text-center btns md:max-lg:text-[1.563vw] max-md:text-[3.333vw] max-md:w-[110%]">
{title}
</p>
</motion.div>
) : (
<motion.div
ref={cardRef}
className={
"w-[15.486vw] aspect-[223/240] group rounded-[16px] bg-[radial-gradient(circle,rgba(0,0,0,1)_-70%,rgba(34,36,37,1)_100%);] flex flex-col items-center justify-between p-[1.111vw] absolute overflow-hidden md:max-lg:p-[2.083vw] max-md:p-[4.444vw] " +
className
}
>
<img
src={img}
className={
"z-10 w-[9.444vw] md:max-lg:w-[20.833vw] max-md:w-[36.944vw] my-auto group-hover:scale-110 transition-all duration-300 " +
imageClassName
}
alt={title}
/>
<p
className={
"z-10 text-center btns md:max-lg:text-[1.563vw] max-md:text-[3.333vw] " +
labelClassName
}
>
{title}
</p>
</motion.div>
);
}
src/components/pages/AboutPage/AboutExperience.tsx
+95 -108
View File
@@ -1,28 +1,43 @@
/* eslint-disable @next/next/no-img-element */
"use client";
import React from "react";
import AboutEventCard from "./AboutEventCard";
import EventLogo1 from "../../../../public/img/pages/about/experience/EventLogo1.png";
import EventLogo2 from "../../../../public/img/pages/about/experience/EventLogo2.png";
import { ArticleCard } from "../BlogPage/ArticleCard";
import { useSearchParams } from "next/navigation";
import { useGetArticlesQuery } from "@/queries/getArticles";
import { motion } from "framer-motion";
import DisplacementCard from "../../displacement/DisplacementCard";
import DisplacementCardsWrapper from "../../displacement/DisplacementCardsWrapper";
import { useGetProjectsCountQuery } from "@/queries/getProjectsCount";
import { getProjectsCount } from "@/utils/getProjectsCount";
import { OpenFormModalWrapper } from "@/hocs/OpenFormModalWrapper";
import AddIcon from "@/components/icons/AddIcon";
import { GradientButton } from "@/ui/GradientButton";
import EventFormModal from "@/components/modals/EventFormModal";
import { motion } from "framer-motion";
import { useSearchParams } from "next/navigation";
import React from "react";
import DisplacementCard from "../../displacement/DisplacementCard";
import DisplacementCardsWrapper from "../../displacement/DisplacementCardsWrapper";
import { ArticleCard } from "../BlogPage/ArticleCard";
import AboutEvents from "./AboutEvents";
function YearsLabel({
years,
className,
}: {
years: number[];
className?: string;
}) {
return (
<div
className={`absolute lg:left-[1.111vw] md:left-[2.083vw] left-[4.444vw] w-full flex items-center justify-start xl:gap-[0.278vw] md:gap-[0.521vw] gap-[2.222vw] ${className}`}
>
{years.map((year) => (
<div
key={year}
className="lg:px-[0.556vw] lg:py-[0.278vw] md:px-[1.042vw] md:py-[0.521vw] px-[2.222vw] py-[1.111vw] lg:text-[1.302vw] md:text-[1.563vw] text-[2.778vw] rounded-full bg-[#37393B99] border-[1px] border-[#FFFFFF1A] caption"
>
{year}
</div>
))}
</div>
);
}
export default function AboutExperience() {
const searchParams = useSearchParams();
const { data: articles } = useGetArticlesQuery(searchParams.getAll("tags"));
const { data: projectsCount } = useGetProjectsCountQuery();
return (
@@ -177,41 +192,6 @@ export default function AboutExperience() {
</div>
<AboutEvents />
{/* <div className="flex justify-between max-lg:flex-col md:max-lg:gap-[4.167vw] max-md:gap-[8.889vw]">
<div className="w-[23.611vw] space-y-[0.833vw]">
<p className="headline1 text-[#7A7A7A] max-lg:w-full">
<span className="headline1 text-white">
Ближайшие мероприятия, <br />
</span>
где каждый девелопер может лично протестировать{" "}
<br className="md:max-lg:block hidden" />
и оценить функционал наших интерактивных макетов недвижимости
</p>
<OpenFormModalWrapper modal={<EventFormModal action="create" />}>
<GradientButton>
<div className="text-white lg:size-[1.944vw] size-7">
<AddIcon />
</div>
</GradientButton>
</OpenFormModalWrapper>
</div>
<div className="flex justify-between gap-x-3 max-md:flex-col max-md:gap-[3.333vw]">
<AboutEventCard
logo={EventLogo1}
place={"Москва, GOELRO"}
date={"10 сентября – 12 сентября"}
color={"#FF3A94"}
/>
<AboutEventCard
logo={EventLogo2}
place={"Екатеринбург, ЭКСПО"}
date={"30 сентября – 3 октября"}
color={"#3F58FF"}
/>
</div>
</div> */}
</div>
</div>
@@ -231,74 +211,36 @@ export default function AboutExperience() {
</p>
<DisplacementCardsWrapper>
<DisplacementCard index={0} className="lg:top-0 lg:left-[16.389vw]">
<DisplacementCard
index={0}
className={"lg:top-[8.333vw] lg:left-0 !aspect-[223/260] "}
>
<YearsLabel years={[2024, 2025]} />
<img
src={"/img/pages/about/experience/cards/table.png"}
className="lg:w-[9.444vw] lg:h-[9.444vw] md:w-[17.708vw] md:h-[17.708vw] w-[25.556vw] h-[25.556vw] my-auto object-cover hover:scale-[1.15] transition-all duration-300"
alt="Наш продукт зарегистрирован и включен в реестр отечественного ПО"
src={"/img/pages/about/experience/cards/wow.png"}
className="lg:w-[8.333vw] md:w-[19.625vw] w-[33.333vw] aspect-square lg:mt-auto mt-auto object-cover hover:scale-[1.15] transition-all duration-300"
alt="Заняли 1 место на WOW AWARDS 2024 совместно с застройщиком Upside Development"
/>
<p className="z-10 text-center btns md:max-lg:text-[1.563vw] max-md:text-[3.333vw]">
Наш продукт зарегистрирован{" "}
<br className="min-md:hidden block" />
и включен в реестр <br className="nidden md:max-lg:block" />
отечественного ПО
<p className="z-10 text-center btns md:max-lg:text-[1.563vw] max-md:text-[3.333vw] md:w-[90%] max-md:w-[110%] !leading-[135%] ">
Дважды помогли нашим партнерам занять 1 место на WOW AWARDS
</p>
</DisplacementCard>
<DisplacementCard
index={1}
className={
"lg:top-[8.333vw] lg:left-0 md:max-lg:!translate-y-[3.125vw] !aspect-[223/260]"
}
className="lg:top-0 lg:left-[16.389vw] md:max-lg:!translate-y-[3.125vw]"
>
<YearsLabel years={[2024, 2025]} className="lg:hidden" />
<img
src={"/img/pages/about/experience/cards/wow.png"}
className="lg:w-[9.444vw] lg:h-[9.444vw] md:w-[17.708vw] md:h-[17.708vw] w-[33.333vw] h-[33.333vw] my-auto object-cover hover:scale-[1.15] transition-all duration-300"
alt="Заняли 1 место на WOW AWARDS 2024 совместно с застройщиком Upside Development"
src={"/img/pages/about/experience/cards/table.png"}
className="lg:w-[9.444vw] lg:h-[9.444vw] md:w-[17.708vw] md:h-[17.708vw] w-[25.556vw] h-[25.556vw] lg:my-auto md:mt-auto md:mb-0 my-auto object-cover hover:scale-[1.15] transition-all duration-300 max-md:translate-y-[20%]"
alt="Наш продукт зарегистрирован и включен в реестр отечественного ПО"
/>
<p className="z-10 text-center btns !leading-[120%]">
Мы дважды заняли 1 место на WOW AWARDS в 2024 и 2025 году
совместно с застройщиками Upside Development и LEGENDA
</p>
</DisplacementCard>
<DisplacementCard
index={2}
className="lg:bottom-0 lg:right-[16.389vw]"
>
<img
src={"/img/pages/about/experience/cards/sk.png"}
className="lg:w-[9.444vw] lg:h-[9.444vw] md:w-[25.708vw] md:h-[25.708vw] w-[45.556vw] h-[45.556vw] my-auto object-cover hover:scale-[1.15] transition-all duration-300"
alt="Мы резиденты Сколково"
/>
<p className="z-10 text-center btns md:max-lg:text-[1.563vw] max-md:text-[3.333vw]">
Мы - резиденты Сколково
</p>
</DisplacementCard>
<DisplacementCard index={3} className="lg:top-0 lg:right-[8.194vw]">
<img
src={"/img/pages/about/experience/cards/map.png"}
className="lg:w-[9.444vw] lg:h-[9.444vw] md:w-[20.708vw] md:h-[20.708vw] w-[35.556vw] h-[35.556vw] my-auto object-cover hover:scale-[1.35] scale-[1.25] transition-all duration-300"
alt="Наши интерактивные столы стоят уже в 16 городах России"
/>
<p className="z-10 text-center btns md:max-lg:text-[1.563vw] max-md:text-[3.333vw]">
Наши интерактивные столы стоят уже в 16 городах России
</p>
</DisplacementCard>
<DisplacementCard
index={4}
className="lg:bottom-[7.708vw] lg:right-0 md:max-lg:!translate-y-[3.125vw]"
>
<img
src={"/img/pages/about/experience/cards/dp.png"}
className="lg:w-[9.444vw] lg:h-[9.444vw] md:w-[17.708vw] md:h-[17.708vw] w-[25.556vw] h-[25.556vw] my-auto object-cover hover:scale-[1.15] transition-all duration-300 "
alt="Каждый наш проект, получил одну или несколько наград на платформе Dprofile"
/>
<p className="z-10 text-center btns md:max-lg:text-[1.563vw] max-md:text-[3.333vw]">
Каждый наш проект получил одну или несколько наград на платформе
Dprofile
<p className="z-10 w-[105%] text-center btns md:max-lg:text-[1.563vw] max-md:text-[3.333vw] !leading-[135%]">
Наш продукт зарегистрирован{" "}
<br className="min-md:hidden block" />
и включен в реестр <br className="hidden md:max-lg:block" />
отечественного ПО
</p>
</DisplacementCard>
@@ -306,15 +248,60 @@ export default function AboutExperience() {
index={5}
className="lg:bottom-0 lg:left-[8.194vw] "
>
<YearsLabel years={[2024, 2025]} className="lg:hidden" />
<img
src={"/img/pages/about/experience/cards/sk.png"}
className="lg:w-[9.444vw] lg:h-[9.444vw] md:w-[25.708vw] md:h-[25.708vw] w-[45.556vw] h-[45.556vw] lg:my-auto mt-auto object-cover hover:scale-[1.15] transition-all duration-300"
alt="Мы резиденты Сколково"
/>
<p className="z-10 text-center btns md:max-lg:text-[1.563vw] max-md:text-[3.333vw] ">
Мы - резиденты Сколково
</p>
</DisplacementCard>
<DisplacementCard
index={2}
className="lg:bottom-0 lg:right-[16.389vw] "
>
<YearsLabel years={[2024, 2025]} className="lg:hidden" />
<img
src={"/img/pages/about/experience/cards/build_up.png"}
className="lg:w-[9.444vw] lg:h-[9.444vw] md:w-[17.708vw] md:h-[17.708vw] w-[25.556vw] h-[25.556vw] my-auto object-cover hover:scale-[1.15] transition-all duration-300"
alt="В 2023 году мы выиграли Build UP в категории IT"
/>
<p className="z-10 text-center btns md:max-lg:text-[1.563vw] max-md:text-[3.333vw]">
<p className="z-10 text-center btns md:max-lg:text-[1.563vw] max-md:text-[3.333vw] !leading-[135%]">
В 2023 году мы выиграли Build UP в категории IT
</p>
</DisplacementCard>
<DisplacementCard
index={4}
className="lg:bottom-[7.708vw] lg:right-0 md:max-lg:!translate-y-[3.125vw]"
>
<YearsLabel years={[2024, 2025]} className="lg:hidden" />
<img
src={"/img/pages/about/experience/cards/dp.png"}
className="lg:w-[9.444vw] lg:h-[9.444vw] md:w-[17.708vw] md:h-[17.708vw] w-[25.556vw] h-[25.556vw] lg:my-auto mt-auto object-cover hover:scale-[1.15] transition-all duration-300 "
alt="Каждый наш проект, получил одну или несколько наград на платформе Dprofile"
/>
<p className="z-10 text-center btns md:max-lg:text-[1.563vw] max-md:text-[3.333vw] !leading-[135%]">
Каждый наш проект получил одну или несколько наград на платформе
Dprofile
</p>
</DisplacementCard>
<DisplacementCard index={3} className="lg:top-0 lg:right-[8.194vw]">
<YearsLabel years={[2024, 2025]} className="lg:hidden" />
<img
src={"/img/pages/about/experience/cards/map.png"}
className="lg:w-[9.444vw] lg:h-[9.444vw] md:w-[20.708vw] md:h-[20.708vw] w-[35.556vw] h-[35.556vw] lg:my-auto mt-auto object-cover hover:scale-[1.35] scale-[1.25] transition-all duration-300"
alt="Наши интерактивные столы помогают продавать уже в 16 городах России"
/>
<p className="z-10 text-center btns md:max-lg:text-[1.563vw] max-md:text-[3.333vw] !leading-[135%] max-md:w-[110%]">
Наши интерактивные столы помогают продавать уже в 16 городах
России
</p>
</DisplacementCard>
</DisplacementCardsWrapper>
</div>
</div>
src/components/pages/AboutPage/AboutHero.tsx
+1 -1
View File
@@ -11,7 +11,7 @@ export function AboutHero() {
muted
src="/videos/pages/about/hero_video.mp4"
poster="/img/pages/about/reel_template.png"
className="absolute inset-0 object-cover w-full lg:h-dvh rounded-b-[1.111vw] z-[10] top-0 max-lg:relative md:max-lg:aspect-[736/441] max-md:aspect-[340/512] max-md:rounded-b-[4.444vw]"
className="absolute inset-0 object-cover w-full lg:h-dvh rounded-b-[1.111vw] z-[10] top-0 max-lg:relative md:max-lg:aspect-[736/441] max-md:aspect-[340/512] max-md:rounded-b-[4.444vw] opacity-80"
/>
<div className="bg-[#00000033] absolute inset-0 max-lg:hidden h-dvh z-[11]" />
<div className="relative z-[11] pt-[16.25vw] max-lg:pt-0 bg-clip-text">
src/components/pages/AboutPage/AboutTeam.tsx
+7 -7
View File
@@ -47,7 +47,7 @@ export default function AboutTeam() {
Мы объединили уже
<span className="text-transparent bg-clip-text">
{" "}
более 60 высококвалифицирова
более 70 высококвалифицирова
<br className="max-md:block hidden" />
ных специалистов <br className="md:max-lg:hidden" />
</span>{" "}
@@ -128,7 +128,7 @@ export default function AboutTeam() {
<div className="mt-auto space-y-[1.667vw] max-md:space-y-[3.333vw]">
<span className="line1 md:max-lg:text-[12.5vw]">3</span>
<h3 className="headline2">
3 проджект-менеджера <br /> руководят и улучшают проекты
проджект-менеджера <br /> руководят и улучшают проекты
</h3>
<div className="lg:absolute bottom-0 right-0 w-full h-full max-lg:hidden">
<img
@@ -186,7 +186,7 @@ export default function AboutTeam() {
50+
</span>
<h3 className="headline2">
сотрудников в отделе <br /> 3D-моделирования, сколько{" "}
сотрудников в отделе <br /> 3D-моделирования — сколько{" "}
<br className="max-md:block hidden" />{" "}
<br className="md:max-lg:block hidden" /> точно,{" "}
<br className="max-lg:hidden" /> никто не считал
@@ -209,15 +209,15 @@ export default function AboutTeam() {
md:max-lg:w-[59.375vw] md:max-lg:rounded-[2.083vw] md:max-lg:p-[4.167vw] max-md:rounded-[4.444vw] max-md:w-full max-md:h-[74.444vw] max-md:relative max-md:p-[4.444vw]"
>
<div className="mt-auto space-y-[0.833vw] max-md:space-y-[3.333vw] max-md:w-full">
<span className="line1 md:max-lg:text-[12.5vw]">5</span>
<h3 className="headline2">
сотрудников <br /> в отделе дизайна
<span className="line1 md:max-lg:text-[12.5vw]">4</span>
<h3 className="headline2 md:max-lg:w-[110%]">
сотрудников в отделе дизайна и маркетинга
</h3>
</div>
<img
src={"/img/pages/about/team/designers.png"}
alt=""
className="h-full max-md:h-[56.111vw] max-md:absolute max-md:top-[4.444vw] max-md:right-[4.444vw]"
className="h-full max-md:h-[46.389vw] max-md:absolute max-md:top-[4.444vw] max-md:right-[4.444vw]"
/>
</div>
<img
src/components/pages/AboutPage/AchievementsCardsMobile.tsx
-106
View File
@@ -1,106 +0,0 @@
import dynamic from "next/dynamic";
import React from "react";
const AboutAchievementsCard = dynamic(() => import("./AboutAchievementsCard"), {
ssr: false,
});
export default function AchievementsCardsMobile({
web = false,
}: {
web?: boolean;
}) {
return (
<div className="hidden max-lg:grid md:max-lg:grid-cols-3 md:max-lg:grid-rows-2 max-lg:w-full md:max-lg:gap-3 max-md:grid max-md:grid-cols-2 max-md:gap-[2.222vw]">
{!web ? (
<AboutAchievementsCard
img={"/img/pages/about/experience/cards/wow.png"}
title="Мы заняли 1 место на WOW AWARDS 2024 совместно с застройщиком Upside Development"
className="relative w-full max-md:aspect-[165/240]"
/>
) : (
<AboutAchievementsCard
video={"/videos/pages/web/demo/IRTH_animation.mp4"}
title={"Машины ездят по основным магистралям"}
/>
)}
<AboutAchievementsCard
img={
web
? "/img/pages/web/demo/people.png"
: "/img/pages/about/experience/cards/table.png"
}
title={
web
? "Люди гуляют в окрестностях ЖК"
: "Наш продукт зарегистрирован и включен в реестр отечественного ПО"
}
className="relative w-full md:max-lg:translate-y-[3.125vw] max-md:aspect-[165/240]"
/>
<AboutAchievementsCard
img={
web
? "/img/pages/web/demo/clouds.png"
: "/img/pages/about/experience/cards/sk.png"
}
title={
web
? "Облака движутся в нужом направлении, как в реальном времени на вашей локации"
: "Мы резиденты Сколково"
}
className="relative w-full max-md:aspect-[165/240]"
imageClassName={web ? "absolute top-0 left-0 !w-full" : ""}
labelClassName={web ? "max-lg:mt-auto" : ""}
/>
<AboutAchievementsCard
img={
web
? "/img/pages/web/demo/building.png"
: "/img/pages/about/experience/cards/build_up.png"
}
title={
web
? "Осмотрите фасады со всех сторон"
: "В 2023 году мы выиграли Build UP в категории IT"
}
className="relative w-full max-md:aspect-[165/240]"
imageClassName={
web
? "h-[21.354vw] w-auto max-md:h-[40.556vw] max-md:w-[45.222vw] "
: ""
}
/>
<AboutAchievementsCard
img={
web
? "/img/pages/web/demo/infrastructure.png"
: "/img/pages/about/experience/cards/dp.png"
}
title={
web
? "Изучите инфраструктуру"
: "Каждый наш проект, получил одну или несколько наград на платформе Dprofile"
}
className="relative w-full md:max-lg:translate-y-[3.125vw] max-md:aspect-[165/240]"
// imageClassName={web ? "w-full h-auto" : ""}
/>
{!web ? (
<AboutAchievementsCard
img={"/img/pages/about/experience/cards/map.png"}
title={"Наши интерактивные столы стоят уже в 16 городах России"}
className="relative w-full max-md:aspect-[165/240]"
/>
) : (
<AboutAchievementsCard
video={"/videos/pages/web/demo/IRTH_animation.mp4"}
title={"Наши интерактивные столы стоят уже в 16 городах России"}
/>
)}
</div>
);
}
src/components/pages/WebPage/PageComponents/Accordeon/Accordeon.tsx
+15 -3
View File
@@ -128,7 +128,9 @@ export default function Accordeon({
{opened && (
<motion.ul
ref={listRef}
className="flex flex-col lg:mt-[1.667vw] lg:gap-[0.556vw] md:max-lg:mt-[3.125vw] max-md:mt-[6.667vw] md:max-lg:gap-[1.042vw] max-md:gap-[2.222vw]"
className={
"flex flex-col lg:mt-[1.667vw] lg:gap-[0.556vw] md:max-lg:mt-[3.125vw] max-md:mt-[6.667vw] md:max-lg:gap-[1.042vw] max-md:gap-[2.222vw] "
}
>
{content.map((item, index) => (
<motion.li
@@ -164,11 +166,21 @@ export default function Accordeon({
<span
style={{
width: isFaqPage ? "80%" : "auto",
display: isFaqPage ? "inline-block" : "inline",
opacity: isFaqPage ? 0.6 : 1,
}}
className={isFaqPage ? "text1" : "text2"}
className={isFaqPage ? "text1" : "text2 flex items-start"}
>
{!isFaqPage && (
<div
className="rounded-full bg-white flex-shrink-0"
style={{
width: "6px",
height: "6px",
marginTop: "calc(0.5em - 1px)",
marginRight: "8px",
}}
></div>
)}
{item.content}
</span>
</motion.li>
src/components/pages/WebPage/PageComponents/WebInfiniteSlider/ContentSlideCards.tsx
+2 -2
View File
@@ -66,7 +66,7 @@ export default function ContentSlideCards({
className="lg:w-[13.403vw] md:w-[18.229vw] w-[38.889vw] flex flex-col lg:gap-[0.694vw] gap-2 lg:p-[1.389vw] p-4 bg-[#37393B99] backdrop-blur-[5px] rounded-[1.111vw] absolute lg:left-[5.25vw] lg:bottom-[2.625vw] left-0 bottom-0
max-md:bottom-[15vw] max-md:left-[5vw] max-md:rounded-[4.444vw] md:max-lg:p-[2.083vw] md:max-lg:left-[2.083vw] md:max-lg:bottom-[10vw]"
>
<span className="headline2 z-[3]">Для соцсетей:</span>
<span className="headline2 z-[3]">Для соцсетей</span>
<p className="text2 text-[#FFFFFF60]">
Любой формат видео и изображений с идеально выставленным кадром
</p>
@@ -80,7 +80,7 @@ export default function ContentSlideCards({
className="lg:w-[13.403vw] md:w-[18.229vw] w-[41vw] flex flex-col lg:gap-[0.694vw] gap-2 lg:p-[1.389vw] p-4 bg-[#37393B99] backdrop-blur-[5px] rounded-[1.111vw] absolute lg:right-[5.25vw] lg:top-[2.625vw] right-0 top-0
max-md:top-[15vw] max-md:right-[5vw] max-md:rounded-[4.444vw] md:max-lg:p-[2.083vw] md:max-lg:right-[2.083vw] md:max-lg:top-[10vw]"
>
<span className="headline2">Для наружной рекламы:</span>
<span className="headline2">Для наружной рекламы</span>
<p className="text2 text-[#FFFFFF60]">
Высокое разрешение для широкоформатной печати
</p>
src/components/pages/WebPage/PageComponents/WebInfiniteSlider/ContentSlideHall.tsx
+2 -2
View File
@@ -80,7 +80,7 @@ export default function ContentSlideHall({
className="lg:w-[13.403vw] md:w-[18.229vw] w-[38.889vw] flex flex-col lg:gap-[0.694vw] gap-2 lg:p-[1.389vw] p-4 bg-[#37393B99] backdrop-blur-[5px] lg:rounded-[1.111vw] rounded-2xl absolute lg:left-[5.25vw] lg:bottom-[2.625vw] left-0 bottom-0
max-md:bottom-[15vw] max-md:left-[5vw] md:max-lg:p-[2.083vw] md:max-lg:left-[2.083vw] md:max-lg:bottom-[10vw]"
>
<span className="headline2 z-[3]">По двору:</span>
<span className="headline2 z-[3]">По двору</span>
<p className="text2 text-[#FFFFFF60] ">
Клиенты ощутят ритм жизни жилого комплекса и его атмосферу
</p>
@@ -93,7 +93,7 @@ export default function ContentSlideHall({
className="lg:w-[13.403vw] md:w-[18.229vw] w-[38.889vw] flex flex-col lg:gap-[0.694vw] gap-2 lg:p-[1.389vw] p-4 bg-[#37393B99] backdrop-blur-[5px] lg:rounded-[1.111vw] rounded-2xl absolute lg:right-[5.25vw] lg:top-[2.625vw] right-0 top-0
max-md:top-[15vw] max-md:right-[5vw] md:max-lg:p-[2.083vw] md:max-lg:right-[2.083vw] md:max-lg:top-[10vw]"
>
<span className="headline2">По квартире:</span>
<span className="headline2">По квартире</span>
<p className="text2 text-[#FFFFFF60] ">
Клиенты оценят пространство в объеме и ощутят себя «внутри»
</p>
src/components/pages/WebPage/WebDemo.tsx
+5 -5
View File
@@ -125,7 +125,7 @@ export default function WebDemo() {
/>
</div>
<p className="z-10 text-center btns md:max-lg:text-[1.563vw] max-md:text-[3.333vw]">
<p className="z-10 text-center btns md:max-lg:text-[1.563vw] max-md:text-[3.333vw] !leading-[135%]">
Машины ездят по основным магистралям
</p>
</DisplacementCard>
@@ -159,7 +159,7 @@ export default function WebDemo() {
</div>
<p
className={
"z-10 text-center btns md:max-lg:text-[1.563vw] max-md:text-[3.333vw] mt-auto"
"z-10 text-center btns md:max-lg:text-[1.563vw] max-md:text-[3.333vw] mt-auto !leading-[135%]"
}
>
Облака движутся в нужном направлении, как в реальном времени
@@ -179,7 +179,7 @@ export default function WebDemo() {
/>
</div>
<p className="z-10 text-center btns md:max-lg:text-[1.563vw] max-md:text-[3.333vw]">
<p className="z-10 text-center btns md:max-lg:text-[1.563vw] max-md:text-[3.333vw] !leading-[135%]">
Фасады можно изучить со всех сторон
</p>
</DisplacementCard>
@@ -197,7 +197,7 @@ export default function WebDemo() {
/>
<p
className={
"z-10 text-center btns md:max-lg:text-[1.563vw] max-md:text-[3.333vw]"
"z-10 text-center btns md:max-lg:text-[1.563vw] max-md:text-[3.333vw] !leading-[135%]"
}
>
Вся инфраструктура будет отмечена на карте ближайшего окружения
@@ -219,7 +219,7 @@ export default function WebDemo() {
/>
</div>
<p className="z-10 text-center btns md:max-lg:text-[1.563vw] max-md:text-[3.333vw]">
<p className="z-10 text-center btns md:max-lg:text-[1.563vw] max-md:text-[3.333vw] !leading-[135%]">
Прогулка по квартирам доступна при помощи тапов
</p>
</DisplacementCard>
src/components/pages/WebPage/data/TimeLineData.ts
+6 -7
View File
@@ -60,15 +60,15 @@ export const WebTimelineData: { [key: string]: IAccordeonContent[] } = {
"3D-моделирование": [
{
type: "general",
content: "Разрабатываем wireframe - блочные схемы без дизайна",
content: "Создание и подготовка 3D-моделей: окружение, материалы, освещение",
},
{
type: "new",
content: "Создаем первичный UI-кит: стили, цвета, шрифты и кнопки",
content: "Визуализация: рендеринг 360-сфер",
},
{
type: "general",
content: "Отрисовываем дизайн-макеты ключевых блоков",
content: "Интеграция и техническая подготовка: подготовка ассетов для движка, создание низкополигональных версий (LODs)",
},
],
@@ -90,7 +90,6 @@ export const WebTimelineData: { [key: string]: IAccordeonContent[] } = {
content: "Наполняем страницы контентом",
},
],
"Сборка сцен": [
{
type: "general",
@@ -103,14 +102,14 @@ export const WebTimelineData: { [key: string]: IAccordeonContent[] } = {
"Готовим тестовые интерактивные 360° панорамы и экспортируем в веб-формат",
},
],
Рендеринг: [
"Рендеринг": [
{
type: "general",
content: "Готовим финальные версии всех интерактивных 360° панорам ",
},
{
type: "general",
content: "Экспортируем готовые панорамы в на сайт",
content: "Экспортируем готовые панорамы на сайт",
},
],
"Верстка сайта": [
@@ -128,7 +127,7 @@ export const WebTimelineData: { [key: string]: IAccordeonContent[] } = {
"Адаптируем страницы под мобильные устройства: жесты, touch-управление",
},
],
Оптимизация: [
"Оптимизация": [
{
type: "general",
content: "Тестируем готовый сайт на разных устройствах.",