diff --git a/src/components/sections/team/TeamCarousel.tsx b/src/components/sections/team/TeamCarousel.tsx index c3895f2..f364e7c 100644 --- a/src/components/sections/team/TeamCarousel.tsx +++ b/src/components/sections/team/TeamCarousel.tsx @@ -49,6 +49,7 @@ export function TeamCarousel({ members, activeIndex, onActiveChange }: TeamCarou const total = members.length; const [dragOffset, setDragOffset] = useState(0); const isDraggingRef = useRef(false); + const wasDragRef = useRef(false); const pausedUntilRef = useRef(0); const dragStartRef = useRef<{ x: number; startIndex: number } | null>(null); @@ -76,6 +77,7 @@ export function TeamCarousel({ members, activeIndex, onActiveChange }: TeamCarou (e: React.PointerEvent) => { (e.target as HTMLElement).setPointerCapture(e.pointerId); isDraggingRef.current = true; + wasDragRef.current = false; dragStartRef.current = { x: e.clientX, startIndex: activeIndex }; setDragOffset(0); }, @@ -86,6 +88,7 @@ export function TeamCarousel({ members, activeIndex, onActiveChange }: TeamCarou (e: React.PointerEvent) => { if (!dragStartRef.current) return; const dx = e.clientX - dragStartRef.current.x; + if (Math.abs(dx) > 10) wasDragRef.current = true; setDragOffset(dx); }, [] @@ -194,7 +197,13 @@ export function TeamCarousel({ members, activeIndex, onActiveChange }: TeamCarou return (
{ + if (!style.isCenter && !wasDragRef.current) { + onActiveChange(i); + pausedUntilRef.current = Date.now() + PAUSE_MS; + } + }} + className={`absolute bottom-0 overflow-hidden rounded-2xl border ${style.isCenter ? "team-card-glitter" : "cursor-pointer"} pointer-events-auto`} style={{ width: style.width, height: style.height, diff --git a/src/components/sections/team/TeamProfile.tsx b/src/components/sections/team/TeamProfile.tsx index 0d28af8..e0759e6 100644 --- a/src/components/sections/team/TeamProfile.tsx +++ b/src/components/sections/team/TeamProfile.tsx @@ -1,4 +1,4 @@ -import { useState } from "react"; +import { useState, useEffect } from "react"; import Image from "next/image"; import { ArrowLeft, Instagram, Trophy, GraduationCap, ExternalLink, X, MapPin, Calendar, Award, Scale } from "lucide-react"; import type { TeamMember, RichListItem, VictoryItem } from "@/types/content"; @@ -10,6 +10,17 @@ interface TeamProfileProps { export function TeamProfile({ member, onBack }: TeamProfileProps) { const [lightbox, setLightbox] = useState(null); + + useEffect(() => { + function handleKeyDown(e: KeyboardEvent) { + if (e.key === "Escape") { + if (lightbox) setLightbox(null); + else onBack(); + } + } + window.addEventListener("keydown", handleKeyDown); + return () => window.removeEventListener("keydown", handleKeyDown); + }, [lightbox, onBack]); const places = member.victories?.filter(v => !v.type || v.type === 'place') ?? []; const nominations = member.victories?.filter(v => v.type === 'nomination') ?? []; const judging = member.victories?.filter(v => v.type === 'judge') ?? []; @@ -29,19 +40,17 @@ export function TeamProfile({ member, onBack }: TeamProfileProps) { className="w-full" style={{ animation: "team-info-in 0.6s cubic-bezier(0.16, 1, 0.3, 1)" }} > - {/* Back button */} - - {/* Magazine editorial layout */} -
+
{/* Photo — left column, sticky */} -
+
+
-
+
+ {/* Ambient photo background */} +
+ +
+
+
+
{/* Victory tabs */} {hasVictories && (
@@ -110,15 +132,20 @@ export function TeamProfile({ member, onBack }: TeamProfileProps) { ))}
- {victoryTabs.map(tab => ( - activeTab === tab.key && ( -
+
+ {victoryTabs.map(tab => ( +
{tab.items.map((item, i) => ( ))}
- ) - ))} + ))} +
)} @@ -171,6 +198,7 @@ export function TeamProfile({ member, onBack }: TeamProfileProps) { Информация скоро появится

)} +
@@ -206,33 +234,26 @@ function VictoryCard({ victory }: { victory: VictoryItem }) { const hasLink = !!victory.link; return ( -
+
{victory.place && ( -
- +
+ {victory.place}
)} -
+
{victory.category && ( -

{victory.category}

+

{victory.category}

)} -

{victory.competition}

+

{victory.competition}

{hasLink && ( Подробнее