Skip to content

Commit

Permalink
Add portals and sponsorship
Browse files Browse the repository at this point in the history
  • Loading branch information
AmirAgassi committed Dec 13, 2024
1 parent da58b02 commit df88a6e
Show file tree
Hide file tree
Showing 7 changed files with 212 additions and 48 deletions.
1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@
"react-countup": "^6.5.3",
"react-dom": "^18.3.1",
"react-icons": "^5.4.0",
"react-router-dom": "^7.0.2",
"three": "^0.171.0"
},
"devDependencies": {
Expand Down
57 changes: 57 additions & 0 deletions pnpm-lock.yaml

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

Binary file added public/sponsorship_package.pdf
Binary file not shown.
59 changes: 35 additions & 24 deletions src/App.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -6,33 +6,44 @@ import { Sponsors } from './components/sections/Sponsors'
import { Speakers } from './components/sections/Speakers'
import { FAQ } from './components/sections/FAQ'
import { Contact } from './components/sections/Contact'
import { IncubationPortal } from './components/sections/IncubationPortal'
import { RecruitmentPortal } from './components/sections/RecruitmentPortal'
import { BrowserRouter as Router, Routes, Route } from 'react-router-dom'

function App() {
return (
<div className="min-h-screen">
<Navigation />
<div>
<Hero />
</div>
<div className="pt-5 bg-[rgb(var(--color-background))]">
<About />
</div>
<div className="pt-5 bg-[rgb(var(--color-background))]">
<Timeline />
</div>
<div className="pt-5 bg-[rgb(var(--color-background))]">
<Sponsors />
</div>
<div className="pt-5 bg-[rgb(var(--color-background))]">
<Speakers />
</div>
<div className="pt-5 bg-[rgb(var(--color-background))]">
<FAQ />
</div>
<div className="pt-5 pb-20 bg-[rgb(var(--color-background))]">
<Contact />
</div>
</div>
<Router>
<Routes>
<Route path="/incubation" element={<IncubationPortal />} />
<Route path="/recruitment" element={<RecruitmentPortal />} />
<Route path="/" element={
<div className="min-h-screen">
<Navigation />
<div>
<Hero />
</div>
<div className="pt-5 bg-[rgb(var(--color-background))]">
<About />
</div>
<div className="pt-5 bg-[rgb(var(--color-background))]">
<Timeline />
</div>
<div className="pt-5 bg-[rgb(var(--color-background))]">
<Sponsors />
</div>
<div className="pt-5 bg-[rgb(var(--color-background))]">
<Speakers />
</div>
<div className="pt-5 bg-[rgb(var(--color-background))]">
<FAQ />
</div>
<div className="pt-5 pb-20 bg-[rgb(var(--color-background))]">
<Contact />
</div>
</div>
} />
</Routes>
</Router>
)
}

Expand Down
27 changes: 27 additions & 0 deletions src/components/sections/IncubationPortal.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
import { motion } from 'framer-motion'

export const IncubationPortal = () => {
return (
<section className="min-h-screen flex items-center justify-center bg-[rgb(var(--color-background))]">
<motion.div
initial={{ opacity: 0, y: 20 }}
animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.6 }}
className="text-center px-4"
>
{/* Logo */}
<div className="w-48 h-48 mx-auto mb-8 relative">
<div className="absolute inset-0 bg-gradient-to-br from-purple-500/20 to-blue-500/20 blur-xl" />
<img src="/logo.svg" alt="X3 Momentum Logo" className="relative w-full h-full object-contain" />
</div>

<h1 className="text-4xl sm:text-5xl font-bold text-white mb-6">
Coming Soon
</h1>
<p className="text-xl text-gray-300 max-w-2xl mx-auto">
Our incubation portal is under development. Stay tuned for exciting opportunities.
</p>
</motion.div>
</section>
)
}
27 changes: 27 additions & 0 deletions src/components/sections/RecruitmentPortal.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
import { motion } from 'framer-motion'

export const RecruitmentPortal = () => {
return (
<section className="min-h-screen flex items-center justify-center bg-[rgb(var(--color-background))]">
<motion.div
initial={{ opacity: 0, y: 20 }}
animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.6 }}
className="text-center px-4"
>
{/* Logo */}
<div className="w-48 h-48 mx-auto mb-8 relative">
<div className="absolute inset-0 bg-gradient-to-br from-purple-500/20 to-blue-500/20 blur-xl" />
<img src="/logo.svg" alt="X3 Momentum Logo" className="relative w-full h-full object-contain" />
</div>

<h1 className="text-4xl sm:text-5xl font-bold text-white mb-6">
Coming Soon
</h1>
<p className="text-xl text-gray-300 max-w-2xl mx-auto">
Our recruitment portal is under development. Stay tuned for exciting opportunities.
</p>
</motion.div>
</section>
)
}
89 changes: 65 additions & 24 deletions src/components/sections/Sponsors.tsx
Original file line number Diff line number Diff line change
@@ -1,31 +1,43 @@
import { motion } from 'framer-motion'
import { Link } from 'react-router-dom'

