125 lines
4.8 KiB
TypeScript
125 lines
4.8 KiB
TypeScript
import { ButtonLink, SectionHeading } from '@nx/nx-dev/ui-common';
|
|
import {
|
|
ArrowUpRightIcon,
|
|
ChatBubbleLeftRightIcon,
|
|
ChevronRightIcon,
|
|
} from '@heroicons/react/24/outline';
|
|
import { NxCloudIcon } from '@nx/nx-dev/ui-icons';
|
|
|
|
export function HowCanWeHelp(): JSX.Element {
|
|
return (
|
|
<section id="contact-us">
|
|
<div className="mx-auto max-w-7xl px-6 lg:px-8">
|
|
<div className="mx-auto max-w-3xl text-center">
|
|
<SectionHeading as="h1" variant="display" id="how-can-we-help">
|
|
How can we help?
|
|
</SectionHeading>
|
|
</div>
|
|
<div className="mx-auto mt-16 grid max-w-5xl grid-cols-1 gap-4 md:grid-cols-2">
|
|
<section className="rounded-xl border border-slate-200 bg-slate-50/20 p-8 dark:border-slate-800/40 dark:bg-slate-800/60">
|
|
<div className="flex items-center gap-2">
|
|
<ChevronRightIcon
|
|
aria-hidden="true"
|
|
className="h-5 w-5 shrink-0"
|
|
/>
|
|
<h3 className="text-xl font-medium text-slate-700 dark:text-slate-300">
|
|
Talk to Sales
|
|
</h3>
|
|
</div>
|
|
<p className="mt-4">
|
|
Contact our sales team to discuss pricing, terms, certifications,
|
|
and your unique constraints.
|
|
</p>
|
|
<ButtonLink
|
|
href="/contact/sales"
|
|
variant="primary"
|
|
size="default"
|
|
title="Talk to our sales team"
|
|
className="mt-6"
|
|
>
|
|
Reach out to sales
|
|
</ButtonLink>
|
|
</section>
|
|
<section className="rounded-xl border border-slate-200 bg-slate-50/20 p-8 dark:border-slate-800/40 dark:bg-slate-800/60">
|
|
<div className="flex items-center gap-2">
|
|
<ChevronRightIcon
|
|
aria-hidden="true"
|
|
className="h-5 w-5 shrink-0"
|
|
/>
|
|
<h3 className="text-xl font-medium text-slate-700 dark:text-slate-300">
|
|
Learn more about Nx Cloud
|
|
</h3>
|
|
</div>
|
|
<p className="mt-4">
|
|
Contact our developer productivity engineers for demos, onboarding
|
|
and product questions.
|
|
</p>
|
|
<ButtonLink
|
|
href="/contact/engineering"
|
|
variant="primary"
|
|
size="default"
|
|
title="Talk to our engineering team"
|
|
className="mt-6"
|
|
>
|
|
Reach out to engineers
|
|
</ButtonLink>
|
|
</section>
|
|
<section className="rounded-xl border border-slate-200 bg-slate-50/20 p-8 dark:border-slate-800/40 dark:bg-slate-800/60">
|
|
<div className="flex items-center gap-2">
|
|
<ChatBubbleLeftRightIcon
|
|
aria-hidden="true"
|
|
className="h-5 w-5 shrink-0"
|
|
/>
|
|
<h3 className="text-lg font-medium text-slate-700 dark:text-slate-300">
|
|
Question about Nx
|
|
</h3>
|
|
</div>
|
|
<p className="mt-4">
|
|
Ask a question, receive guidance, share ideas or simply leave
|
|
feedback about our products on the Discord channel. A vibrant
|
|
community of Nx users will be able to help you.
|
|
</p>
|
|
<ButtonLink
|
|
href="https://go.nx.dev/community"
|
|
variant="secondary"
|
|
size="default"
|
|
title="Join the community"
|
|
target="_blank"
|
|
rel="nofollow"
|
|
className="mt-6"
|
|
>
|
|
<span>Ask questions on Discord</span>
|
|
<ArrowUpRightIcon aria-hidden="true" className="h-3 w-3" />
|
|
</ButtonLink>
|
|
</section>
|
|
<section className="rounded-xl border border-slate-200 bg-slate-50/20 p-8 dark:border-slate-800/40 dark:bg-slate-800/60">
|
|
<div className="flex items-center gap-2">
|
|
<NxCloudIcon aria-hidden="true" className="h-5 w-5 shrink-0" />
|
|
<h3 className="text-lg font-medium text-slate-700 dark:text-slate-300">
|
|
Nx Cloud support
|
|
</h3>
|
|
</div>
|
|
<p className="mt-4">
|
|
If you have questions about using Nx Cloud, need help connecting
|
|
your repository, or have questions about billing, log in to your
|
|
account and contact support.
|
|
</p>
|
|
<ButtonLink
|
|
href="https://cloud.nx.app"
|
|
variant="secondary"
|
|
size="default"
|
|
title="Sign in to Nx Cloud"
|
|
target="_blank"
|
|
rel="nofollow"
|
|
className="mt-6"
|
|
>
|
|
<span>Sign in to Nx Cloud</span>
|
|
<ArrowUpRightIcon aria-hidden="true" className="h-3 w-3" />
|
|
</ButtonLink>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|