From 6b07dc4596e112d99bd27f47fac4cd2ad2998d0b Mon Sep 17 00:00:00 2001 From: spaaaacccee Date: Mon, 27 May 2024 03:57:37 +1000 Subject: [PATCH] Update site --- docs/0-get-started.mdx | 6 +-- src/components/ActionCard.tsx | 10 +++-- src/components/AppBar.tsx | 51 ++++++++++++++----------- src/components/Footer.tsx | 6 ++- src/components/Gallery.tsx | 8 ++-- src/components/GetStartedButton.tsx | 3 +- src/components/Hero.tsx | 2 +- src/css/custom.css | 5 +++ src/l10n/en-au.json | 38 +++++++++++++------ src/pages/index.tsx | 56 ++++++++++++++++++++-------- static/img/kzheng.png | Bin 0 -> 210685 bytes 11 files changed, 123 insertions(+), 62 deletions(-) create mode 100644 static/img/kzheng.png diff --git a/docs/0-get-started.mdx b/docs/0-get-started.mdx index 29b6bd0..b0de67c 100644 --- a/docs/0-get-started.mdx +++ b/docs/0-get-started.mdx @@ -21,19 +21,19 @@ Posthoc is a way to build simple and effective visualisations ✨ for sequential open("https://posthoc-app.pathfinding.ai")} + href={"https://posthoc-app.pathfinding.ai"} image={imageA} /> open("https://youtu.be/qVpHPYRi6GY")} + href={"https://youtu.be/qVpHPYRi6GY"} image={imageB} /> open("/docs/overview")} + href={"/docs/overview"} image={imageC} /> diff --git a/src/components/ActionCard.tsx b/src/components/ActionCard.tsx index f3fc846..7114fac 100644 --- a/src/components/ActionCard.tsx +++ b/src/components/ActionCard.tsx @@ -1,7 +1,9 @@ import { ArrowForwardOutlined } from "@mui/icons-material"; import { Box, + Button, ButtonBase, + ButtonProps, Card, CardProps, Stack, @@ -19,10 +21,12 @@ export default function ActionCard({ primary, secondary, image, + href, ...props -}: Props & CardProps) { +}: Props & CardProps & ButtonProps) { return ( - t.shape.borderRadius, p: 0, @@ -60,6 +64,6 @@ export default function ActionCard({ - + ); } diff --git a/src/components/AppBar.tsx b/src/components/AppBar.tsx index 7f91333..f996bca 100644 --- a/src/components/AppBar.tsx +++ b/src/components/AppBar.tsx @@ -1,3 +1,4 @@ +import BrowserOnly from "@docusaurus/BrowserOnly"; import { CloseOutlined as CloseIcon, DarkModeOutlined, @@ -5,23 +6,16 @@ import { DragHandleOutlined as MenuIcon, LaunchOutlined as OpenIcon, } from "@mui/icons-material"; -import { - Box, - Button, - IconButton, - Stack, - Typography, - useScrollTrigger, -} from "@mui/material"; +import { Box, Button, IconButton, Stack, Typography } from "@mui/material"; import PopupState, { bindTrigger } from "material-ui-popup-state"; +import { useEffect, useState } from "react"; import { createPortal } from "react-dom"; +import { l10n } from "../l10n"; import { Logo } from "./Logo"; import { useMode } from "./ModeContext"; import { space } from "./space"; import { usePaper } from "./theme"; import { useSm } from "./useSm"; -import BrowserOnly from "@docusaurus/BrowserOnly"; -import { l10n } from "../l10n"; export function AppBar() { const sm = useSm(); @@ -47,16 +41,19 @@ function AppBarBody() { const [mode, setMode] = useMode(); const sm = useSm(); const paper = usePaper(); - const top = useScrollTrigger({ - threshold: 0, - disableHysteresis: true, - target: document.body, - }); + const [top, setTop] = useState(true); + useEffect(() => { + let cancelled = false; + const f = () => { + const st = document.documentElement.scrollTop + document.body.scrollTop; + setTop(st === 0); + if (!cancelled) requestAnimationFrame(f); + }; + f(); + return () => void (cancelled = true); + }, [setTop]); const menu = l10n.sections.map(({ url, label }) => ( - - + ) )} diff --git a/src/components/GetStartedButton.tsx b/src/components/GetStartedButton.tsx index 97dc864..bda4de9 100644 --- a/src/components/GetStartedButton.tsx +++ b/src/components/GetStartedButton.tsx @@ -14,10 +14,11 @@ export function GetStartedButton() { borderRadius: 32, // Light text rendering bias fontWeight: mode === "dark" ? 600 : 500, + "&:hover": { color: "secondary.contrastText" }, }} variant="contained" endIcon={} - onClick={() => (location.href = l10n.heroCallToActionUrl)} + href={l10n.heroCallToActionUrl} > {l10n.heroCallToAction} diff --git a/src/components/Hero.tsx b/src/components/Hero.tsx index 43f79ff..5f0f334 100644 --- a/src/components/Hero.tsx +++ b/src/components/Hero.tsx @@ -55,7 +55,7 @@ export function Hero() { - + + + + + + } subtitle={l10n.teamSectionSubtitle} /> {map(l10n.team, ({ avatar, name, title, github }) => ( - ))} - - - - + + {l10n.teamContributorTitle} + + + {map(l10n.contributors, (s) => ( + + {s} + + ))} +