const tiers = [
{
name: "Tier 1",
name: "Visionary Partner",
sponsors: [
{ name: "Company 1" },
{ name: "Company 2" },
{ name: "Available" },
{ name: "Available" },
]
},
{
name: "Tier 2",
name: "Genesis",
sponsors: [
{ name: "Company 3" },
{ name: "Company 4" },
{ name: "Company 5" },
{ name: "Company 6" },
{ name: "Available" },
{ name: "Available" },
{ name: "Available" },
{ name: "Available" },
]
},
{
name: "Tier 3",
name: "Node",
sponsors: [
{ name: "Company 7" },
{ name: "Company 8" },
{ name: "Company 9" },
{ name: "Company 10" },
{ name: "Company 11" },
{ name: "Company 12" },
{ name: "Available" },
{ name: "Available" },
{ name: "Available" },
{ name: "Available" },
{ name: "Available" },
{ name: "Available" },
]
},
{
name: "Hash",
sponsors: [
{ name: "Available" },
{ name: "Available" },
{ name: "Available" },
{ name: "Available" },
{ name: "Available" },
{ name: "Available" },
]
}
]
Expand Down Expand Up @@ -78,7 +90,11 @@ export const Sponsors = () => {
{tier.name}
</h3>

<div className={`grid ${tierIndex === 0 ? 'md:grid-cols-2' : tierIndex === 1 ? 'grid-cols-2 lg:grid-cols-4' : 'grid-cols-2 md:grid-cols-3 lg:grid-cols-6'} gap-6 items-center justify-items-center`}>
<div className={`grid ${
tier.name === "Visionary Partner" ? 'md:grid-cols-2' :
tier.name === "Genesis" ? 'grid-cols-2 lg:grid-cols-4' :
'grid-cols-2 md:grid-cols-3 lg:grid-cols-6'
} gap-6 items-center justify-items-center`}>
{tier.sponsors.map((sponsor, index) => (
<motion.div
key={sponsor.name}
Expand Down Expand Up @@ -120,15 +136,40 @@ export const Sponsors = () => {
whileInView={{ opacity: 1, y: 0 }}
viewport={{ once: true }}
transition={{ duration: 0.6 }}
className="mt-32 text-center"
className="mt-32 text-center space-y-8"
>
<p className="text-gray-300 mb-6">
Interested in becoming a sponsor?
</p>
<button className="relative overflow-hidden group bg-gradient-to-br from-purple-600 to-purple-800 hover:from-purple-500 hover:to-purple-700 px-8 py-3 rounded-lg transition-all duration-300">
<div className="absolute inset-0 bg-gradient-to-r from-white/0 via-white/10 to-white/0 opacity-0 group-hover:opacity-100 transition-opacity duration-500" />
<span className="relative text-white font-medium">View Sponsorship Packages</span>
</button>
<div>
<p className="text-gray-300 mb-6">
Interested in becoming a sponsor?
</p>
<a
href="/sponsorship_package.pdf"
target="_blank"
rel="noopener noreferrer"
className="inline-block relative overflow-hidden group bg-gradient-to-br from-purple-600 to-purple-800 hover:from-purple-500 hover:to-purple-700 px-8 py-3 rounded-lg transition-all duration-300"
>
<div className="absolute inset-0 bg-gradient-to-r from-white/0 via-white/10 to-white/0 opacity-0 group-hover:opacity-100 transition-opacity duration-500" />
<span className="relative text-white font-medium">View Sponsorship Packages</span>
</a>
</div>

<div className="flex justify-center gap-4">
<Link
to="/incubation"
className="inline-block relative overflow-hidden group bg-gradient-to-br from-blue-600 to-blue-800 hover:from-blue-500 hover:to-blue-700 px-8 py-3 rounded-lg transition-all duration-300"
>
<div className="absolute inset-0 bg-gradient-to-r from-white/0 via-white/10 to-white/0 opacity-0 group-hover:opacity-100 transition-opacity duration-500" />
<span className="relative text-white font-medium">Incubation Portal</span>
</Link>

<Link
to="/recruitment"
className="inline-block relative overflow-hidden group bg-gradient-to-br from-blue-600 to-blue-800 hover:from-blue-500 hover:to-blue-700 px-8 py-3 rounded-lg transition-all duration-300"
>
<div className="absolute inset-0 bg-gradient-to-r from-white/0 via-white/10 to-white/0 opacity-0 group-hover:opacity-100 transition-opacity duration-500" />
<span className="relative text-white font-medium">Recruitment Portal</span>
</Link>
</div>
</motion.div>
</div>
</section>
Expand Down

0 comments on commit df88a6e

Please sign in to comment.