diff --git a/public/videos/studio_flex_bed.mp4 b/public/videos/studio_flex_bed.mp4 new file mode 100644 index 0000000..8df14b4 Binary files /dev/null and b/public/videos/studio_flex_bed.mp4 differ diff --git a/src/components/UnitTypeImageWithMarkers.tsx b/src/components/UnitTypeImageWithMarkers.tsx index 2cc2209..e300cf0 100644 --- a/src/components/UnitTypeImageWithMarkers.tsx +++ b/src/components/UnitTypeImageWithMarkers.tsx @@ -22,7 +22,7 @@ function UnitTypeImageWithMarkers({ const [hoveredIndex, setHoveredIndex] = useState(null); // Фильтруем legend по floor - const filteredLegend = legend.filter(item => { + const filteredLegend = legend.filter((item) => { // Если у элемента нет поля floor, показываем всегда if (!item.floor) return true; // Если у элемента есть поле floor, показываем только если оно совпадает с переданным floor @@ -58,7 +58,9 @@ function UnitTypeImageWithMarkers({ height={1312} transform="scale(.5)" // xlinkHref={`/images/unit-types/${complexName}/${unitType}.png`} - xlinkHref={`/images/unit-types/${complexName}/${unitType}${floor ? `-${floor}` : ""}.jpg`} + xlinkHref={`/images/unit-types/${complexName}/${unitType}${ + floor ? `-${floor}` : "" + }.jpg`} style={{ isolation: "isolate", }} @@ -73,7 +75,7 @@ function UnitTypeImageWithMarkers({ width={16} height={16} rx={8} - className="stroke-white fill-[#00BED7] hover:fill-white transition-colors cursor-pointer" + className="stroke-white fill-[#00BED7] hover:fill-white transition-colors cursor-pointer max-md:hidden" onMouseEnter={() => setHoveredIndex(index)} onMouseLeave={() => setHoveredIndex(null)} /> @@ -82,7 +84,7 @@ function UnitTypeImageWithMarkers({ {filteredLegend.map((item, index) => ( diff --git a/src/components/UnitTypeItem.tsx b/src/components/UnitTypeItem.tsx index bea4b09..ee421a4 100644 --- a/src/components/UnitTypeItem.tsx +++ b/src/components/UnitTypeItem.tsx @@ -6,6 +6,9 @@ import UnitType from "../types/UnitType"; import { useNavigate } from "react-router"; import { useEffect, useState } from "react"; import UnitTypeImageWithMarkers from "./UnitTypeImageWithMarkers"; +import PlayIcon from "./icons/PlayIcon"; +import VideoModal from "./VideoModal"; +import useModalStore from "../stores/useModalStore"; interface UnitTypeItemProps { project: Project; @@ -30,6 +33,8 @@ function UnitTypeItem({ project, type }: UnitTypeItemProps) { } }, [type.slug]); + const { setModal } = useModalStore(); + return (
@@ -117,6 +122,22 @@ function UnitTypeItem({ project, type }: UnitTypeItemProps) {

+ {/* {type.video && (