Skip to content

Pricing page #2

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
Bhagya-Vishwakarma-20 wants to merge 2 commits into
base: main
Choose a base branch
from
Open

Pricing page #2

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
82677c0
Pricing page
Bhagya-Vishwakarma-20 Sep 19, 2024
212a4d2
Added Pricing component in LandingPage
Bhagya-Vishwakarma-20 Oct 15, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion client/src/components/Footer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import React from 'react'
import { Github, Facebook, Youtube, Twitter, Instagram, Copyright } from 'lucide-react';
import { Github, Facebook, Youtube, Twitter, Instagram} from 'lucide-react';

const Footer = () => {
return (
Expand Down
68 changes: 68 additions & 0 deletions client/src/components/Pricing.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,68 @@
import React from 'react'

const Pricing = () => {
return (
<div>
<div className="bg-black py-24 sm:py-32">
<div className="mx-auto max-w-7xl px-6 lg:px-8">
<div className="mx-auto max-w-2xl sm:text-center">
<h2 className="text-3xl font-bold tracking-tight text-white sm:text-4xl">Simple no-tricks pricing</h2>
<p className="mt-6 text-lg leading-8 text-white">Distinctio et nulla eum soluta et neque labore quibusdam. Saepe et quasi iusto modi velit ut non voluptas in. Explicabo id ut laborum.</p>
</div>
<div className="mx-auto mt-16 max-w-2xl rounded-3xl ring-1 ring-gray-200 sm:mt-20 lg:mx-0 lg:flex lg:max-w-none">
<div className="p-8 sm:p-10 lg:flex-auto">
<h3 className="text-2xl font-bold tracking-tight text-white">Lifetime membership</h3>
<p className="mt-6 text-base leading-7 text-white">Lorem ipsum dolor sit amet consect etur adipisicing elit. Itaque amet indis perferendis blanditiis repellendus etur quidem assumenda.</p>
<div className="mt-10 flex items-center gap-x-4">
<h4 className="flex-none text-sm font-semibold leading-6 text-white">What’s included</h4>
<div className="h-px flex-auto bg-gray-100"></div>
</div>
<ul role="list" className="mt-8 grid grid-cols-1 gap-4 text-sm leading-6 text-white sm:grid-cols-2 sm:gap-6">
<li className="flex gap-x-3">
<svg className="h-6 w-5 flex-none text-white" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
<path fill-rule="evenodd" d="M16.704 4.153a.75.75 0 01.143 1.052l-8 10.5a.75.75 0 01-1.127.075l-4.5-4.5a.75.75 0 011.06-1.06l3.894 3.893 7.48-9.817a.75.75 0 011.05-.143z" clip-rule="evenodd" />
</svg>
Private forum access
</li>
<li className="flex gap-x-3">
<svg className="h-6 w-5 flex-none text-white" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
<path fill-rule="evenodd" d="M16.704 4.153a.75.75 0 01.143 1.052l-8 10.5a.75.75 0 01-1.127.075l-4.5-4.5a.75.75 0 011.06-1.06l3.894 3.893 7.48-9.817a.75.75 0 011.05-.143z" clip-rule="evenodd" />
</svg>
Member resources
</li>
<li className="flex gap-x-3">
<svg className="h-6 w-5 flex-none text-white" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
<path fill-rule="evenodd" d="M16.704 4.153a.75.75 0 01.143 1.052l-8 10.5a.75.75 0 01-1.127.075l-4.5-4.5a.75.75 0 011.06-1.06l3.894 3.893 7.48-9.817a.75.75 0 011.05-.143z" clip-rule="evenodd" />
</svg>
Entry to annual conference
</li>
<li className="flex gap-x-3">
<svg className="h-6 w-5 flex-none text-white" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
<path fill-rule="evenodd" d="M16.704 4.153a.75.75 0 01.143 1.052l-8 10.5a.75.75 0 01-1.127.075l-4.5-4.5a.75.75 0 011.06-1.06l3.894 3.893 7.48-9.817a.75.75 0 011.05-.143z" clip-rule="evenodd" />
</svg>
Official member t-shirt
</li>
</ul>
</div>
<div className="-mt-2 p-2 lg:mt-0 lg:w-full lg:max-w-md lg:flex-shrink-0">
<div className="rounded-2xl bg-gray-50 py-10 text-center ring-1 ring-inset ring-gray-900/5 lg:flex lg:flex-col lg:justify-center lg:py-16">
<div className="mx-auto max-w-xs px-8">
<p className="text-base font-semibold text-gray-600">Pay once, own it forever</p>
<p className="mt-6 flex items-baseline justify-center gap-x-2">
<span className="text-5xl font-bold tracking-tight text-gray-600">$349</span>
<span className="text-sm font-semibold leading-6 tracking-wide text-gray-600">USD</span>
</p>
<a href="#" className="mt-10 block w-full rounded-md bg-indigo-600 px-3 py-2 text-center text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600">Get access</a>
<p className="mt-6 text-xs leading-5 text-gray-600">Invoices and receipts available for easy company reimbursement</p>
</div>
</div>
</div>
</div>
</div>
</div>

</div>
)
}

export default Pricing
11 changes: 10 additions & 1 deletion client/src/pages/LandingPage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import { useNavigate } from 'react-router-dom';
import Navbar from '../components/Navbar';
import Testimonial from '../components/Testimonial';
import FAQ_PART from "../components/FAQ_Part"
import Pricing from '@/components/Pricing';
import Footer from '../components/Footer';

const LandingPage: React.FC = () => {
Expand Down Expand Up @@ -89,7 +90,15 @@ const LandingPage: React.FC = () => {
<div>
<Testimonial/>
</div>
{/* Here Starts The Testimonial SECTION // CAUTION :IT CAN BE SHIFTED PLEASE MOVE THE COMMENTS ALONG WITH THE CODE */}
{/* Here ENDs The Testimonial SECTION // CAUTION :IT CAN BE SHIFTED PLEASE MOVE THE COMMENTS ALONG WITH THE CODE */}



{/* Here Starts The Pricing SECTION // CAUTION :IT CAN BE SHIFTED PLEASE MOVE THE COMMENTS ALONG WITH THE CODE */}
<div>
<Pricing/>
</div>
{/* Here ENDs The Pricing SECTION // CAUTION :IT CAN BE SHIFTED PLEASE MOVE THE COMMENTS ALONG WITH THE CODE */}


{/* Here Starts The FAQ SECTION // CAUTION :IT CAN BE SHIFTED PLEASE MOVE THE COMMENTS ALONG WITH THE CODE */}
Expand Down
1 change: 0 additions & 1 deletion client/src/router.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@ import { createBrowserRouter } from 'react-router-dom';

import App from './App.tsx';
import CSSBattles from './pages/CSSBattles.tsx';

const router = createBrowserRouter([
{
path: '/',
Expand Down
6 changes: 6 additions & 0 deletions package-lock.json
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.