feat: center-align website content

Update all sections for balanced, symmetrical layout.

#VERCEL_SKIP

Co-authored-by: Jeff Emmett <46964190+Jeff-Emmett@users.noreply.github.com>
This commit is contained in:
v0 2025-11-08 01:56:03 +00:00
parent c91ad7ebb2
commit 3e51198809
5 changed files with 25 additions and 26 deletions

View File

@ -33,7 +33,7 @@ export function AboutSection() {
<div className="absolute top-10 left-20 w-80 h-80 bg-[var(--neon-orange)] rounded-full blur-[120px] opacity-15 animate-pulse" />
<div className="max-w-7xl mx-auto relative z-10">
<div className="max-w-2xl mb-16">
<div className="max-w-2xl mx-auto mb-16 text-center">
<h2 className="text-4xl md:text-5xl font-bold mb-6 text-balance neon-glow-orange text-[var(--neon-orange-bright)]">
About the BCRG
</h2>
@ -44,13 +44,13 @@ export function AboutSection() {
</p>
</div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
<div className="grid grid-cols-1 md:grid-cols-2 gap-6 max-w-5xl mx-auto">
{values.map((value, index) => (
<Card
key={index}
className="p-6 bg-card/50 border-2 border-neon-orange hover:shadow-[0_0_30px_rgba(255,140,0,0.4)] transition-all"
>
<div className="flex items-start gap-4">
<div className="flex flex-col items-center text-center gap-4">
<div className="p-2 rounded-lg bg-[var(--neon-orange)]/20 border border-[var(--neon-orange)]">
<value.icon className="h-6 w-6 text-[var(--neon-orange-bright)]" />
</div>

View File

@ -12,18 +12,17 @@ export function HeroSection() {
/>
<div className="max-w-7xl mx-auto relative z-10">
<div className="max-w-3xl">
<div className="max-w-3xl mx-auto text-center">
<h1 className="text-5xl md:text-6xl lg:text-7xl font-bold tracking-tight mb-6 text-balance neon-glow-cyan text-[var(--neon-cyan-bright)]">
Bonding Curve Research Group
</h1>
<p className="text-xl md:text-2xl text-foreground/80 mb-8 leading-relaxed text-pretty">
We are a decentralized squad of engineers, researchers, and data analysts dedicated to the study, development, and practical implementation of bonding curves as programmable financial primitives.
We are a decentralized squad of engineers, researchers, and data analysts dedicated to the study,
development, and practical implementation of bonding curves as programmable financial primitives.
</p>
<div className="flex flex-wrap gap-4">
<div className="flex flex-wrap gap-4 justify-center">
<Button
asChild
size="lg"

View File

@ -36,7 +36,7 @@ export function LibrarySection() {
/>
<div className="max-w-7xl mx-auto relative z-10">
<div className="max-w-2xl mb-16">
<div className="max-w-2xl mx-auto mb-16 text-center">
<h2 className="text-4xl md:text-5xl font-bold mb-6 text-balance neon-glow-purple text-[var(--neon-magenta)]">
BCRG Library
</h2>
@ -46,13 +46,13 @@ export function LibrarySection() {
</p>
</div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-6 mb-12">
<div className="grid grid-cols-1 md:grid-cols-2 gap-6 mb-12 max-w-5xl mx-auto">
{features.map((feature, index) => (
<Card
key={index}
className="p-6 bg-card/50 border-2 border-neon-purple hover:shadow-[0_0_30px_rgba(138,43,226,0.4)] transition-all"
>
<div className="flex items-start gap-4">
<div className="flex flex-col items-center text-center gap-4">
<div className="p-2 rounded-lg bg-[var(--neon-purple)]/20 border border-[var(--neon-purple)]">
<feature.icon className="h-6 w-6 text-[var(--neon-magenta)]" />
</div>
@ -65,8 +65,8 @@ export function LibrarySection() {
))}
</div>
<Card className="p-8 bg-card/50 border-2 border-[var(--neon-purple)] shadow-[0_0_30px_rgba(138,43,226,0.3)]">
<div className="flex flex-col md:flex-row items-center justify-between gap-6">
<Card className="p-8 bg-card/50 border-2 border-[var(--neon-purple)] shadow-[0_0_30px_rgba(138,43,226,0.3)] max-w-4xl mx-auto">
<div className="flex flex-col items-center text-center gap-6">
<div className="flex-1">
<h3 className="text-2xl font-bold mb-3 text-[var(--neon-magenta)]">Get Started with the Library</h3>
<p className="text-foreground/70 leading-relaxed mb-4">

View File

@ -31,7 +31,7 @@ export function OpenSourceSection() {
return (
<section id="open-source" className="py-20 px-4 sm:px-6 lg:px-8">
<div className="max-w-7xl mx-auto">
<div className="max-w-2xl mb-16">
<div className="max-w-2xl mx-auto mb-16 text-center">
<h2 className="text-4xl md:text-5xl font-bold mb-6 text-balance">Open Source Contributions</h2>
<p className="text-lg text-muted-foreground leading-relaxed text-pretty">
All of our work is open source and freely available to the community. We believe in building in public and
@ -39,17 +39,17 @@ export function OpenSourceSection() {
</p>
</div>
<div className="grid grid-cols-1 gap-6 mb-12">
<div className="grid grid-cols-1 gap-6 mb-12 max-w-4xl mx-auto">
{projects.map((project, index) => (
<Card key={index} className="p-6 hover:shadow-lg transition-shadow">
<div className="flex flex-col md:flex-row md:items-center md:justify-between gap-4">
<div className="flex flex-col items-center text-center gap-4">
<div className="flex-1">
<div className="flex items-center gap-2 mb-2">
<div className="flex items-center justify-center gap-2 mb-2">
<Github className="h-5 w-5" />
<h3 className="text-xl font-semibold">{project.name}</h3>
</div>
<p className="text-muted-foreground mb-3 leading-relaxed">{project.description}</p>
<div className="flex flex-wrap gap-2">
<div className="flex flex-wrap gap-2 justify-center">
{project.topics.map((topic, i) => (
<span key={i} className="px-3 py-1 bg-accent/10 text-accent text-sm rounded-full">
{topic}
@ -57,7 +57,7 @@ export function OpenSourceSection() {
))}
</div>
</div>
<Button asChild variant="outline" className="self-start md:self-center bg-transparent">
<Button asChild variant="outline" className="bg-transparent">
<Link href={project.link} target="_blank">
View Project
<ExternalLink className="ml-2 h-4 w-4" />
@ -68,8 +68,8 @@ export function OpenSourceSection() {
))}
</div>
<Card className="p-8 bg-primary text-primary-foreground">
<div className="flex flex-col md:flex-row items-center justify-between gap-6">
<Card className="p-8 bg-primary text-primary-foreground max-w-4xl mx-auto">
<div className="flex flex-col items-center text-center gap-6">
<div className="flex-1">
<h3 className="text-2xl font-bold mb-3">Join Our Community</h3>
<p className="text-primary-foreground/90 leading-relaxed">

View File

@ -37,7 +37,7 @@ export function ResearchSection() {
/>
<div className="max-w-7xl mx-auto relative z-10">
<div className="max-w-2xl mb-16">
<div className="max-w-2xl mx-auto mb-16 text-center">
<h2 className="text-4xl md:text-5xl font-bold mb-6 text-balance neon-glow-cyan text-[var(--neon-cyan-bright)]">
Research & Publications
</h2>
@ -47,17 +47,17 @@ export function ResearchSection() {
</p>
</div>
<div className="grid grid-cols-1 gap-6">
<div className="grid grid-cols-1 gap-6 max-w-4xl mx-auto">
{publications.map((pub, index) => (
<Card
key={index}
className="p-6 bg-card/50 border-2 border-neon-cyan hover:shadow-[0_0_30px_rgba(0,255,255,0.4)] transition-all"
>
<div className="flex flex-col md:flex-row md:items-center md:justify-between gap-4">
<div className="flex flex-col items-center text-center gap-4">
<div className="flex-1">
<h3 className="text-xl font-semibold mb-2 text-[var(--neon-cyan)]">{pub.title}</h3>
<p className="text-foreground/70 mb-3 leading-relaxed">{pub.description}</p>
<div className="flex items-center gap-2 text-sm text-[var(--neon-cyan)]/70">
<div className="flex items-center justify-center gap-2 text-sm text-[var(--neon-cyan)]/70">
<Calendar className="h-4 w-4" />
<span>{pub.date}</span>
</div>
@ -65,7 +65,7 @@ export function ResearchSection() {
<Button
asChild
variant="outline"
className="self-start md:self-center border-2 border-[var(--neon-cyan)] text-[var(--neon-cyan-bright)] hover:bg-[var(--neon-cyan)]/10 shadow-[0_0_10px_rgba(0,255,255,0.3)] bg-transparent"
className="border-2 border-[var(--neon-cyan)] text-[var(--neon-cyan-bright)] hover:bg-[var(--neon-cyan)]/10 shadow-[0_0_10px_rgba(0,255,255,0.3)] bg-transparent"
>
<Link href={pub.link} target="_blank">
Read More