diff --git a/packages/website/public/_headers b/packages/website/public/_headers new file mode 100644 index 000000000..b0c87cb38 --- /dev/null +++ b/packages/website/public/_headers @@ -0,0 +1,5 @@ +/assets/* + Cache-Control: public, max-age=31536000, immutable + +/phone-*.webp + Cache-Control: public, max-age=2592000 diff --git a/packages/website/public/phone-1-320.webp b/packages/website/public/phone-1-320.webp new file mode 100644 index 000000000..fb57ba39e Binary files /dev/null and b/packages/website/public/phone-1-320.webp differ diff --git a/packages/website/public/phone-1-480.webp b/packages/website/public/phone-1-480.webp new file mode 100644 index 000000000..7e66540d8 Binary files /dev/null and b/packages/website/public/phone-1-480.webp differ diff --git a/packages/website/public/phone-2-320.webp b/packages/website/public/phone-2-320.webp new file mode 100644 index 000000000..c01b19e96 Binary files /dev/null and b/packages/website/public/phone-2-320.webp differ diff --git a/packages/website/public/phone-2-480.webp b/packages/website/public/phone-2-480.webp new file mode 100644 index 000000000..d05656cde Binary files /dev/null and b/packages/website/public/phone-2-480.webp differ diff --git a/packages/website/public/phone-3-320.webp b/packages/website/public/phone-3-320.webp new file mode 100644 index 000000000..5bbf5d006 Binary files /dev/null and b/packages/website/public/phone-3-320.webp differ diff --git a/packages/website/public/phone-3-480.webp b/packages/website/public/phone-3-480.webp new file mode 100644 index 000000000..e077880c4 Binary files /dev/null and b/packages/website/public/phone-3-480.webp differ diff --git a/packages/website/src/components/command-dialog.tsx b/packages/website/src/components/command-dialog.tsx index 08265fe53..4ea2c913e 100644 --- a/packages/website/src/components/command-dialog.tsx +++ b/packages/website/src/components/command-dialog.tsx @@ -52,7 +52,7 @@ export function CommandDialog({ return (
- diff --git a/packages/website/src/components/docs-markdown.tsx b/packages/website/src/components/docs-markdown.tsx new file mode 100644 index 000000000..f0ca4cd3d --- /dev/null +++ b/packages/website/src/components/docs-markdown.tsx @@ -0,0 +1,81 @@ +import * as React from "react"; +import ReactMarkdown, { type Components } from "react-markdown"; +import { getDocsHighlighter, docsRehypePlugins, docsRemarkPlugins } from "~/docs-rehype"; + +function getCodeText(children: React.ReactNode): string { + return React.Children.toArray(children).join(""); +} + +function getLanguage(className: string | undefined): string | undefined { + return className?.match(/language-([^\s]+)/)?.[1]; +} + +function DocsPre({ + children, + node: _node, + ...props +}: React.ComponentProps<"pre"> & { node?: unknown }) { + const codeElement = React.Children.only(children); + const codeProps = React.isValidElement>(codeElement) + ? codeElement.props + : undefined; + const code = getCodeText(codeProps?.children); + const language = getLanguage(codeProps?.className); + const [highlightedHtml, setHighlightedHtml] = React.useState(null); + + React.useEffect(() => { + let cancelled = false; + + setHighlightedHtml(null); + if (!language) return; + const lang = language; + + async function highlight() { + try { + const highlighter = await getDocsHighlighter(); + if (cancelled) return; + setHighlightedHtml( + highlighter.codeToHtml(code.replace(/\n$/, ""), { + lang, + theme: "catppuccin-mocha", + }), + ); + } catch { + if (!cancelled) setHighlightedHtml(null); + } + } + + void highlight(); + + return () => { + cancelled = true; + }; + }, [code, language]); + + const highlightedMarkup = React.useMemo( + () => (highlightedHtml ? { __html: highlightedHtml } : undefined), + [highlightedHtml], + ); + + if (highlightedMarkup) { + return
; + } + + return 
{children}
; +} + +const docsMarkdownComponents: Components = { + pre: DocsPre, +}; + +export function DocsMarkdown({ children }: { children: string }) { + return ( + + {children} + + ); +} diff --git a/packages/website/src/components/landing-page.tsx b/packages/website/src/components/landing-page.tsx index 52d835a95..94f2ecb0d 100644 --- a/packages/website/src/components/landing-page.tsx +++ b/packages/website/src/components/landing-page.tsx @@ -894,12 +894,15 @@ function GetStarted() {
- + All download options
- Supports + Supports
@@ -1338,8 +1341,14 @@ function PhoneShowcase() { {/* Left phone — rotated to face inward */} Paseo sessions list @@ -1352,8 +1361,14 @@ function PhoneShowcase() { className="w-[220px] md:w-[240px] relative z-10" > Paseo agent chat @@ -1361,8 +1376,14 @@ function PhoneShowcase() { {/* Right phone — rotated to face inward */} Paseo diff view @@ -1425,7 +1446,7 @@ function CLISection() { Full CLI reference

Product

- + Blog - + Docs Changelog - + Cloud CLI Privacy @@ -47,16 +56,19 @@ export function SiteFooter({ width = "default" }: SiteFooterProps) {
Claude Code - + Codex OpenCode @@ -69,7 +81,7 @@ export function SiteFooter({ width = "default" }: SiteFooterProps) { href="https://discord.gg/jz8T2uahpH" target="_blank" rel="noopener noreferrer" - className="block text-white/40 hover:text-white/60 transition-colors" + className="block text-muted-foreground hover:text-foreground transition-colors" > Discord @@ -77,7 +89,7 @@ export function SiteFooter({ width = "default" }: SiteFooterProps) { href="https://github.com/getpaseo/paseo" target="_blank" rel="noopener noreferrer" - className="block text-white/40 hover:text-white/60 transition-colors" + className="block text-muted-foreground hover:text-foreground transition-colors" > GitHub @@ -90,7 +102,7 @@ export function SiteFooter({ width = "default" }: SiteFooterProps) { href={appStoreUrl} target="_blank" rel="noopener noreferrer" - className="block text-white/40 hover:text-white/60 transition-colors" + className="block text-muted-foreground hover:text-foreground transition-colors" > App Store @@ -98,7 +110,7 @@ export function SiteFooter({ width = "default" }: SiteFooterProps) { href={playStoreUrl} target="_blank" rel="noopener noreferrer" - className="block text-white/40 hover:text-white/60 transition-colors" + className="block text-muted-foreground hover:text-foreground transition-colors" > Google Play @@ -106,7 +118,7 @@ export function SiteFooter({ width = "default" }: SiteFooterProps) { href="https://github.com/getpaseo/paseo/releases" target="_blank" rel="noopener noreferrer" - className="block text-white/40 hover:text-white/60 transition-colors" + className="block text-muted-foreground hover:text-foreground transition-colors" > Desktop @@ -114,7 +126,7 @@ export function SiteFooter({ width = "default" }: SiteFooterProps) { href={webAppUrl} target="_blank" rel="noopener noreferrer" - className="block text-white/40 hover:text-white/60 transition-colors" + className="block text-muted-foreground hover:text-foreground transition-colors" > Web App diff --git a/packages/website/src/components/site-header.tsx b/packages/website/src/components/site-header.tsx index d57020f34..a8935f6e7 100644 --- a/packages/website/src/components/site-header.tsx +++ b/packages/website/src/components/site-header.tsx @@ -48,7 +48,7 @@ export function SiteHeader() { className="text-muted-foreground hover:text-foreground transition-colors inline-flex items-center" >

Doc not found.

; return ( <> - - {doc.content} - + {doc.content} ); diff --git a/packages/website/src/styles.css b/packages/website/src/styles.css index 74b17d1a9..f1ebdc4b1 100644 --- a/packages/website/src/styles.css +++ b/packages/website/src/styles.css @@ -253,7 +253,7 @@ } .docs-prose pre { - background-color: var(--color-card); + background-color: var(--color-card) !important; border: 1px solid var(--color-border); border-radius: 0.5rem; padding: 1rem; @@ -439,10 +439,10 @@ --color-mock-accent: #20744a; --color-mock-green: #22c55e; --color-mock-green-400: #4ade80; - --color-mock-red: #ef4444; + --color-mock-red: #f87171; --color-mock-amber: #f59e0b; --color-mock-blue: #3b82f6; - --color-mock-zinc500: #71717a; + --color-mock-zinc500: #a1a5a4; --color-mock-zinc600: #52525b; --color-mock-diff-add: rgba(46, 160, 67, 0.15); --color-mock-diff-remove: rgba(248, 81, 73, 0.1);