TZGyn
/
kon.sh
mirror of https://github.com/TZGyn/shortener
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Compare commits

base: TZGyn:580818107d36c6f0e14c653e58fd80788b776052
Branches Tags
TZGyn:main
..
compare: TZGyn:f9f3db6a1f46e1437199838752e2daca35539475
Branches Tags
TZGyn:main

3 Commits
580818107d ... f9f3db6a1f

Author SHA1 Message Date
TZGyn f9f3db6a1f
update pricing table layout 1 year ago
TZGyn a2639c6f89
add icons to footer 1 year ago
TZGyn 099a759ef1
improve seo 1 year ago
4 changed files with 124 additions and 107 deletions
Show Stats

22
frontend/src/routes/(public)/(landing)/+layout.svelte
Unescape Escape View File

@ -2,6 +2,7 @@
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'))
@ -61,17 +62,32 @@
</li> </li>
<Separator orientation={'vertical'} /> <Separator orientation={'vertical'} />
<li> <li>
<a href="mailto:subsonic_module981@slmails.com">Contact</a> <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 href="https://kon.sh/AX0LqT-v" target="_blank"> <a
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 href="https://kon.sh/github" target="_blank">GitHub</a> <a
href="https://kon.sh/github"
target="_blank"
class="flex items-center gap-2">
<GithubIcon />
GitHub
</a>
</li> </li>
</ul> </ul>
</nav> </nav>

168
frontend/src/routes/(public)/(landing)/+page.svelte
Unescape Escape View File

@ -1,10 +1,8 @@
<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'
@ -75,120 +73,116 @@
<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 <div
class="grid w-full grid-cols-[repeat(auto-fit,_minmax(450px,_1fr))] gap-4"> class="grid w-full flex-col justify-center gap-4 sm:grid-cols-2 lg:grid-cols-3">
<div class="flex gap-8 rounded-lg border p-8"> <div
<div class="flex w-full flex-col gap-4 text-start"> class="relative flex flex-col gap-8 overflow-hidden rounded-2xl border p-4">
<h3 class="text-2xl font-bold">Free</h3> <div class="flex flex-col items-start">
<p class="text-muted-foreground"> <h3 class="text-xl font-semibold">Free</h3>
No credit card required. <p class="text-muted-foreground text-sm">
Essentials only. No credit card needed.
</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 items-center gap-2"> <div class="flex flex-row items-end gap-2">
<Check class="text-brand" /> <span class="text-4xl font-bold">$0</span>
<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 href="/signup" class="bg-background"> <Button
href="/signup"
class="bg-brand hover:bg-brand-hover">
Get Started Get Started
</Button> </Button>
</div>
</div> <ul class="flex flex-col gap-4 font-normal">
<div class="flex gap-8 rounded-lg border p-8"> <li class="flex items-center gap-3">
<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" />
<p>Everything in free</p> <span class="flex">Unlimited Links</span>
</div> </li>
<div class="flex items-center gap-2"> <li class="flex items-center gap-3">
<Check class="text-brand" /> <Check class="text-brand" />
<p>5 custom domains</p> <span class="flex">Unlimited Projects</span>
<!-- <Tooltip.Root> </li>
<Tooltip.Trigger class="flex items-center gap-1"> <li class="flex items-center gap-3">
<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" />
<p>2 years click history</p> <span class="flex">Click history up to 1 month</span>
</div> </li>
<div class="flex items-center gap-2"> </ul>
<Check class="text-brand" />
<p>Custom QR Code</p>
</div>
</div>
</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"> class="border-brand relative flex flex-col gap-8 overflow-hidden rounded-2xl border-2 p-4">
<div class="flex items-end gap-2"> <div class="flex flex-col items-start">
<p class="text-3xl font-bold">$9</p> <h3 class="text-xl font-semibold">Pro</h3>
<p class="text-muted-foreground text-sm">
More customizations.
</p>
</div>
<div class="flex flex-row items-end gap-2">
<span class="text-4xl font-bold">$9</span>
<span>/ month</span> <span>/ month</span>
</div> </div>
<Button <Button
href={`/signup?redirect=${encodeURIComponent( href={`/signup?redirect=${encodeURIComponent(
'/dashboard/billing', '/dashboard/billing',
)}`} )}`}
class="bg-background"> class="bg-brand hover:bg-brand-hover">
Get Started Get Started
</Button> </Button>
</div>
</div> <ul class="flex flex-col gap-4 font-normal">
<div class="flex gap-8 rounded-lg border p-8"> <li class="flex items-center gap-3">
<div class="flex w-full flex-col gap-4 text-start">
<h3 class="text-2xl font-bold">Free (Self Host)</h3>
<p>No credit card required.</p>
<Separator />
<div class="flex flex-col gap-4">
<div class="flex items-center gap-2">
<Check class="text-brand" /> <Check class="text-brand" />
<p>Unlimited Links</p> <span class="flex">Everything in free</span>
</div> </li>
<div class="flex items-center gap-2"> <li class="flex items-center gap-3">
<Check class="text-brand" /> <Check class="text-brand" />
<p>Unlimited Projects</p> <span class="flex">5 custom domains</span>
</div> </li>
<div class="flex items-center gap-2"> <li class="flex items-center gap-3">
<Check class="text-brand" /> <Check class="text-brand" />
<p>Basically No Limits</p> <span class="flex">2 years click history</span>
</div> </li>
</div> <li class="flex items-center gap-3">
<Check class="text-brand" />
<span class="flex">Custom QR Code</span>
</li>
</ul>
</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"> class="relative flex flex-col gap-8 overflow-hidden rounded-2xl border p-4">
<div class="flex items-end gap-2"> <div class="flex flex-col items-start">
<p class="text-3xl font-bold">$0</p> <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 class="flex flex-row items-end gap-2">
<span class="text-4xl font-bold">$0</span>
<span>/ month</span> <span>/ month</span>
</div> </div>
<Button href="/signup" class="bg-background"> <Button
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>

1
frontend/src/routes/+layout.svelte
Unescape Escape View File

@ -24,6 +24,7 @@
<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 />

6
frontend/static/robots.txt
Unescape Escape View File

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