From 30d486a03d87746f21fd20cddee777a1a58ec588 Mon Sep 17 00:00:00 2001
From: Lanskikh <lanskikh-mikhail@mail.ru>
Date: Fri, 19 Dec 2025 18:16:33 +0500
Subject: [PATCH] map city point by click

---
 .../pages/MainPage/Map/CityPoint.tsx          | 20 ++++++++-----------
 1 file changed, 8 insertions(+), 12 deletions(-)

diff --git a/src/components/pages/MainPage/Map/CityPoint.tsx b/src/components/pages/MainPage/Map/CityPoint.tsx
index f0be5c0b..b1ea5dd8 100644
--- a/src/components/pages/MainPage/Map/CityPoint.tsx
+++ b/src/components/pages/MainPage/Map/CityPoint.tsx
@@ -38,10 +38,12 @@ export function CityPoint({
 
   const { isLg } = useMediaQueries();
 
+  const handleCitySelect = () => setCityPoint({ title, x, y });
+
   const { onMouseDown, onMouseLeave, onMouseUp, onTouchEnd, onTouchStart } =
     useLongPress(
-      () => !isLg && setCityPoint({ title, x, y }),
-      () => isLg && setCityPoint({ title, x, y })
+      handleCitySelect, // onLongPress для мобильных
+      handleCitySelect // onClick для десктопа
     );
 
   const pointRef = useRef<HTMLButtonElement>(null);
@@ -86,7 +88,7 @@ export function CityPoint({
       }`}
     >
       <p
-        className={`heading2 group-hover:text-white relative transition-colors duration-300 font-medium ${
+        className={`heading2 group-hover:text-white transition-colors duration-300 font-medium ${
           active ? "z-[2]" : ""
         }`}
         ref={refTitle}
@@ -94,7 +96,7 @@ export function CityPoint({
         {title}
       </p>
       <p
-        className={`btns lg:h-[2.083vw] font-medium group-hover:text-white relative transition-colors duration-300 h-[5.114vw]${
+        className={`btns lg:h-[2.083vw] font-medium group-hover:text-white transition-colors duration-300 h-[5.114vw]${
           active ? " z-[2]" : ""
         }`}
         ref={refCount}
@@ -117,12 +119,8 @@ export function CityPoint({
                   delay: projects && projects.length * 0.1,
                 },
               }}
-              style={{
-                WebkitBackdropFilter: "blur(3.21px)",
-                backdropFilter: "blur(3.21px)",
-              }}
               onAnimationComplete={() => setAnimationCompleted(true)}
-              className="absolute rounded-full aspect-square z-[1] bg-[radial-gradient(#37393B00,#37393B99)] -translate-x-1/2 left-1/2"
+              className="absolute rounded-full aspect-square z-[1] [backdrop-filter:blur(3.21px)] bg-[radial-gradient(#37393B00,#37393B99)] -translate-x-1/2 left-1/2"
             />
             {!!projects?.length &&
               circleRef.current &&
@@ -186,10 +184,8 @@ export function LogoItem({
         opacity: 100,
         x: circleRadius * (1 - Math.cos(angle)),
         y: circleRadius * (1 - Math.sin(angle)),
-        top: -circleRadius,
-      }}
-      style={{
         zIndex: length - index,
+        top: -circleRadius,
       }}
       exit={{ opacity: 0, transition: { delay: index * 0.1 } }}
       transition={{ delay: index * 0.1 + 0.3, bounce: "none" }}