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

added popup with tg link

Browse Source
This commit is contained in:
Lanskikh
2025-04-02 18:57:43 +05:00
parent fa4809a537
commit ba23078579
4 changed files with 75 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/(main)/prime/page.tsx
+10 -8
View File
@@ -1,11 +1,13 @@
import { PrimeDesktopPage } from '@/components/pages/PrimePage/PrimePage';
import PrimePageMobile from '@/components/pages/PrimePageMobile/PrimePageMobile';
import { InProcess } from '@/components/pages/InProcess';
// import { PrimeDesktopPage } from '@/components/pages/PrimePage/PrimePage';
// import PrimePageMobile from '@/components/pages/PrimePageMobile/PrimePageMobile';
export default function PrimePage() {
return (
<div className="relative">
<PrimePageMobile />
<PrimeDesktopPage />
</div>
);
// return (
// <div className="relative">
// <PrimePageMobile />
// <PrimeDesktopPage />
// </div>
// );
return <InProcess />;
}
src/app/layout.tsx
+2
View File
@@ -4,6 +4,7 @@ import Script from 'next/script';
import './globals.css';
import { QueryProvider } from '@/lib/QueryProvider';
import { LenisProvider } from '@/lib/LenisProvider';
import PopupModal from '@/components/modals/PopupModal';
export const metadata: Metadata = {
title: 'Интерактивные решения для застройщиков',
@@ -46,6 +47,7 @@ export default function RootLayout({
<body className="min-h-screen flex flex-col justify-between">
<QueryProvider>
<LenisProvider>
<PopupModal />
{children}
<ModalContainer />
</LenisProvider>
src/components/Layout/Header.tsx
+1 -1
View File
@@ -85,7 +85,7 @@ export function Header() {
{((isLg && scroll < -logoRef.current?.clientHeight!) || !isLg) && (
<Link
href={'/'}
className="aspect-square lg:p-[0.833vw] p-3 hover:bg-[#232425] group active:bg-white lg:rounded-[1.111vw] rounded-2xl content-center m-auto"
className="aspect-square lg:p-[1.111vw] p-3 hover:bg-[#232425] group active:bg-white lg:rounded-[1.111vw] rounded-2xl content-center m-auto"
>
<GraffIcon className="text-white group-active:text-black lg:w-[1.111vw] md:max-lg:w-[2.083vw] w-4 lg:h-[1.111vw] md:max-lg:h-[2.083vw] h-4" />
</Link>
src/components/modals/PopupModal.tsx
+62
View File
@@ -0,0 +1,62 @@
'use client';
/* eslint-disable react-hooks/exhaustive-deps */
import CloseIcon from '../../../public/icons/close.svg';
import TelegramIcon from '../../../public/icons/tg.svg';
import { useEffect } from 'react';
import { motion } from 'framer-motion';
import Link from 'next/link';
import { usePopupStore } from '@/stores/usePopupStore';
function Popup() {
const { isShowPopup, setIsShowPopup } = usePopupStore();
function handlePopupClick() {
setIsShowPopup(false);
}
useEffect(() => {
if (usePopupStore.getState().isShowPopup === undefined) {
const timeout = setTimeout(() => {
setIsShowPopup(true);
}, 10000);
return () => clearTimeout(timeout);
}
}, []);
return (
<>
{isShowPopup && (
<motion.div
animate={{ y: -40 }}
transition={{ type: 'spring' }}
className="fixed bottom-0 sm:left-10 left-1/2 max-md:-translate-x-1/2 z-30 w-[320px] lg:w-[22.222vw] p-px lg:p-[0.069vw] rounded-2xl bg-gradient"
>
<div className="bg-[#14161F] rounded-2xl p-4 flex flex-col gap-y-5 lg:gap-y-10">
<p className="btns font-medium leading-[15.4px]">
Новости разработки интерактивных решений для девелоперов в нашем
телеграм канале
</p>
<Link
href={'https://t.me/graffestate'}
target="_blank"
onClick={handlePopupClick}
className="flex items-center gap-x-1 w-full justify-center font-semibold btns bg-gradient rounded-full py-2 hover:opacity-80 transition-opacity"
>
<TelegramIcon className="lg:w-[1.667vw] lg:h-[1.667vw] w-4 h-4" />
Перейти
</Link>
<button
className="absolute top-2 right-2 hover:bg-white rounded-full flex p-px hover:bg-opacity-10 group transition-colors"
onClick={handlePopupClick}
>
<CloseIcon className="lg:w-[1.111vw] lg:h-[1.111vw] w-4 h-4 m-auto group-hover:text-black transition-colors" />
</button>
</div>
</motion.div>
)}
</>
);
}
export default Popup;