Skip to content

Commit 3b4d163

Browse files
zzzzshawnapsinghdev
authored andcommitted
fixes
1 parent b68dad5 commit 3b4d163

File tree

21 files changed

+652
-77
lines changed

21 files changed

+652
-77
lines changed

apps/web/public/assets/card_bg.svg

Lines changed: 52 additions & 0 deletions
Loading

apps/web/public/assets/fluted_bg.svg

Lines changed: 315 additions & 0 deletions
Loading

apps/web/public/assets/layer1.svg

Lines changed: 38 additions & 0 deletions
Loading

apps/web/public/assets/logo.svg

Lines changed: 1 addition & 1 deletion
Loading

apps/web/public/assets/logo_var2.svg

Lines changed: 1 addition & 1 deletion
Loading
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import Navbar from '@/components/landing-sections/navbar'
2+
import React from 'react'
3+
4+
const Layout = ({ children }: { children: React.ReactNode }) => {
5+
return (
6+
<section>
7+
<Navbar />
8+
{children}
9+
</section>
10+
)
11+
}
12+
13+
export default Layout

apps/web/src/app/(main)/(landing)/page.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,8 +14,8 @@ import React from 'react'
1414
const Landing = () => {
1515
return (
1616
<main className='min-h-screen w-full bg-[#101010] text-white font-sans overflow-hidden relative'>
17-
<Navbar/>
18-
<div className="min-h-screen w-full max-w-[2000px] mx-auto border-x border-[#202020] overflow-hidden">
17+
<Navbar />
18+
<div className="min-h-screen w-full max-w-[2000px] mx-auto border-x border-[#252525] overflow-hidden">
1919
<Hero />
2020
<Bento />
2121
<Video />
Lines changed: 92 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,92 @@
1+
import PrimaryButton from '@/components/ui/custom-button'
2+
import { FlickeringGrid } from '@/components/ui/flickering-grid'
3+
import { ShineBorder } from '@/components/ui/shine-borders'
4+
import { Check } from 'lucide-react'
5+
import Image from 'next/image'
6+
import React from 'react'
7+
8+
const Pricing = () => {
9+
return (
10+
<main className="w-full overflow-hidden flex flex-col items-center justify-center relative">
11+
<div className="px-[30px] py-10 h-[100px] lg:h-[140px] relative overflow-hidden border-b border-[#252525] w-full">
12+
<h4 className='font-medium text-3xl lg:text-5xl tracking-tight absolute left-1/2 -translate-x-1/2 top-1/2 -translate-y-1/2 z-30 text-center text-balance'>Pricing</h4>
13+
<div
14+
style={{
15+
background: 'radial-gradient(circle at center, #101010 30%, transparent 100%)',
16+
}}
17+
className=" h-full w-[100%] right-0 top-0 z-20 absolute"></div>
18+
<div className="absolute right-0 w-[100%] h-full top-0 z-10 opacity-50">
19+
<FlickeringGrid
20+
className="absolute -z-0 top-0 right-0"
21+
squareSize={3}
22+
gridGap={6}
23+
color="#3F1FBC"
24+
maxOpacity={1}
25+
flickerChance={0.1}
26+
height={200}
27+
width={2000}
28+
/>
29+
</div>
30+
</div>
31+
<div className="flex flex-col gap-5 lg:gap-10 py-4 bg-[#151515]/20 backdrop-blur-xl h-full relative w-full px-4 lg:px-10">
32+
<Image
33+
src="/assets/layer1.svg"
34+
alt='background'
35+
fill
36+
className="object-cover object-bottom w-full h-full absolute -z-10 opacity-95"
37+
/>
38+
<div className="py-2">
39+
<div className=" border-border-primary w-full mx-auto flex">
40+
<div className="border-dashed border-border-primary w-full lg:w-max mx-auto relative">
41+
<div className="lg:h-[620px] w-full lg:w-[500px] relative overflow-hidden mx-auto py-10 pb-14">
42+
<ShineBorder shineColor={["#7150E7", "#C89BFF", "#432BA0"]} />
43+
<Image
44+
src="/assets/card_bg.svg"
45+
alt='background'
46+
fill
47+
className="object-cover object-bottom w-full h-full absolute -z-10"
48+
/>
49+
<div className="w-full border-dashed border-border-primary px-10 pb-4">
50+
<div className="w-12 h-12 relative">
51+
<Image
52+
src="/assets/logo_var2.svg"
53+
alt='background'
54+
fill
55+
className="object-cover size-full"
56+
/>
57+
</div>
58+
</div>
59+
60+
<div className="w-full border-dashed border-border-primary px-10 py-4">
61+
<h2 className='text-6xl lg:text-[90px] lg:leading-[82px] tracking-tight font-semibold'>$20</h2>
62+
</div>
63+
<div className="w-full border-dashed border-border-primary px-10 py-4 ">
64+
<h2 className='text-xl lg:text-2xl tracking-tight text-left font-bold'>Early Access Lifetime Plan</h2>
65+
</div>
66+
<div className="w-full border-dashed border-border-primary px-10 py-4 flex flex-col gap-4">
67+
<h2 className='text-lg lg:text-xl tracking-tight text-left font-bold'>WHAT YOU GET:</h2>
68+
<div className="space-y-1 [&>p]:flex [&>p]:items-center [&>p]:gap-2 [&>p]:font-semibold">
69+
<p ><Check className='w-5' strokeWidth={4} /> A beast mode search</p>
70+
<p ><Check className='w-5' strokeWidth={4} /> Newsletter</p>
71+
<p ><Check className='w-5' strokeWidth={4} /> Exclusive community</p>
72+
<p ><Check className='w-5' strokeWidth={4} /> 1:1 mentorship</p>
73+
<p ><Check className='w-5' strokeWidth={4} /> Any premium tools</p>
74+
</div>
75+
</div>
76+
<div className="bg-white mix-blend-plus-lighter absolute h-[100px] w-full blur-[50px] right-0 -bottom-20"></div>
77+
</div>
78+
</div>
79+
</div>
80+
<div className="w-full border-dashed border-border-primary pt-2 ">
81+
<PrimaryButton classname='w-full max-w-[500px] mx-auto'>Buy Now</PrimaryButton>
82+
</div>
83+
</div>
84+
85+
86+
87+
</div>
88+
</main>
89+
)
90+
}
91+
92+
export default Pricing

apps/web/src/app/(main)/pricing/page.tsx

Lines changed: 0 additions & 13 deletions
This file was deleted.

apps/web/src/components/landing-sections/Bento.tsx

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,7 @@ notifications = Array.from({ length: 10 }, () => notifications).flat();
4242
const Bento = () => {
4343
return (
4444
<div id='features' className="flex flex-col w-full">
45-
<div className="px-[30px] py-10 h-[160px] relative overflow-hidden border-b border-[#202020] ">
45+
<div className="px-[30px] py-10 h-[160px] relative overflow-hidden border-b border-[#252525] ">
4646
<motion.h4
4747
initial={{ opacity: 0, y: 30, filter: 'blur(10px)' }}
4848
animate={{ opacity: 1, y: 0, filter: 'blur(0px)' }}
@@ -67,9 +67,9 @@ const Bento = () => {
6767
/>
6868
</div>
6969
</div>
70-
<div className="w-full border-b border-[#202020] flex flex-col lg:flex-row overflow-hidden">
71-
<div className="lg:w-1/3 border-b lg:border-b-0 lg:border-r border-[#202020] lg:aspect-square relative overflow-hidden p-2 flex-shrink-0 space-y-1 h-[400px] lg:h-full ">
72-
<div className="border border-dashed border-[#202020] w-full h-full relative overflow-hidden p-[30px] flex-shrink-0 flex flex-col gap-4 lg:gap-0 ">
70+
<div className="w-full border-b border-[#252525] flex flex-col lg:flex-row overflow-hidden">
71+
<div className="lg:w-1/3 border-b lg:border-b-0 lg:border-r border-[#252525] lg:aspect-square relative overflow-hidden p-2 flex-shrink-0 space-y-1 h-[400px] lg:h-full ">
72+
<div className="border border-dashed border-[#252525] w-full h-full relative overflow-hidden p-[30px] flex-shrink-0 flex flex-col gap-4 lg:gap-0 ">
7373
<div className="space-y-1 flex-shrink-0 z-10">
7474
<motion.h5
7575
initial={{ opacity: 0, y: 30, filter: 'blur(10px)' }}
@@ -104,8 +104,8 @@ const Bento = () => {
104104
<div className="h-[90px] absolute left-1/2 -translate-x-1/2 -bottom-7 w-full bg-[#101010] blur-[15px] z-20"></div>
105105
</div>
106106
</div>
107-
<div className="border-b lg:border-b-0 lg:border-r border-[#202020] lg:w-1/3 lg:aspect-square relative overflow-hidden p-2 flex-shrink-0 space-y-1 h-[400px] lg:h-full">
108-
<div className="border border-dashed border-[#202020] w-full h-full relative overflow-hidden p-[30px] flex-shrink-0 space-y-1 flex flex-col items-center justify-start gap-4 z-10">
107+
<div className="border-b lg:border-b-0 lg:border-r border-[#252525] lg:w-1/3 lg:aspect-square relative overflow-hidden p-2 flex-shrink-0 space-y-1 h-[400px] lg:h-full">
108+
<div className="border border-dashed border-[#252525] w-full h-full relative overflow-hidden p-[30px] flex-shrink-0 space-y-1 flex flex-col items-center justify-start gap-4 z-10">
109109
<div className="w-full z-10">
110110
<motion.h5
111111
initial={{ opacity: 0, y: 30, filter: 'blur(10px)' }}
@@ -137,7 +137,7 @@ const Bento = () => {
137137
</div>
138138
</div>
139139
<div className="lg:w-1/3 lg:aspect-square relative overflow-hidden p-2 flex-shrink-0 space-y-1 h-[400px] lg:h-full">
140-
<div className="border border-dashed border-[#202020] w-full h-full relative overflow-hidden p-[30px] flex-shrink-0 flex flex-col gap-4 lg:gap-0 ">
140+
<div className="border border-dashed border-[#252525] w-full h-full relative overflow-hidden p-[30px] flex-shrink-0 flex flex-col gap-4 lg:gap-0 ">
141141
<div className="space-y-1 flex-shrink-0 z-10">
142142
<motion.h5
143143
initial={{ opacity: 0, y: 30, filter: 'blur(10px)' }}

0 commit comments

Comments
 (0)