Compare commits

..

No commits in common. 'f9f3db6a1f46e1437199838752e2daca35539475' and '580818107d36c6f0e14c653e58fd80788b776052' have entirely different histories.

@ -2,7 +2,6 @@
import ThemeToggle from '$lib/components/theme-toggle.svelte' import ThemeToggle from '$lib/components/theme-toggle.svelte'
import { Button } from '$lib/components/ui/button' import { Button } from '$lib/components/ui/button'
import { Separator } from '$lib/components/ui/separator' import { Separator } from '$lib/components/ui/separator'
import { GithubIcon, MailIcon } from 'lucide-svelte'
function scrollIntoView({ target }: { target: any }) { function scrollIntoView({ target }: { target: any }) {
const el = document.querySelector(target.getAttribute('href')) const el = document.querySelector(target.getAttribute('href'))
@ -62,32 +61,17 @@
</li> </li>
<Separator orientation={'vertical'} /> <Separator orientation={'vertical'} />
<li> <li>
<a <a href="mailto:subsonic_module981@slmails.com">Contact</a>
href="mailto:subsonic_module981@slmails.com"
class="flex items-center gap-2">
<MailIcon />
Contact
</a>
</li> </li>
<Separator orientation={'vertical'} /> <Separator orientation={'vertical'} />
<li> <li>
<a <a href="https://kon.sh/AX0LqT-v" target="_blank">
href="https://kon.sh/AX0LqT-v"
target="_blank"
class="flex items-center gap-2">
<GithubIcon />
Report Bugs Report Bugs
</a> </a>
</li> </li>
<Separator orientation={'vertical'} /> <Separator orientation={'vertical'} />
<li> <li>
<a <a href="https://kon.sh/github" target="_blank">GitHub</a>
href="https://kon.sh/github"
target="_blank"
class="flex items-center gap-2">
<GithubIcon />
GitHub
</a>
</li> </li>
</ul> </ul>
</nav> </nav>

@ -1,8 +1,10 @@
<script lang="ts"> <script lang="ts">
import { Button } from '$lib/components/ui/button' import { Button } from '$lib/components/ui/button'
import { Separator } from '$lib/components/ui/separator'
import { import {
Check, Check,
QrCodeIcon, QrCodeIcon,
XIcon,
ChartAreaIcon, ChartAreaIcon,
ExternalLinkIcon, ExternalLinkIcon,
} from 'lucide-svelte' } from 'lucide-svelte'
@ -73,116 +75,120 @@
<div <div
class="flex w-full flex-col items-center gap-10 text-center"> class="flex w-full flex-col items-center gap-10 text-center">
<h2 class="text-4xl font-bold">Pricing</h2> <h2 class="text-4xl font-bold">Pricing</h2>
<p class="max-w-4xl text-center text-xl font-semibold">
Kon.sh only charges for domain & QR customization and longer
click history.
</p>
<div
class="grid w-full flex-col justify-center gap-4 sm:grid-cols-2 lg:grid-cols-3">
<div <div
class="relative flex flex-col gap-8 overflow-hidden rounded-2xl border p-4"> class="grid w-full grid-cols-[repeat(auto-fit,_minmax(450px,_1fr))] gap-4">
<div class="flex flex-col items-start"> <div class="flex gap-8 rounded-lg border p-8">
<h3 class="text-xl font-semibold">Free</h3> <div class="flex w-full flex-col gap-4 text-start">
<p class="text-muted-foreground text-sm"> <h3 class="text-2xl font-bold">Free</h3>
Essentials only. No credit card needed. <p class="text-muted-foreground">
No credit card required.
</p> </p>
<Separator />
<div class="flex flex-col gap-4">
<div class="flex items-center gap-2">
<Check class="text-brand" />
<p>Unlimited Links</p>
</div>
<div class="flex items-center gap-2">
<Check class="text-brand" />
<p>Unlimited Projects</p>
</div> </div>
<div class="flex flex-row items-end gap-2"> <div class="flex items-center gap-2">
<span class="text-4xl font-bold">$0</span> <Check class="text-brand" />
<p>Click history up to 1 month</p>
</div>
</div>
</div>
<div
class="flex w-full flex-col items-center justify-center gap-4 rounded-xl bg-gradient-to-r from-orange-300 to-orange-400 text-start">
<div class="flex items-end gap-2">
<p class="text-3xl font-bold">$0</p>
<span>/month</span> <span>/month</span>
</div> </div>
<Button <Button href="/signup" class="bg-background">
href="/signup"
class="bg-brand hover:bg-brand-hover">
Get Started Get Started
</Button> </Button>
</div>
<ul class="flex flex-col gap-4 font-normal"> </div>
<li class="flex items-center gap-3"> <div class="flex gap-8 rounded-lg border p-8">
<div class="flex w-full flex-col gap-4 text-start">
<h3 class="text-2xl font-bold">Pro</h3>
<p class="text-muted-foreground">
More customizations.
</p>
<Separator />
<div class="flex flex-col gap-4">
<div class="flex items-center gap-2">
<Check class="text-brand" /> <Check class="text-brand" />
<span class="flex">Unlimited Links</span> <p>Everything in free</p>
</li> </div>
<li class="flex items-center gap-3"> <div class="flex items-center gap-2">
<Check class="text-brand" /> <Check class="text-brand" />
<span class="flex">Unlimited Projects</span> <p>5 custom domains</p>
</li> <!-- <Tooltip.Root>
<li class="flex items-center gap-3"> <Tooltip.Trigger class="flex items-center gap-1">
<InfoIcon class="h-4 w-4" />
</Tooltip.Trigger>
<Tooltip.Content>
Additional domains are $3 per domain
</Tooltip.Content>
</Tooltip.Root> -->
</div>
<div class="flex items-center gap-2">
<Check class="text-brand" /> <Check class="text-brand" />
<span class="flex">Click history up to 1 month</span> <p>2 years click history</p>
</li> </div>
</ul> <div class="flex items-center gap-2">
<Check class="text-brand" />
<p>Custom QR Code</p>
</div>
</div> </div>
<div
class="border-brand relative flex flex-col gap-8 overflow-hidden rounded-2xl border-2 p-4">
<div class="flex flex-col items-start">
<h3 class="text-xl font-semibold">Pro</h3>
<p class="text-muted-foreground text-sm">
More customizations.
</p>
</div> </div>
<div class="flex flex-row items-end gap-2"> <div
<span class="text-4xl font-bold">$9</span> class="flex w-full flex-col items-center justify-center gap-4 rounded-xl bg-gradient-to-r from-orange-300 to-orange-400 text-start">
<div class="flex items-end gap-2">
<p class="text-3xl font-bold">$9</p>
<span>/month</span> <span>/month</span>
</div> </div>
<Button <Button
href={`/signup?redirect=${encodeURIComponent( href={`/signup?redirect=${encodeURIComponent(
'/dashboard/billing', '/dashboard/billing',
)}`} )}`}
class="bg-brand hover:bg-brand-hover"> class="bg-background">
Get Started Get Started
</Button> </Button>
</div>
<ul class="flex flex-col gap-4 font-normal"> </div>
<li class="flex items-center gap-3"> <div class="flex gap-8 rounded-lg border p-8">
<Check class="text-brand" /> <div class="flex w-full flex-col gap-4 text-start">
<span class="flex">Everything in free</span> <h3 class="text-2xl font-bold">Free (Self Host)</h3>
</li> <p>No credit card required.</p>
<li class="flex items-center gap-3"> <Separator />
<div class="flex flex-col gap-4">
<div class="flex items-center gap-2">
<Check class="text-brand" /> <Check class="text-brand" />
<span class="flex">5 custom domains</span> <p>Unlimited Links</p>
</li> </div>
<li class="flex items-center gap-3"> <div class="flex items-center gap-2">
<Check class="text-brand" /> <Check class="text-brand" />
<span class="flex">2 years click history</span> <p>Unlimited Projects</p>
</li> </div>
<li class="flex items-center gap-3"> <div class="flex items-center gap-2">
<Check class="text-brand" /> <Check class="text-brand" />
<span class="flex">Custom QR Code</span> <p>Basically No Limits</p>
</li> </div>
</ul>
</div> </div>
<div
class="relative flex flex-col gap-8 overflow-hidden rounded-2xl border p-4">
<div class="flex flex-col items-start">
<h3 class="text-xl font-semibold">Free (Self Host)</h3>
<p class="text-muted-foreground text-sm">
You host on your server.
</p>
</div> </div>
<div class="flex flex-row items-end gap-2"> <div
<span class="text-4xl font-bold">$0</span> class="flex w-full flex-col items-center justify-center gap-4 rounded-xl bg-gradient-to-r from-orange-300 to-orange-400 text-start">
<div class="flex items-end gap-2">
<p class="text-3xl font-bold">$0</p>
<span>/month</span> <span>/month</span>
</div> </div>
<Button <Button href="/signup" class="bg-background">
href="/signup"
class="bg-brand hover:bg-brand-hover">
Get Started Get Started
</Button> </Button>
</div>
<ul class="flex flex-col gap-4 font-normal">
<li class="flex items-center gap-3">
<Check class="text-brand" />
<span class="flex">Unlimited Links</span>
</li>
<li class="flex items-center gap-3">
<Check class="text-brand" />
<span class="flex">Unlimited Projects</span>
</li>
<li class="flex items-center gap-3">
<Check class="text-brand" />
<span class="flex">Basically No Limits</span>
</li>
</ul>
</div> </div>
</div> </div>
</div> </div>

@ -24,7 +24,6 @@
<meta <meta
property="og:url" property="og:url"
content={$page.data.og_url || 'https://app.kon.sh'} /> content={$page.data.og_url || 'https://app.kon.sh'} />
<meta name="twitter:card" content="summary" />
</svelte:head> </svelte:head>
<ModeWatcher /> <ModeWatcher />

@ -3,9 +3,3 @@ Allow: /
User-agent: * User-agent: *
Disallow: /dashboard Disallow: /dashboard
User-agent: *
Disallow: /signup
User-agent: *
Disallow: /login
Loading…
Cancel
Save