From a782e3dac2c60429c2f06ccb1b20edaf5797ca0f Mon Sep 17 00:00:00 2001 From: Dax Date: Wed, 1 Oct 2025 19:38:15 -0400 Subject: Zen lander (#2907) Co-authored-by: David Hill Co-authored-by: GitHub Action Co-authored-by: Adam <2363879+adamdotdevin@users.noreply.github.com> Co-authored-by: Jay V --- .../console/app/src/component/email-signup.tsx | 49 ++++++++ packages/console/app/src/component/faq.tsx | 33 ++++++ packages/console/app/src/component/footer.tsx | 34 ++++++ packages/console/app/src/component/header.tsx | 127 +++++++++++++++++++++ packages/console/app/src/component/icon.tsx | 33 ++---- packages/console/app/src/component/legal.tsx | 9 ++ 6 files changed, 260 insertions(+), 25 deletions(-) create mode 100644 packages/console/app/src/component/email-signup.tsx create mode 100644 packages/console/app/src/component/faq.tsx create mode 100644 packages/console/app/src/component/footer.tsx create mode 100644 packages/console/app/src/component/header.tsx create mode 100644 packages/console/app/src/component/legal.tsx (limited to 'packages/console/app/src/component') diff --git a/packages/console/app/src/component/email-signup.tsx b/packages/console/app/src/component/email-signup.tsx new file mode 100644 index 000000000..fec516a5f --- /dev/null +++ b/packages/console/app/src/component/email-signup.tsx @@ -0,0 +1,49 @@ +import { action, useSubmission } from "@solidjs/router" +import dock from "../asset/lander/dock.png" +import { Resource } from "sst" +import { Show } from "solid-js" + +const emailSignup = action(async (formData: FormData) => { + "use server" + const emailAddress = formData.get("email")! + const listId = "8b9bb82c-9d5f-11f0-975f-0df6fd1e4945" + const response = await fetch(`https://api.emailoctopus.com/lists/${listId}/contacts`, { + method: "PUT", + headers: { + Authorization: `Bearer ${Resource.EMAILOCTOPUS_API_KEY.value}`, + "Content-Type": "application/json", + }, + body: JSON.stringify({ + email_address: emailAddress, + }), + }) + console.log(response) + return true +}) + +export function EmailSignup() { + const submission = useSubmission(emailSignup) + return ( +
+
+ +
+
+

OpenCode will be available on desktop soon

+

Join the waitlist for early access.

+
+
+ + +
+ +
Almost done, check your inbox and confirm your email address
+ + +
{submission.error}
+ +
+ ) +} diff --git a/packages/console/app/src/component/faq.tsx b/packages/console/app/src/component/faq.tsx new file mode 100644 index 000000000..2b28fc0fe --- /dev/null +++ b/packages/console/app/src/component/faq.tsx @@ -0,0 +1,33 @@ +import { Collapsible } from "@kobalte/core/collapsible" +import { ParentProps } from "solid-js" + +export function Faq(props: ParentProps & { question: string }) { + return ( + + + + + + + + +
{props.question}
+ + {props.children} + + ) +} diff --git a/packages/console/app/src/component/footer.tsx b/packages/console/app/src/component/footer.tsx new file mode 100644 index 000000000..f4ff846db --- /dev/null +++ b/packages/console/app/src/component/footer.tsx @@ -0,0 +1,34 @@ +import { A, createAsync } from "@solidjs/router" +import { createMemo } from "solid-js" +import { github } from "~/lib/github" + +export function Footer() { + const githubData = createAsync(() => github()) + const starCount = createMemo(() => + githubData()?.stars + ? new Intl.NumberFormat("en-US", { + notation: "compact", + compactDisplay: "short", + }).format(githubData()!.stars!) + : "25K", + ) + + return ( + + ) +} diff --git a/packages/console/app/src/component/header.tsx b/packages/console/app/src/component/header.tsx new file mode 100644 index 000000000..c5447d1c1 --- /dev/null +++ b/packages/console/app/src/component/header.tsx @@ -0,0 +1,127 @@ +import logoLight from "../asset/logo-ornate-light.svg" +import logoDark from "../asset/logo-ornate-dark.svg" +import { A, createAsync } from "@solidjs/router" +import { createMemo, Match, Show, Switch } from "solid-js" +import { createStore } from "solid-js/store" +import { github } from "~/lib/github" + +export function Header(props: { zen?: boolean }) { + const githubData = createAsync(() => github()) + const starCount = createMemo(() => + githubData()?.stars + ? new Intl.NumberFormat("en-US", { + notation: "compact", + compactDisplay: "short", + }).format(githubData()?.stars!) + : "25K", + ) + + const [store, setStore] = createStore({ + mobileMenuOpen: false, + }) + + return ( +
+ + opencode logo light + opencode logo dark + + + +
+ ) +} diff --git a/packages/console/app/src/component/icon.tsx b/packages/console/app/src/component/icon.tsx index a82572e62..fa28316e8 100644 --- a/packages/console/app/src/component/icon.tsx +++ b/packages/console/app/src/component/icon.tsx @@ -34,38 +34,21 @@ export function IconLogo(props: JSX.SvgSVGAttributes) { export function IconCopy(props: JSX.SvgSVGAttributes) { return ( - - + + d="M8.75 8.75V2.75H21.25V15.25H15.25M15.25 8.75H2.75V21.25H15.25V8.75Z" + stroke="#8E8B8B" + stroke-width="1.5" + stroke-linecap="square" + /> ) } export function IconCheck(props: JSX.SvgSVGAttributes) { return ( - - + + ) } diff --git a/packages/console/app/src/component/legal.tsx b/packages/console/app/src/component/legal.tsx new file mode 100644 index 000000000..d692e4622 --- /dev/null +++ b/packages/console/app/src/component/legal.tsx @@ -0,0 +1,9 @@ +export function Legal() { + return ( +
+ + ©{new Date().getFullYear()} Anomaly + +
+ ) +} -- cgit v1.2.3