From d692ce6bce69732f1618cac5372d322259e22087 Mon Sep 17 00:00:00 2001 From: ap-justin <89639563+ap-justin@users.noreply.github.com> Date: Tue, 15 Apr 2025 16:15:55 +0800 Subject: [PATCH 01/16] landing markup --- src/components/{about-video.tsx => video.tsx} | 30 ++++-- .../pdf-export/page1/index.tsx | 0 src/pages/home/feature1.tsx | 4 +- .../informational/nonprofit-info/hero.tsx | 7 +- src/pages/landing-a/feature.tsx | 4 +- src/pages/landing-c/index.tsx | 51 +++++++++++ src/pages/landing-c/top.tsx | 91 +++++++++++++++++++ vite.config.js | 1 + 8 files changed, 176 insertions(+), 12 deletions(-) rename src/components/{about-video.tsx => video.tsx} (78%) create mode 100644 src/pages/donation-calculator/pdf-export/page1/index.tsx create mode 100644 src/pages/landing-c/index.tsx create mode 100644 src/pages/landing-c/top.tsx diff --git a/src/components/about-video.tsx b/src/components/video.tsx similarity index 78% rename from src/components/about-video.tsx rename to src/components/video.tsx index 18f0ab44c1..85aec36153 100644 --- a/src/components/about-video.tsx +++ b/src/components/video.tsx @@ -1,12 +1,30 @@ -import poster from "assets/images/about-video-preview.webp"; +import aboutPoster from "assets/images/about-video-preview.webp"; import { useEffect, useRef, useState } from "react"; import subtitle from "./about-video.vtt"; type VideoStatus = "loading" | "error" | "loaded"; -const videoUrl = - "https://elktqtbc25yfiipw.public.blob.vercel-storage.com/about-better-giving-HXqlfIWwctto66xyOTStih3rWj9Ajg"; -export const AboutVideo = ({ classes = "" }) => { +interface Vid { + url: string; + poster: string; +} +interface Props { + classes?: string; + vid: Vid; +} + +export const videos = { + about: { + url: "https://elktqtbc25yfiipw.public.blob.vercel-storage.com/about-better-giving-HXqlfIWwctto66xyOTStih3rWj9Ajg", + poster: aboutPoster, + }, + donation_calculator: { + url: "https://elktqtbc25yfiipw.public.blob.vercel-storage.com/donation-calculator-SZju4lCvUjU6HUYWi2adrQVR9NDCaz", + poster: "assets/images/about-video-preview.webp", + }, +}; + +export const Video = ({ classes = "", vid }: Props) => { const videoRef = useRef(null); const containerRef = useRef(null); const [isIntersecting, setIsIntersecting] = useState(false); @@ -67,8 +85,8 @@ export const AboutVideo = ({ classes = "" }) => { )}