diff --git a/scripts/build-landing.mjs b/scripts/build-landing.mjs index 6ced4fdd0..84c94a04a 100644 --- a/scripts/build-landing.mjs +++ b/scripts/build-landing.mjs @@ -35,6 +35,15 @@ const constant = name => { once("privacy policy link", 'Privacy policy', 'Privacy policy') once("app privacy policy link", 'App privacy policy', 'App privacy policy') once("terms link", 'Terms of service', 'Terms of service') +// the Support link is not in his file: Tommy Thomas, Slack 2026-09-17 (C0BRZ8G1V50), asked for +// a /support page, "hyperlink should be in footer" — it closes the Legal column, next to the +// app privacy policy (the App Store listing's other URL; Zhengqi 2026-09-18), here and in +// LandingFooter.tsx (the legal pages' footer) alike +once( + "support link", + 'Terms of service', + 'Terms of service\n Support', +) once("white paper link", 'href="/scroll-whitepaper.pdf"', 'href="/files/whitepaper.pdf"') // ---- the Compass button on the Compass API panel: his file points it at his own Compass diff --git a/src/app/_components/LandingFooter.tsx b/src/app/_components/LandingFooter.tsx index a665438d2..b33544d15 100644 --- a/src/app/_components/LandingFooter.tsx +++ b/src/app/_components/LandingFooter.tsx @@ -7,7 +7,9 @@ import FooterRidge from "./FooterRidge" import styles from "./landing.module.css" // Glen's footer copy (scroll.html, 2026-09-10); his links are placeholders, ours are the -// real pages and sections +// real pages and sections. Support is not in his file: Tommy Thomas, Slack 2026-09-17 +// (C0BRZ8G1V50), asked for a /support page, "hyperlink should be in footer". It sits with +// the legal links because those are the App Store listing's other URL (Zhengqi 2026-09-18). const FOOTER_COLUMNS = [ { title: "Legal", @@ -15,6 +17,7 @@ const FOOTER_COLUMNS = [ { label: "Privacy policy", href: "/privacy-policy" }, { label: "App privacy policy", href: "/app-privacy-policy" }, { label: "Terms of service", href: "/terms-of-service" }, + { label: "Support", href: "/support" }, ], }, { diff --git a/src/app/sitemap.ts b/src/app/sitemap.ts index b127648c5..ba9d3aee1 100644 --- a/src/app/sitemap.ts +++ b/src/app/sitemap.ts @@ -5,6 +5,7 @@ export default function sitemap(): MetadataRoute.Sitemap { { url: "https://scroll.io", changeFrequency: "daily", priority: 0.8 }, { url: "https://scroll.io/privacy-policy", changeFrequency: "yearly", priority: 0.4 }, { url: "https://scroll.io/app-privacy-policy", changeFrequency: "yearly", priority: 0.4 }, + { url: "https://scroll.io/support", changeFrequency: "monthly", priority: 0.5 }, { url: "https://scroll.io/terms-of-service", changeFrequency: "yearly", priority: 0.4 }, ] } diff --git a/src/app/support/layout.tsx b/src/app/support/layout.tsx new file mode 100644 index 000000000..1cfe44f07 --- /dev/null +++ b/src/app/support/layout.tsx @@ -0,0 +1,14 @@ +import { genMeta } from "@/utils/route" + +import LegalShell from "../_components/LegalShell" + +export const generateMetadata = genMeta(() => ({ + titleSuffix: "Compass Support", + description: + "Compass is an AI assistant for iPhone. Ask anything with Claude, GPT, Gemini, Grok and more, or download Compass Mini and get answers with no signal.", + relativeURL: "/support", +})) + +export default function Layout({ children }) { + return {children} +} diff --git a/src/app/support/page.tsx b/src/app/support/page.tsx new file mode 100644 index 000000000..d8dc62d98 --- /dev/null +++ b/src/app/support/page.tsx @@ -0,0 +1,172 @@ +"use client" + +import Link from "next/link" + +import { Box, Typography } from "@mui/material" +import { styled } from "@mui/system" + +const Container = styled(Box)(({ theme }) => ({ + padding: "2rem 0 0", + color: "#3D3D3D", + "& *": { + fontSize: "1.5rem", + lineHeight: 1.7, + textAlign: "left", + [theme.breakpoints.down("sm")]: { + fontSize: "1.4rem", + }, + }, + "& h1": { + fontSize: "2.6rem", + marginTop: "3.6rem", + }, + "& h2": { + fontSize: "2.2rem", + marginTop: "3.2rem", + }, + "& h3": { + fontSize: "1.8rem", + marginTop: "2.8rem", + // the questions sit close to their answers, so each pair reads as one; the legal + // pages give their sub-headings the section heads' 2.8rem + marginBottom: "1.2rem", + }, + "& h1, & h2, & h3": { + fontFamily: "var(--font-instrument-serif)", + fontWeight: 400, + color: "#000", + }, + "& h1, & h2": { + marginBottom: "2.8rem", + [theme.breakpoints.down("md")]: { + marginBottom: "2rem", + }, + }, + "& p": { + marginBottom: "1.6rem", + "+ h1, + h2, + h3": { + marginTop: "2.8rem", + [theme.breakpoints.down("md")]: { + marginTop: "2rem", + }, + }, + }, + "& ul": { + marginBottom: "1.6rem", + paddingLeft: "3rem", + listStyle: "disc", + }, +})) as typeof Box + +const TitleTypography = styled(Typography)(() => ({ + textAlign: "center", + fontFamily: "var(--font-instrument-serif) !important", + fontSize: "3.6rem !important", + fontWeight: "400 !important", + marginBottom: "4rem", +})) + +// Tommy Thomas, Slack 2026-09-17 (C0BRZ8G1V50): "create a /support sublink (hyperlink should +// be in footer) with this text" — the Compass iOS app's support page. Copy is his message +// verbatim: the three section lines are h2, his bold questions h3, his other bold runs +// . Same shell and type as the legal pages next to it. +const Support = () => { + return ( + + Compass Support +

+ Compass is an AI assistant for iPhone. Ask anything with Claude, GPT, Gemini, Grok and more, or download Compass Mini and get answers with no + signal. +

+ +

Contact us

+

+ Email{" "} + + + tommy@scroll.io + + {" "} + and we’ll reply within 2 business days. It helps to include: +

+ +

+ You can also send feedback in the app: tap your avatar, then Send feedback. +

+ +

Common questions

+

Do I need an account?

+

No. You can start as a guest. Creating a free account gives you a larger cloud AI allowance and lets you subscribe.

+ +

What’s the difference between cloud models and Compass Mini?

+

+ Cloud models (Claude, GPT, Gemini, Grok and others) give the best answers and need a connection. Compass Mini is an on-device model you + download once. It works offline, and nothing you ask it leaves your iPhone. +

+ +

Why did I run out of allowance?

+

+ Models cost different amounts to run, so the same number of messages can use a little or a lot. Tap your avatar, then Usage, + to see how much you’ve used and when it resets. Everyday models use the least. On-device answers don’t use any allowance. +

+ +

What do Plus and Premium include?

+ + +

How do I cancel or manage my subscription?

+

+ Subscriptions are billed by Apple. Go to iPhone Settings → your name → Subscriptions → Compass. Cancel at least 24 hours + before renewal to avoid the next charge. +

+ +

How do I get a refund?

+

+ Refunds are handled by Apple. Request one at{" "} + + reportaproblem.apple.com + + . +

+ +

I subscribed on another iPhone. How do I get it back?

+

+ Sign in to the same account, then go to Settings → Restore purchases. +

+ +

How do I set up the eSIM or VPN?

+

+ Premium subscribers can tap eSIM or VPN above the text box and follow the steps. The eSIM needs an + eSIM-compatible, carrier-unlocked iPhone. +

+ +

How do I delete my account or data?

+

+ In the app, go to Settings → Delete account (or Delete my data as a guest). +

+ +

Privacy

+

+ See our Privacy Policy:{" "} + + scroll.io/app-privacy-policy + +

+
+ ) +} + +export default Support diff --git a/src/components/ScrollToTop/index.tsx b/src/components/ScrollToTop/index.tsx index fe16f995b..85c3df98f 100644 --- a/src/components/ScrollToTop/index.tsx +++ b/src/components/ScrollToTop/index.tsx @@ -18,7 +18,7 @@ const ScrollToTop: React.FC = () => { const [visible, setVisible] = useState(false) // the redesigned landing pages use a minimal circle-arrow button instead of the orange fab - const isCompassRoute = ["/", "/privacy-policy", "/terms-of-service", "/app-privacy-policy"].includes(pathname) + const isCompassRoute = ["/", "/privacy-policy", "/terms-of-service", "/app-privacy-policy", "/support"].includes(pathname) const checkScrollPosition = () => { // Glen's scroll.html (2026-09-10) shows its back-to-top once 80% of a screen has gone by diff --git a/src/utils/route.ts b/src/utils/route.ts index e90208476..e6cd9d14a 100644 --- a/src/utils/route.ts +++ b/src/utils/route.ts @@ -103,6 +103,7 @@ export function genMeta(fn: MetaGeneratorFn = defaultGenMetaFn) { const currentRoute: Metadata = { title, + description, openGraph: { title, description, url: relativeURL, images: openGraphImages }, twitter: { title, description, images: twitterImages }, }