Skip to content

Commit 72db46e

Browse files
committed
update pricing
1 parent 0c08832 commit 72db46e

3 files changed

Lines changed: 36 additions & 36 deletions

File tree

‎apps/codingcatdev/src/routes/(home-partials)/(home-pro-benefits)/HomeProBenefits.svelte‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -12,19 +12,19 @@
1212
</script>
1313

1414
<section class={`bg-primary-200-700-token ${login ? 'rounded-lg' : ''}`}>
15-
<div class="grid justify-center grid-cols-1 px-8 mx-auto gap-2 2xl:gap-10 max-w-7xl relative">
15+
<div class="relative grid justify-center grid-cols-1 gap-2 px-8 mx-auto 2xl:gap-10 max-w-7xl">
1616
<div class="flex">
1717
{#if !login}
18-
<div class="flex flex-col basis-1/12 relative">
18+
<div class="relative flex flex-col basis-1/12">
1919
<GitLineGradient />
2020
<CheckBadgeSvg />
2121
<GitLineGradient rotate={true} />
2222
</div>
2323
{/if}
2424

25-
<div class="basis-11/12 pl-4 sm:pl-2 py-20 sm:py-48">
26-
<div class="flex flex-col lg:flex-row gap-8 items-center">
27-
<div class="sm:basis-2/3 flex flex-col justify-center gap-8">
25+
<div class="py-20 pl-4 basis-11/12 sm:pl-2 sm:py-48">
26+
<div class="flex flex-col items-center gap-8 lg:flex-row">
27+
<div class="flex flex-col justify-center gap-8 sm:basis-2/3">
2828
<div class="flex flex-col gap-4">
2929
{#if priceVisible}
3030
<div class="check-out-text" in:fade={{ delay: 300, duration: 300 }} out:fade>
@@ -79,7 +79,7 @@
7979
</div>
8080
</div>
8181
<div
82-
class="sm:basis-1/3 flex"
82+
class="flex sm:basis-1/3"
8383
use:inView
8484
on:enter={() => (priceVisible = true)}
8585
on:exit={() => (priceVisible = false)}

‎apps/codingcatdev/src/routes/(home-partials)/(home-pro-benefits)/ProSelect.svelte‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -6,25 +6,25 @@
66
export let login = false;
77
</script>
88

9-
<div class="card variant-filled-surface p-8 shadow-lg lg:w-full">
10-
<header class="card-header flex justify-center">
9+
<div class="p-8 shadow-lg card variant-filled-surface lg:w-full">
10+
<header class="flex justify-center card-header">
1111
<RadioGroup hover="hover:variant-ghost-surface" background="bg-surface-600">
1212
<RadioItem bind:group={subscription} name="justify" value={1}>Annual</RadioItem>
1313
<RadioItem bind:group={subscription} name="justify" value={0}>Monthly</RadioItem>
1414
</RadioGroup>
1515
</header>
16-
<section class="p-8 sm:p-20 flex justify-center">
17-
<div class="flex flex-col items-center relative">
16+
<section class="flex justify-center p-8 sm:p-20">
17+
<div class="relative flex flex-col items-center">
1818
{#if subscription}
19-
<div class="absolute text-2xl top-0 left-0">$</div>
20-
<h6 class="!text-9xl !font-medium">48</h6>
19+
<div class="absolute top-0 left-0 text-2xl">$</div>
20+
<h6 class="!text-9xl !font-medium">199</h6>
2121
<div class="mb-6">
22-
<span class="font-medium text-xs">Save $12 compared to monthly</span>
22+
<span class="text-xs font-medium">Save $149 compared to monthly</span>
2323
</div>
2424
{:else}
25-
<div class="absolute text-2xl top-0 left-0">$</div>
26-
<h6 class="!text-9xl !font-medium">5</h6>
27-
<div class="mb-6"><span class="font-medium text-xs">Just $0.17 per day</span></div>
25+
<div class="absolute top-0 left-0 text-2xl">$</div>
26+
<h6 class="!text-9xl !font-medium">29</h6>
27+
<div class="mb-6"><span class="text-xs font-medium">Just $0.79 per day</span></div>
2828
{/if}
2929
</div>
3030
</section>
@@ -39,7 +39,7 @@
3939
<footer class="card-footer">
4040
<div class="flex flex-col items-center gap-8">
4141
<a href="/terms-of-use" class="!text-on-surface-token">Terms & Conditions</a>
42-
<a href="/login?redirectTo=/dashboard" class="btn variant-filled-surface w-full"
42+
<a href="/login?redirectTo=/dashboard" class="w-full btn variant-filled-surface"
4343
>Let's do it!</a
4444
>
4545
</div>

‎apps/codingcatdev/src/routes/(protected)/ProModal.svelte‎

Lines changed: 19 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -54,26 +54,26 @@
5454
const base = 'card p-2 md:p-8 flex flex-col items-center relative w-full hover:bg-opacity-90';
5555
</script>
5656

57-
<div class="card p-2 md:p-8 flex flex-col gap-2 md:gap-8">
58-
<div class="flex flex-col md:grid md:grid-cols-2 gap-2 md:gap-8">
57+
<div class="flex flex-col gap-2 p-2 card md:p-8 md:gap-8">
58+
<div class="flex flex-col gap-2 md:grid md:grid-cols-2 md:gap-8">
5959
<button
6060
class={`${base} ${monthly ? 'variant-filled-primary' : 'variant-soft-primary'}`}
6161
on:click={() => onSelect(true)}
6262
>
6363
{#if monthly}
64-
<div class="absolute top-0 right-0 mr-2 mt-2">
64+
<div class="absolute top-0 right-0 mt-2 mr-2">
6565
<Icon src={CheckCircle} theme="solid" class="w-8" />
6666
</div>
6767
{/if}
68-
<span class="font-medium text-xl">Monthly</span>
68+
<span class="text-xl font-medium">Monthly</span>
6969
<div class="flex flex-row items-end justify-center mt-2">
70-
<span class="text-5xl font-bold">$5</span>
70+
<span class="text-5xl font-bold">$29</span>
7171
<div class="mt-5">
72-
<span class="text-surface-50-900-token font-medium text-xl">/mo</span>
72+
<span class="text-xl font-medium text-surface-50-900-token">/mo</span>
7373
</div>
7474
</div>
7575
<div class="mb-6">
76-
<span class="font-medium text-xs">Just $0.17 per day</span>
76+
<span class="text-xs font-medium">Just $0.79 per day</span>
7777
</div>
7878
<KcPrimary />
7979
</button>
@@ -82,40 +82,40 @@
8282
on:click={() => onSelect(false)}
8383
>
8484
{#if !monthly}
85-
<div class="absolute top-0 right-0 mr-2 mt-2">
85+
<div class="absolute top-0 right-0 mt-2 mr-2">
8686
<Icon src={CheckCircle} theme="solid" class="w-8" />
8787
</div>
8888
{/if}
89-
<span class="font-medium text-xl">Annual</span>
89+
<span class="text-xl font-medium">Annual</span>
9090
<div class="flex flex-row items-end justify-center mt-2">
91-
<span class="text-5xl font-bold">$48</span>
91+
<span class="text-5xl font-bold">$199</span>
9292
<div class="mt-5">
93-
<span class="text-surface-50-900-token font-medium text-xl">/year</span>
93+
<span class="text-xl font-medium text-surface-50-900-token">/year</span>
9494
</div>
9595
</div>
9696
<div class="mb-6">
97-
<span class="font-medium text-xs">Save $12 compared to monthly</span>
97+
<span class="text-xs font-medium">Save $149 compared to monthly</span>
9898
</div>
9999
<AjPrimary />
100100
</button>
101101
</div>
102102
<div>
103-
<div class="card variant-filled-primary p-2 md:p-8">
103+
<div class="p-2 card variant-filled-primary md:p-8">
104104
<h2>Pro</h2>
105105
<ul class="text-left text-md md:text-lg">
106-
<li class="my-2 flex flex-row gap-1 items-center">
106+
<li class="flex flex-row items-center gap-1 my-2">
107107
<Icon src={RocketLaunch} theme="solid" class="w-8" />
108108
Watch all PRO courses
109109
</li>
110-
<li class="my-2 flex flex-row gap-1 items-center">
110+
<li class="flex flex-row items-center gap-1 my-2">
111111
<Icon src={RocketLaunch} theme="solid" class="w-8" />
112112
Join PRO office hours
113113
</li>
114-
<li class="my-2 flex flex-row gap-1 items-center">
114+
<li class="flex flex-row items-center gap-1 my-2">
115115
<Icon src={RocketLaunch} theme="solid" class="w-8" />
116116
Read all PRO posts
117117
</li>
118-
<li class="my-2 flex flex-row gap-1 items-center">
118+
<li class="flex flex-row items-center gap-1 my-2">
119119
<Icon src={PaintBrush} theme="solid" class="w-8" />
120120
Pro Picked Custom Theme
121121
</li>
@@ -124,7 +124,7 @@
124124
</div>
125125

126126
{#if redirecting}
127-
<button class="btn variant-filled-surface flex self-end gap-2">
127+
<button class="flex self-end gap-2 btn variant-filled-surface">
128128
Redirecting
129129
<ProgressRadial
130130
stroke={100}
@@ -135,7 +135,7 @@
135135
</button>
136136
{:else}
137137
<button
138-
class="btn variant-filled-surface flex self-end gap-2"
138+
class="flex self-end gap-2 btn variant-filled-surface"
139139
on:click|once={() => onSubscribe($modalStore[0].meta?.products, $modalStore[0].meta?.uid)}
140140
>
141141
Continue

0 commit comments

Comments
 (0)