jeffemmett-website-redesign/components/skills-section.tsx

61 lines
1.8 KiB
TypeScript

const skills = {
"Token Engineering": [
"Bonding Curves",
"cadCAD Modeling",
"Primary Issuance Markets",
"Dynamic Supply Tokens",
"Cryptoeconomics",
"Agent-Based Modeling",
],
"DAO Tooling": [
"Conviction Voting",
"Augmented Bonding Curves",
"Commons Stack",
"Governance Systems",
"Cyber-Physical Commons",
"Ostrom Compliance",
],
"Research Areas": [
"Regenerative Economics",
"Mycoeconomics",
"Complex Systems",
"Behavioral Economics",
"Token Design",
"Public Goods Funding",
],
Technical: ["Python", "Solidity", "Simulation", "Data Analysis", "Systems Design", "Web3"],
}
export function SkillsSection() {
return (
<section className="py-32 px-6">
<div className="max-w-6xl mx-auto">
<div className="mb-16">
<h2 className="text-5xl md:text-6xl font-bold mb-6">Expertise & Focus Areas</h2>
<p className="text-xl text-muted-foreground max-w-2xl text-balance leading-relaxed">
Interdisciplinary approach to building resilient token economies and regenerative systems
</p>
</div>
<div className="grid md:grid-cols-2 gap-12">
{Object.entries(skills).map(([category, items]) => (
<div key={category}>
<h3 className="text-2xl font-semibold mb-6 text-primary">{category}</h3>
<div className="flex flex-wrap gap-3">
{items.map((skill) => (
<span
key={skill}
className="px-4 py-2 bg-secondary text-secondary-foreground rounded-lg font-medium hover:bg-primary hover:text-primary-foreground transition-colors"
>
{skill}
</span>
))}
</div>
</div>
))}
</div>
</div>
</section>
)
}