diff --git a/.gitignore b/.gitignore index 839e82652..43d6b0f93 100644 --- a/.gitignore +++ b/.gitignore @@ -52,3 +52,9 @@ lint-fix.sh draft/ .venv/ + +# Vercel (local project link from CLI preview deploys) +.vercel + +# Local raw-asset drop folder (copied into docs/public to serve) +/assets/ diff --git a/docs/app/(home)/agent-interface/AgentSteps.tsx b/docs/app/(home)/agent-interface/AgentSteps.tsx new file mode 100644 index 000000000..fa6c421cf --- /dev/null +++ b/docs/app/(home)/agent-interface/AgentSteps.tsx @@ -0,0 +1,100 @@ +"use client"; + +import { useRef } from "react"; +import { + StepsAccordion, + type StepsAccordionItem, +} from "../components/StepsAccordion/StepsAccordion"; +function createVideoIllustration(src: string) { + return function VideoIllustration() { + const videoRef = useRef(null); + + const handleLoadedMetadata = () => { + const video = videoRef.current; + if (!video) return; + const parent = video.parentElement; + if (!parent) return; + const ratio = video.videoWidth / video.videoHeight; + if (Number.isFinite(ratio) && ratio > 0) { + parent.style.aspectRatio = String(ratio); + parent.style.height = "auto"; + // On mobile the scale wrapper sits inside a fixed-aspect frame; match the + // frame to the video's ratio so it hugs the video with no empty space. + if (parent.className.includes("mobileIllustrationScale")) { + const frame = parent.parentElement; + if (frame) frame.style.aspectRatio = String(ratio); + } + } + }; + + return ( +