mirror of
https://github.com/Litlyx/litlyx
synced 2025-12-10 07:48:37 +01:00
283 lines
9.4 KiB
Vue
283 lines
9.4 KiB
Vue
<script setup lang="ts">
|
||
|
||
import type { PricingCardProp } from '~/components/pricing/PricingCardGeneric.vue';
|
||
|
||
|
||
definePageMeta({ layout: 'header' });
|
||
|
||
|
||
const freePricing: PricingCardProp[] = [
|
||
{
|
||
title: 'Free',
|
||
price: '€0 / mo',
|
||
subs: [
|
||
'Up to 5000 visits/events per month',
|
||
'CPM 0€ per visit/event'
|
||
],
|
||
features: [
|
||
'Email support',
|
||
'Unlimited domains',
|
||
'Unlimited reports',
|
||
'AI Tokens: 10',
|
||
'Server type: SHARED',
|
||
'Projects: max 2',
|
||
'Data retention: 2 Months'
|
||
],
|
||
cta: 'Start For Free now!'
|
||
},
|
||
]
|
||
|
||
const customPricing: PricingCardProp[] = [
|
||
{
|
||
title: 'Enterprise',
|
||
price: 'Custom',
|
||
subs: [
|
||
'Unlimited visits/events per month',
|
||
'Service Tailor-made on needs'
|
||
],
|
||
features: [
|
||
'Priority support',
|
||
'Server type: DEDICATED',
|
||
'DB instance: DEDICATED',
|
||
'Dedicated operator',
|
||
'White label',
|
||
'Custom Charts',
|
||
'Custom Data Aggregation'
|
||
],
|
||
cta: 'Let\'s Talk!',
|
||
link: 'mailto:help@litlyx.com'
|
||
}
|
||
]
|
||
|
||
const slidePricings: PricingCardProp[] = [
|
||
{
|
||
title: 'Incubation',
|
||
price: '€4,99 / mo',
|
||
subs: [
|
||
'Up to 50.000 visits/events per month',
|
||
'CPM 0,10€ per visit/event'
|
||
],
|
||
features: [
|
||
'Discord support',
|
||
'Unlimited domains',
|
||
'Unlimited reports',
|
||
'AI Tokens: 30',
|
||
'Server type: SHARED',
|
||
'Projects: max 3',
|
||
'Data retention: 6 Months'
|
||
],
|
||
cta: 'Go to Cloud Dashboard'
|
||
},
|
||
{
|
||
title: 'Acceleration',
|
||
price: '€9,99 / mo',
|
||
subs: [
|
||
'Up to 150.000 visits/events per month',
|
||
'CPM 0,06€ per visit/event'
|
||
],
|
||
features: [
|
||
'Discord support',
|
||
'Unlimited domains',
|
||
'Unlimited reports',
|
||
'AI Tokens: 100',
|
||
'Server type: SHARED',
|
||
'Projects: max 3',
|
||
'Data retention: 9 Months'
|
||
],
|
||
cta: 'Go to Cloud Dashboard'
|
||
},
|
||
{
|
||
title: 'Growth',
|
||
price: '€29,99 / mo',
|
||
subs: [
|
||
'Up to 500.000 visits/events per month',
|
||
'CPM 0,059€ per visit/event'
|
||
],
|
||
features: [
|
||
'Discord support',
|
||
'Unlimited domains',
|
||
'Unlimited reports',
|
||
'AI Tokens: 3.000',
|
||
'Server type: SHARED',
|
||
'Projects: max 3',
|
||
'Data retention: 1 Year'
|
||
],
|
||
cta: 'Go to Cloud Dashboard'
|
||
},
|
||
{
|
||
title: 'Expansion',
|
||
price: '€59,99 / mo',
|
||
subs: [
|
||
'Up to 1.000.000 visits/events per month',
|
||
'CPM 0,059€ per visit/event'
|
||
],
|
||
features: [
|
||
'Discord support',
|
||
'Unlimited domains',
|
||
'Unlimited reports',
|
||
'AI Tokens: 5.000',
|
||
'Server type: SHARED',
|
||
'Projects: max 3',
|
||
'Data retention: 1 Year'
|
||
],
|
||
cta: 'Go to Cloud Dashboard'
|
||
},
|
||
{
|
||
title: 'Scaling',
|
||
price: '€99,99 / mo',
|
||
subs: [
|
||
'Up to 2.500.000 visits/events per month',
|
||
'CPM 0,039€ per visit/event'
|
||
],
|
||
features: [
|
||
'Discord support',
|
||
'Unlimited domains',
|
||
'Unlimited reports',
|
||
'AI Tokens: 10.000',
|
||
'Server type: DEDICATED',
|
||
'Projects: max 3',
|
||
'Data retention: 2 Years'
|
||
],
|
||
cta: 'Go to Cloud Dashboard'
|
||
},
|
||
{
|
||
title: 'Unicorn',
|
||
price: '€149,99 / mo',
|
||
subs: [
|
||
'Up to 5.000.000 visits/events per month',
|
||
'CPM 0,029€ per visit/event'
|
||
],
|
||
features: [
|
||
'Discord support',
|
||
'Unlimited domains',
|
||
'Unlimited reports',
|
||
'AI Tokens: 20.000',
|
||
'Server type: DEDICATED',
|
||
'Projects: max 3',
|
||
'Data retention: 3 Years'
|
||
],
|
||
cta: 'Go to Cloud Dashboard'
|
||
}
|
||
]
|
||
|
||
|
||
|
||
</script>
|
||
|
||
|
||
<template>
|
||
|
||
<div class="home h-full w-full min-h-[40dvh]">
|
||
|
||
<div class="text-center mt-8">
|
||
<div class="poppins text-4xl mb-4 font-medium">
|
||
Pricing
|
||
</div>
|
||
<div class="poppins text-2xl mb-4 font-normal text-white/80">
|
||
Start for Free and scale as you go
|
||
</div>
|
||
</div>
|
||
|
||
<div class="p-8">
|
||
|
||
<div class="flex gap-12 h-max flex-col lg:flex-row justify-center">
|
||
<PricingCardGeneric :datas="freePricing">
|
||
</PricingCardGeneric>
|
||
<PricingCardGeneric :datas="slidePricings">
|
||
</PricingCardGeneric>
|
||
<PricingCardGeneric :datas="customPricing">
|
||
</PricingCardGeneric>
|
||
</div>
|
||
|
||
<!-- <div class="flex gap-8 h-max flex-col lg:flex-row">
|
||
<PricingCard class="flex-1" :data="starterTierCardData"></PricingCard>
|
||
<PricingCard class="flex-1" :data="accelerationTierCardData"></PricingCard>
|
||
<PricingCard class="flex-1" :data="expansionTierCardData"></PricingCard>
|
||
</div>
|
||
|
||
<div class="flex justify-between items-center md:flex-row flex-col mt-10">
|
||
<div class="flex flex-col gap-2">
|
||
<div class="poppins text-[2rem] font-semibold">
|
||
Book a demo!
|
||
</div>
|
||
<div class="poppins text-[1.2rem] text-text/90">
|
||
Take a slot & talk with <span class="text-accent font-semibold "> Antonio | CEO at
|
||
Litlyx.</span>
|
||
</div>
|
||
</div>
|
||
<div class="w-full lg:w-fit flex justify-center mt-10">
|
||
<div class="bg-[#303030] rounded-lg py-4 w-full text-center lg:px-20">
|
||
<a href="https://cal.com/litlyx/15min" target="_blank" class="poppins text-[1.3rem]">
|
||
Schedule now!
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div> -->
|
||
|
||
<!-- <div class="flex justify-between items-center mt-10">
|
||
<div class="flex flex-col gap-2">
|
||
<div class="poppins text-[2rem] font-semibold">
|
||
Do you need help ?
|
||
</div>
|
||
<div class="poppins text-[1.2rem] text-text/90">
|
||
We respond in max. 1-2 days
|
||
</div>
|
||
</div>
|
||
<div class="py-4 px-20 bg-[#303030] rounded-lg">
|
||
<a href="mailto:help@litlyx.com" class="poppins text-[1.3rem]">
|
||
help@litlyx.com
|
||
</a>
|
||
</div>
|
||
</div> -->
|
||
</div>
|
||
|
||
|
||
<div class="px-8 mt-8 flex flex-col items-center">
|
||
<div class="poppins text-4xl mb-4 font-medium">
|
||
Frequently Asked Questions
|
||
</div>
|
||
<div class="w-full">
|
||
<UAccordion :ui="{
|
||
wrapper: 'w-full',
|
||
item: {
|
||
padding: 'pl-8'
|
||
}
|
||
}" color="white" variant="ghost" size="xl" :items="[
|
||
{
|
||
label: 'Is Litlyx free?',
|
||
content: 'We offer a free-forever plan with a 5k/mo limit and 2 months of data retention. We offer plans that grow with you.'
|
||
},
|
||
{
|
||
label: 'What does \'Data Retention\' mean?',
|
||
content: 'It is the duration your data is available in our database. After the data retention period expires, you will be notified via e-mail. You have 14 days to upgrade to a new plan. If not upgraded, we will start deleting data one day at a time to make space for new data.'
|
||
},
|
||
{
|
||
label: 'Can I export my data?',
|
||
content: 'Yes! We provide access to raw data, allowing you to download a CSV file and use your data as you wish. It’s always yours!'
|
||
},
|
||
{
|
||
label: 'Is the data collected privacy-focused?',
|
||
content: 'Yes! All data we collect is anonymous. We have our own tracking system. You can find more details in our Data Policy.'
|
||
},
|
||
{
|
||
label: 'Can I self-host Litlyx?',
|
||
content: 'Yes! You can self-host your own instance of Litlyx. More information is available on docs.'
|
||
},
|
||
{
|
||
label: 'If I don\'t pay and want to stay on the free tier forever, can I?',
|
||
content: 'Yes, you can! You can collect up to 2 months\' worth of data. We offer flexible plans so you can find one that fits your needs.'
|
||
},
|
||
{
|
||
label: 'Did this FAQ help you?',
|
||
content: 'If you have any more questions or need further clarification, please contact us at help@litlyx.com.'
|
||
}
|
||
|
||
]">
|
||
</UAccordion>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
</template>
|