diff --git a/apps/web/src/app/(main)/(landing)/layout.tsx b/apps/web/src/app/(main)/(landing)/layout.tsx index 3a5bdbe..14ffbd0 100644 --- a/apps/web/src/app/(main)/(landing)/layout.tsx +++ b/apps/web/src/app/(main)/(landing)/layout.tsx @@ -1,13 +1,31 @@ -import Navbar from '@/components/landing-sections/navbar' -import React from 'react' +"use client"; + +import React, { Suspense, lazy } from "react"; + +import { Skeleton } from "@/components/ui/skeleton"; + +const Navbar = lazy(() => import("@/components/landing-sections/navbar")); const Layout = ({ children }: { children: React.ReactNode }) => { - return ( -
- - {children} -
- ) -} - -export default Layout \ No newline at end of file + return ( +
+ +
+ + + + +
+ + } + > + +
+ {children} +
+ ); +}; + +export default Layout; \ No newline at end of file diff --git a/apps/web/src/app/(main)/(landing)/page.tsx b/apps/web/src/app/(main)/(landing)/page.tsx index 94caacb..21e4051 100644 --- a/apps/web/src/app/(main)/(landing)/page.tsx +++ b/apps/web/src/app/(main)/(landing)/page.tsx @@ -1,33 +1,166 @@ 'use client' -import Bento from '@/components/landing-sections/Bento' -import Brands from '@/components/landing-sections/Brands' -import CTA from '@/components/landing-sections/CTA' -import Footer from '@/components/landing-sections/footer' -import Hero from '@/components/landing-sections/Hero' -import HowItWorks from '@/components/landing-sections/how-it-works' -import Navbar from '@/components/landing-sections/navbar' -import Testimonials from '@/components/landing-sections/testimonials' -import Video from '@/components/landing-sections/video' -import React from 'react' -import { FaqSection } from '@/components/faq/FaqSection' +import React, { Suspense, lazy } from 'react' + +import { Skeleton } from "@/components/ui/skeleton"; + +const Navbar = lazy(() => import('@/components/landing-sections/navbar')) +const Hero = lazy(() => import('@/components/landing-sections/Hero')) +const Bento = lazy(() => import('@/components/landing-sections/Bento')) +const Video = lazy(() => import('@/components/landing-sections/video')) +const HowItWorks = lazy(() => import('@/components/landing-sections/how-it-works')) +const Brands = lazy(() => import('@/components/landing-sections/Brands')) +const Testimonials = lazy(() => import('@/components/landing-sections/testimonials')) +const FaqSection = lazy(() => import('@/components/faq/FaqSection')) +const CTA = lazy(() => import('@/components/landing-sections/CTA')) +const Footer = lazy(() => import('@/components/landing-sections/footer')) const Landing = () => { return (
- -
- - -
+ } + > + + +
+ +
+ + + + +
+
+ } + > + + + +
+ + + + +
+ + } + > + +
+ +
+ + + + +
+ + } + > +
+ +
+ + + + +
+ + } + > + +
+ +
+ + + + +
+ + } + > + +
+ +
+ + + + +
+ + } + > + +
+ +
+ + + + +
+ + } + > + +
- -
+ +
+ + + + +
+
+ } + > + + + +
+ + + + +
+ + } + > +
) diff --git a/apps/web/src/app/(main)/(landing)/pricing/PricingContent.tsx b/apps/web/src/app/(main)/(landing)/pricing/PricingContent.tsx new file mode 100644 index 0000000..1031a6f --- /dev/null +++ b/apps/web/src/app/(main)/(landing)/pricing/PricingContent.tsx @@ -0,0 +1,480 @@ +"use client"; + +import Footer from "@/components/landing-sections/footer"; +import Header from "@/components/ui/header"; +import PrimaryButton from "@/components/ui/custom-button"; +import { ShineBorder } from "@/components/ui/shine-borders"; +import { motion } from "framer-motion"; +import { Check, CornerDownRight, Target, Terminal } from "lucide-react"; +import Image from "next/image"; +import Link from "next/link"; +import React from "react"; + +const opensoxFeatures = [ + { + id: 1, + title: "Opensox Advanced search tool", + description: + "One and only tool in the market that let you find open source with blizzing speed and scary accuracy. It will have:", + features: [ + "Faster and accurate search of projects", + "Higher accuracy (so that you exactly land on your dream open source project)", + "Advanced filters like, GSOC, YC, funding, hire contributors, trending, niche (like AI, Core ML, Web3, MERN), bounties, and many more.", + ], + }, + { + id: 2, + title: "OX Newsletter", + description: + "A newsletter that keeps you ahead in open source world. It will cover:", + features: [ + "Jobs/internships in opensource projects/companies", + "Funding news", + "What's trending in open source ecosystem", + "Upcoming trends", + "Tips to ace in open source", + "What's happening in open source companies?", + ], + }, + { + id: 3, + title: "30 days Opensox challenge sheet", + description: [ + "A comprehensive sheet of 30+ modules along with detailed videos to give you a clear path to start rocking in open source.", + "It will contain videos, resouces and hand made docs.", + <> + In each of the 30 steps, you will learn, then apply, If stuck, we'll help and then we'll do an + accountability check. + Check here. + + , + ], + features: [], + }, +]; + +const whySub = [ + { + content: + "Currently, Opensox 2.0 is in progress (70% done) so till the launch, we are offering premium plan at a discounted price - $49 for the whole year", + }, + { + content: + "This offer is only available for the first 1000 (20 slots booked) users", + }, + { + content: + "After the launch, this $49 offer be removed and Opensox premium will be around ~ $120 for whole year ($10/mo.)", + }, + { + content: "The price of the dollar is constantly increasing.", + }, +]; + +const freePlanCard = { + whatYouGetImmediately: [ + "Free filters to search projects (tech stack, competition, activity, etc)", + "Access to the general community", + ], + whatYouGetAfterLaunch: [ + "Everything mentioned above", + "30 days opensox challenge sheet", + ], +}; + +const premiumPlanCard = { + whatYouGetImmediately: [ + "Everything in free plan +", + "1:1 session on finding remote jobs and internships in open-source companies.", + "Quick doubts resolution.", + "Personalized guidance for GSoC, LFX, Outreachy, etc", + "Access to premium Slack where you can ask anything anytime.", + "Support to enhance skills for open source", + "GSOC proposal, resume reviews, etc.", + "Upcoming premium features", + ], + whatYouGetAfterLaunch: [ + "Everything mentioned above", + "Advanced tool with premium filters to find open source projects", + "Premium newsletter", + "30 days opensox challenge sheet", + "Upcoming premium features.", + ], +}; + +const PricingContent = () => { + return ( + <> +
+
+
+
+
+ + What is Opensox 2.0? + +
+
+
    + {opensoxFeatures.map((feature, index) => ( + +
    +
    +
    + {index + 1} +
    +

    {feature.title}

    +
    + {Array.isArray(feature.description) ? ( +
    + {feature.description.map((sentence, sentenceIndex) => ( +

    + {sentence} +

    + ))} +
    + ) : ( +

    {feature.description}

    + )} +
    +
    +
      + {feature.features.map((item, featureIndex) => ( +
    • + + {item} +
    • + ))} +
    +
    +
    + ))} +
+
+
+
+
+ + Why should you subscribe to Opensox premium now? + +
+
+
+ {whySub.map((sub, index) => ( + + + {sub.content} + + ))} +
+
+
+
+
+
+ background +
+
+ + +
+
+
+ +
+ For any doubts or queries, feel free to ping us at + + {" "}hi@opensox.ai + +
+
+
+