mirror of
https://github.com/documenso/documenso.git
synced 2025-11-10 04:22:32 +10:00
chore: add teams pricing and move enterprise cta
This commit is contained in:
Timur Ercan
@ -9,6 +9,7 @@ import {
|
||||
} from '@documenso/ui/primitives/accordion';
|
||||
import { Button } from '@documenso/ui/primitives/button';
|
||||
|
||||
import { Enterprise } from '~/components/(marketing)/enterprise';
|
||||
import { PricingTable } from '~/components/(marketing)/pricing-table';
|
||||
|
||||
export const metadata: Metadata = {
|
||||
@ -42,6 +43,10 @@ export default function PricingPage() {
|
||||
<PricingTable />
|
||||
</div>
|
||||
|
||||
<div className="mt-12">
|
||||
<Enterprise />
|
||||
</div>
|
||||
|
||||
<div className="mx-auto mt-36 max-w-2xl">
|
||||
<h2 className="text-center text-2xl font-semibold">
|
||||
None of these work for you? Try self-hosting!
|
||||
|
||||
40
apps/marketing/src/components/(marketing)/enterprise.tsx
Normal file
40
apps/marketing/src/components/(marketing)/enterprise.tsx
Normal file
@ -0,0 +1,40 @@
|
||||
'use client';
|
||||
|
||||
import type { HTMLAttributes } from 'react';
|
||||
|
||||
import Link from 'next/link';
|
||||
|
||||
import { usePlausible } from 'next-plausible';
|
||||
|
||||
import { Button } from '@documenso/ui/primitives/button';
|
||||
|
||||
export type EnterpriseProps = HTMLAttributes<HTMLDivElement>;
|
||||
|
||||
export const Enterprise = ({ className, ...props }: EnterpriseProps) => {
|
||||
const event = usePlausible();
|
||||
|
||||
return (
|
||||
<div className="mx-auto mt-36 max-w-2xl">
|
||||
<h2 className="text-center text-2xl font-semibold">
|
||||
Enterprise Compliance, License or Technical Needs?
|
||||
</h2>
|
||||
|
||||
<p className="text-muted-foreground mt-4 text-center leading-relaxed">
|
||||
Our Enterprise License is great large organizations looking to switch to Documenso for all
|
||||
their signing needs. It's availible for our cloud offering as well as self-hosted setups and
|
||||
offer a wide range of compliance and Adminstration Features.
|
||||
</p>
|
||||
|
||||
<div className="mt-4 flex justify-center">
|
||||
<Link
|
||||
href="https://dub.sh/enterprise"
|
||||
target="_blank"
|
||||
className="mt-6"
|
||||
onClick={() => event('enterprise-contact')}
|
||||
>
|
||||
<Button className="rounded-full text-base">Contact Us</Button>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
@ -102,10 +102,10 @@ export const PricingTable = ({ className, ...props }: PricingTableProps) => {
|
||||
</div>
|
||||
|
||||
<div
|
||||
data-plan="early-adopter"
|
||||
className="border-primary bg-background shadow-foreground/5 flex flex-col items-center justify-center rounded-lg border-2 px-8 py-12 shadow-[0px_0px_0px_4px_#E3E3E380]"
|
||||
data-plan="individual"
|
||||
className="bg-background shadow-foreground/5 flex flex-col items-center justify-center rounded-lg border-2 px-8 py-12 shadow-[0px_0px_0px_4px_#E3E3E380]"
|
||||
>
|
||||
<p className="text-foreground text-4xl font-medium">Early Adopters</p>
|
||||
<p className="text-foreground text-4xl font-medium">Individual</p>
|
||||
<div className="text-primary mt-2.5 text-xl font-medium">
|
||||
<AnimatePresence mode="wait">
|
||||
{period === 'MONTHLY' && <motion.div layoutId="pricing">$30</motion.div>}
|
||||
@ -114,12 +114,12 @@ export const PricingTable = ({ className, ...props }: PricingTableProps) => {
|
||||
</div>
|
||||
|
||||
<p className="text-foreground mt-4 max-w-[30ch] text-center">
|
||||
For fast-growing companies that aim to scale across multiple teams.
|
||||
Everything you need for a great signing experience.
|
||||
</p>
|
||||
|
||||
<Button className="mt-6 rounded-full text-base" asChild>
|
||||
<Link
|
||||
href={`${NEXT_PUBLIC_WEBAPP_URL()}/signup?utm_source=pricing-early-adopter`}
|
||||
href={`${NEXT_PUBLIC_WEBAPP_URL()}/signup?utm_source=pricing-individual-plan`}
|
||||
target="_blank"
|
||||
>
|
||||
Signup Now
|
||||
@ -127,51 +127,46 @@ export const PricingTable = ({ className, ...props }: PricingTableProps) => {
|
||||
</Button>
|
||||
|
||||
<div className="mt-8 flex w-full flex-col divide-y">
|
||||
<p className="text-foreground py-4">
|
||||
<a
|
||||
href="https://documen.so/early-adopters-pricing-page"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
Limited Time Offer: <span className="text-documenso-700">Read More</span>
|
||||
</a>
|
||||
</p>
|
||||
<p className="text-foregro‚und py-4">Unlimited Teams</p>
|
||||
<p className="text-foregro‚und py-4">Unlimited Users</p>
|
||||
<p className="text-foregro‚und py-4">Unlimited Documents per month</p>
|
||||
<p className="text-foreground py-4">Includes all upcoming features</p>
|
||||
<p className="text-foreground py-4">Email, Discord and Slack assistance</p>
|
||||
<p className="text-foregro‚und py-4">Unlimited Documents per Month</p>
|
||||
<p className="text-foreground py-4">API Accesss</p>
|
||||
<p className="text-foreground py-4">Email and Discord Support</p>
|
||||
<p className="text-foreground py-4">Premium Profile Name</p>
|
||||
</div>
|
||||
<div className="flex-1" />
|
||||
</div>
|
||||
|
||||
<div
|
||||
data-plan="enterprise"
|
||||
className="bg-background shadow-foreground/5 flex flex-col items-center justify-center rounded-lg border px-8 py-12 shadow-lg"
|
||||
data-plan="teams"
|
||||
className="border-primary bg-background shadow-foreground/5 flex flex-col items-center justify-center rounded-lg border px-8 py-12 shadow-lg"
|
||||
>
|
||||
<p className="text-foreground text-4xl font-medium">Enterprise</p>
|
||||
<p className="text-primary mt-2.5 text-xl font-medium">Pricing on request</p>
|
||||
<p className="text-foreground text-4xl font-medium">Teams</p>
|
||||
<div className="text-primary mt-2.5 text-xl font-medium">
|
||||
<AnimatePresence mode="wait">
|
||||
{period === 'MONTHLY' && <motion.div layoutId="pricingTeams">$50</motion.div>}
|
||||
{period === 'YEARLY' && <motion.div layoutId="pricingTeams">$500</motion.div>}
|
||||
</AnimatePresence>
|
||||
</div>
|
||||
|
||||
<p className="text-foreground mt-4 max-w-[30ch] text-center">
|
||||
For large organizations that need extra flexibility and control.
|
||||
For companies looking to scale across multiple teams.
|
||||
</p>
|
||||
|
||||
<Link
|
||||
href="https://dub.sh/enterprise"
|
||||
target="_blank"
|
||||
className="mt-6"
|
||||
onClick={() => event('enterprise-contact')}
|
||||
>
|
||||
<Button className="rounded-full text-base">Contact Us</Button>
|
||||
</Link>
|
||||
<Button className="mt-6 rounded-full text-base" asChild>
|
||||
<Link
|
||||
href={`${NEXT_PUBLIC_WEBAPP_URL()}/signup?utm_source=pricing-teams-plan`}
|
||||
target="_blank"
|
||||
>
|
||||
Signup Now
|
||||
</Link>
|
||||
</Button>
|
||||
|
||||
<div className="mt-8 flex w-full flex-col divide-y">
|
||||
<p className="text-foreground py-4 font-medium">Everything in Early Adopters, plus:</p>
|
||||
<p className="text-foreground py-4">Custom Subdomain</p>
|
||||
<p className="text-foreground py-4">Compliance Check</p>
|
||||
<p className="text-foreground py-4">Guaranteed Uptime</p>
|
||||
<p className="text-foreground py-4">Reporting & Analysis</p>
|
||||
<p className="text-foreground py-4">24/7 Support</p>
|
||||
<p className="text-foregro‚und py-4">Unlimited Documents per Month</p>
|
||||
<p className="text-foreground py-4">API Accesss</p>
|
||||
<p className="text-foreground py-4">Email and Discord Support</p>
|
||||
<p className="text-foreground py-4 font-medium">Team Inbox</p>
|
||||
<p className="text-foreground py-4">5 Users Included</p>
|
||||
<p className="text-foreground py-4">Add More Users for $10/ mo.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user