-
-
Notifications
You must be signed in to change notification settings - Fork 85
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Cursorless enablement group page (#1660)
See [deploy preview](https://deploy-preview-1660--cursorless.netlify.app/enablement-group) - Also adds support for mdx in our top-level cursorless-org package ## Checklist - [x] Add meta social tags - [x] Use latest logo - [x] Why is logo on social slow? And is it new logo? - [x] Make prices clickable - [x] document that sponsorship levels are yearly - [-] I have added [tests](https://www.cursorless.org/docs/contributing/test-case-recorder/) - [-] I have updated the [docs](https://github.com/cursorless-dev/cursorless/tree/main/docs) and [cheatsheet](https://github.com/cursorless-dev/cursorless/tree/main/cursorless-talon/src/cheatsheet) - [-] I have not broken the cheatsheet --------- Co-authored-by: F-Kunkle <[email protected]>
- Loading branch information
Showing
31 changed files
with
721 additions
and
44 deletions.
There are no files selected for viewing
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,15 @@ | ||
import type { MDXComponents } from "mdx/types"; | ||
|
||
// This file allows you to provide custom React components | ||
// to be used in MDX files. You can import and use any | ||
// React component you want, including components from | ||
// other libraries. | ||
|
||
// This file is required to use MDX in `app` directory. | ||
export function useMDXComponents(components: MDXComponents): MDXComponents { | ||
return { | ||
// Allows customizing built-in components, e.g. to add styling. | ||
// h1: ({ children }) => <h1 style={{ fontSize: "100px" }}>{children}</h1>, | ||
...components, | ||
}; | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,13 @@ | ||
import BaseSocial from "./BaseSocial"; | ||
import { DESCRIPTION, TITLE, VIDEO_SHARE_THUMBNAIL_URL } from "./constants"; | ||
|
||
export default function IndexSocial() { | ||
return ( | ||
<BaseSocial | ||
title={TITLE} | ||
description={DESCRIPTION} | ||
youtubeSlug={VIDEO_SHARE_THUMBNAIL_URL} | ||
relativeUrl="" | ||
/> | ||
); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,143 @@ | ||
import { MDXProvider } from "@mdx-js/react"; | ||
import type { MDXComponents } from "mdx/types.js"; | ||
import Head from "next/head"; | ||
import Logo from "../pages/logo.svg"; | ||
import BaseSocial from "./BaseSocial"; | ||
import { SpamProofEmailLink } from "./SpamProofEmailLink"; | ||
import Link from "next/link"; | ||
|
||
const components: MDXComponents = { | ||
h1: ({ children }) => ( | ||
<h1 className="text-center uppercase text-[1.88em] leading-tight mt-7 tracking-[0.14em] font-semibold"> | ||
{children} | ||
</h1> | ||
), | ||
h2: ({ children }) => ( | ||
<h2 className="uppercase text-[1.4em] mt-8 mb-4 sm:mb-8 font-semibold tracking-[0.08em]"> | ||
{children} | ||
</h2> | ||
), | ||
h3: ({ children }) => ( | ||
<h3 className="uppercase text-[1.5rem] mt-6 mb-3 sm:mb-6 font-medium tracking-[0.08em]"> | ||
{children} | ||
</h3> | ||
), | ||
h4: ({ children }) => ( | ||
<h4 className="uppercase text-[1.5rem] mt-11 mb-3 sm:mb-6 font-medium tracking-[0.08em]"> | ||
{children} | ||
</h4> | ||
), | ||
hr: () => <hr className="my-8 border-teal-400" />, | ||
ul: ({ children }) => <ul className="list-disc ml-8">{children}</ul>, | ||
ol: ({ children }) => <ol className="list-decimal ml-8">{children}</ol>, | ||
li: ({ children }) => <li className="my-2">{children}</li>, | ||
img: ({ src, alt }) => ( | ||
// FIXME: Figure out how to use next/image with MDX | ||
// eslint-disable-next-line @next/next/no-img-element | ||
<img | ||
className="mx-auto my-12 rounded-[4px] border-teal-400 border-[1.5px]" | ||
src={src} | ||
alt={alt} | ||
style={{ maxWidth: "100%" }} | ||
/> | ||
), | ||
CursorlessScreenshot: ({ src, alt }) => ( | ||
// FIXME: Figure out how to use next/image with MDX | ||
// eslint-disable-next-line @next/next/no-img-element | ||
<img | ||
className="mx-auto my-12 border-teal-400 border p-3 sm:p-6 rounded-sm" | ||
src={src} | ||
alt={alt} | ||
style={{ maxWidth: "100%" }} | ||
/> | ||
), | ||
CalloutParent: ({ children }) => ( | ||
<div className="border-teal-400 border rounded-sm px-7 my-12"> | ||
{children} | ||
</div> | ||
), | ||
CalloutBox: ({ title, children }) => ( | ||
<div className="my-6"> | ||
<h4 className="uppercase text-[1.5rem] mb-3 sm:mb-6 leading-tight font-medium tracking-[0.08em]"> | ||
{title} | ||
</h4> | ||
{children} | ||
</div> | ||
), | ||
Testimonials: ({ children }) => ( | ||
<div className="flex flex-col gap-5 mt-8">{children}</div> | ||
), | ||
Testimonial: ({ children, src, name, title, company }) => ( | ||
<div className="flex flex-col items-center bg-teal-100 dark:bg-teal-900 border border-teal-400 text-teal-700 dark:text-teal-300 p-3 sm:p-6 rounded-sm"> | ||
<blockquote className="mb-5 sm:mb-6 flex flex-col gap-4"> | ||
{children} | ||
</blockquote> | ||
<div className="flex items-center gap-4"> | ||
{/* eslint-disable-next-line @next/next/no-img-element */} | ||
<img | ||
className="rounded-full w-[4.5em] h-[4.5em] border-teal-400 border dark:border-[0.5px]" | ||
src={src} | ||
alt={name} | ||
/> | ||
<div className="flex flex-col gap-[0.375rem]"> | ||
<div className="text-teal-800 dark:text-teal-200 font-semibold text-[1.2em] leading-none"> | ||
{name} | ||
</div> | ||
<div className="text-[0.9em] leading-none">{title}</div> | ||
<div className="text-[0.9em] leading-none">{company}</div> | ||
</div> | ||
</div> | ||
</div> | ||
), | ||
Tiers: ({ children }) => ( | ||
<div className="my-8 font-medium tracking-[0.1em] text-[1.2em]"> | ||
{children} | ||
</div> | ||
), | ||
Tier: ({ emoji, type, price, address, subject, body }) => ( | ||
<div className="flex gap-3 leading-8"> | ||
<span className="">{emoji}</span> | ||
<span className="uppercase">{type}</span> | ||
<span>{"-"}</span> | ||
<SpamProofEmailLink address={address} subject={subject} body={body}> | ||
{price} / year | ||
</SpamProofEmailLink> | ||
</div> | ||
), | ||
}; | ||
|
||
export const bodyClasses = "bg-salmon-100 dark:bg-salmon-900"; | ||
|
||
export interface Props extends React.PropsWithChildren { | ||
title: string; | ||
description: string; | ||
relativeUrl: string; | ||
} | ||
|
||
export function Layout({ title, description, relativeUrl, children }: Props) { | ||
return ( | ||
<> | ||
<Head> | ||
<title>{title}</title> | ||
<BaseSocial | ||
title={title} | ||
description={description} | ||
relativeUrl={relativeUrl} | ||
/> | ||
</Head> | ||
<MDXProvider components={components}> | ||
<main className="text-salmon-900 dark:text-salmon-100 font-mono font-normal sm:dark:font-light px-4 pt-8 sm:pt-16 lg:pt-20 pb-8 tracking-[0.08em] leading-6"> | ||
<div className="max-w-prose mx-auto"> | ||
<Link href="/"> | ||
<Logo | ||
title="Logo" | ||
className="mx-auto align-middle w-[6.284em] h-[6.284em]" | ||
/> | ||
</Link> | ||
{children} | ||
</div> | ||
</main> | ||
</MDXProvider> | ||
</> | ||
); | ||
} |
Oops, something went wrong.