Include a pricing widget on sass page

This commit is contained in:
widgeter
2023-08-16 21:47:04 +02:00
parent b34b64104e
commit c4b17c61b5
2 changed files with 83 additions and 39 deletions

View File

@ -7,6 +7,7 @@ import Features from '~/components/widgets/Features.astro';
import Steps2 from '~/components/widgets/Steps2.astro';
import Content from '~/components/widgets/Content.astro';
import CallToAction from '~/components/widgets/CallToAction.astro';
import Pricing from '~/components/widgets/Pricing.astro';
import { headerData } from '~/navigation';
@ -216,6 +217,49 @@ const metadata = {
</Fragment>
</Content>
<!-- Pricing Widget ******************* -->
<Pricing
title="Flexible pricing plans for AstroWind"
prices={[
{
title: 'free',
subtitle: 'Access to core features and a wide range of templates',
price: '0',
period: '/ month',
callToAction: {
targetBlank: true,
text: 'Get Started for Free',
href: '#',
},
},
{
title: 'pro',
subtitle: 'Premium templates and advanced customization',
price: 15,
period: '/ Month',
callToAction: {
targetBlank: true,
text: 'Upgrade to Pro',
href: '#',
},
hasRibbon: true,
ribbonTitle: 'popular',
},
{
title: 'Enterprise',
subtitle: 'Tailored solutions for large-scale projects',
price: 45,
period: '/ Month',
callToAction: {
targetBlank: true,
text: 'Unlock Enterprise Features',
href: '#',
},
},
]}
/>
<!-- Steps2 Widget ****************** -->
<Steps2

View File

@ -110,46 +110,46 @@ const metadata = {
]}
/>
<!-- Features3 Widget ************** -->
<!-- Features3 Widget ************** -->
<Features3
title="Price-related features"
subtitle="Discover the advantages of choosing our plans"
columns={2}
items={[
{
title: 'Tiered Pricing Plans',
description: 'Choose from a range of pricing plans designed to accommodate different budgets and requirements.',
icon: 'tabler:stairs',
},
{
title: 'Transparent Pricing',
description: 'Clearly displayed pricing details for each plan, with no hidden costs or unexpected charges.',
icon: 'tabler:flip-vertical',
},
{
title: 'Secure Payment Methods',
description: 'Secure payment gateways to protect your financial information during transactions.',
icon: 'tabler:shield-lock',
},
{
title: 'Instant Access',
description: `Immediate access to your chosen plan's features and templates upon subscription.`,
icon: 'tabler:accessible',
},
{
title: 'Upgrade Value',
description: 'Upgrade to higher-tier plans to unlock more features and benefits for an enhanced experience.',
icon: 'tabler:chevrons-up',
},
{
title: '24H support',
description: 'Questions answered via live chat, email or phone, every calendar day.',
icon: 'tabler:headset',
},
]}
classes={{ container: "max-w-5xl"}}
/>
<Features3
title="Price-related features"
subtitle="Discover the advantages of choosing our plans"
columns={2}
items={[
{
title: 'Tiered Pricing Plans',
description: 'Choose from a range of pricing plans designed to accommodate different budgets and requirements.',
icon: 'tabler:stairs',
},
{
title: 'Transparent Pricing',
description: 'Clearly displayed pricing details for each plan, with no hidden costs or unexpected charges.',
icon: 'tabler:flip-vertical',
},
{
title: 'Secure Payment Methods',
description: 'Secure payment gateways to protect your financial information during transactions.',
icon: 'tabler:shield-lock',
},
{
title: 'Instant Access',
description: `Immediate access to your chosen plan's features and templates upon subscription.`,
icon: 'tabler:accessible',
},
{
title: 'Upgrade Value',
description: 'Upgrade to higher-tier plans to unlock more features and benefits for an enhanced experience.',
icon: 'tabler:chevrons-up',
},
{
title: '24H support',
description: 'Questions answered via live chat, email or phone, every calendar day.',
icon: 'tabler:headset',
},
]}
classes={{ container: 'max-w-5xl' }}
/>
<!-- Steps Widget ****************** -->