- Interactive slider for 50–10,000 members - Real prices from SEWOBE, easyVerein, ClubDesk, WISO MeinVerein - Bar chart comparing monthly/yearly costs - Savings callout showing annual savings vs most expensive competitor - Feature comparison table (Verband, Website, Kurse, SEPA, Support, etc.) - SEWOBE Verband warning for 1000+ members - Uses shadcn/ui components (Card, Badge, Button, Table) - CTA linking to sign-up - 4 tiers: Starter (29€), Pro (59€), Verband (199€), Enterprise (349€)
45 lines
1.1 KiB
TypeScript
45 lines
1.1 KiB
TypeScript
import { getTranslations } from 'next-intl/server';
|
|
|
|
import { PricingTable } from '@kit/billing-gateway/marketing';
|
|
|
|
import { SitePageHeader } from '~/(marketing)/_components/site-page-header';
|
|
import billingConfig from '~/config/billing.config';
|
|
import pathsConfig from '~/config/paths.config';
|
|
|
|
import { PricingCalculator } from './_components/pricing-calculator';
|
|
|
|
export const generateMetadata = async () => {
|
|
const t = await getTranslations('marketing');
|
|
|
|
return {
|
|
title: t('pricing'),
|
|
};
|
|
};
|
|
|
|
const paths = {
|
|
signUp: pathsConfig.auth.signUp,
|
|
return: pathsConfig.app.home,
|
|
};
|
|
|
|
async function PricingPage() {
|
|
const t = await getTranslations('marketing');
|
|
|
|
return (
|
|
<div className={'flex flex-col space-y-16'}>
|
|
<SitePageHeader title={t('pricing')} subtitle={t('pricingSubtitle')} />
|
|
|
|
{/* Pricing tiers */}
|
|
<div className={'container mx-auto'}>
|
|
<PricingTable paths={paths} config={billingConfig} />
|
|
</div>
|
|
|
|
{/* Price comparison calculator */}
|
|
<div className={'container mx-auto pb-8 xl:pb-16'}>
|
|
<PricingCalculator />
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default PricingPage;
|