EquiLink-Suite/equilink-site
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

updated tokenomics

Browse Source
This commit is contained in:
equilink 2025-02-17 12:04:40 +05:30
parent 3d5bd99ab2
commit 07a02b50c4
2 changed files with 49 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
client/public/tokenomics.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.4 MiB

112
client/src/components/tokenomics.tsx
View File

@ -19,72 +19,58 @@ const vestingData = [
const Tokenomics: React.FC = () => { const Tokenomics: React.FC = () => {
return ( return (
<div id="tokenomics" className="grid md:grid-cols-2 gap-10 items-center justify-center p-10 w-full"> <div className="container mx-auto">
{/* Animated Pie Chart */} <div id="tokenomics" className="grid grid-cols-1 gap-10 items-center justify-center p-10 w-full">
<motion.div {/* Animated Pie Chart */}
initial={{ opacity: 0, scale: 0.8 }} <h2 className="text-4xl text-center font-orbitron font-bold mb-4">Tokenomics</h2>
animate={{ opacity: 1, scale: 1 }} <motion.div
transition={{ duration: 0.8 }} initial={{ opacity: 0, scale: 0.8 }}
className="flex justify-center" animate={{ opacity: 1, scale: 1 }}
> transition={{ duration: 0.8 }}
<ResponsiveContainer width={600} height={600}> className="flex justify-center"
<PieChart> >
<Pie
data={data}
cx="50%"
cy="50%"
innerRadius={120}
outerRadius={180}
fill="#8884d8"
paddingAngle={5}
dataKey="value"
className="w-full h-full"
>
{data.map((entry, index) => (
<Cell key={`cell-${index}`} fill={entry.color} />
))}
</Pie>
</PieChart>
</ResponsiveContainer>
</motion.div>
{/* Tokenomics Info */} <img src={'/tokenomics.png'} alt="tokenomics" className="bg-cover scale-90 hover:scale-95 transition-all duration-300" />
<motion.div </motion.div>
initial={{ opacity: 0, x: 50 }}
animate={{ opacity: 1, x: 0 }}
transition={{ duration: 0.8 }}
className="text-left"
>
<h2 className="text-4xl font-orbitron font-bold mb-4">Tokenomics</h2>
<p className="text-gray-500 mb-4">
Transparent Allocation – Designed for Growth and Sustainability
</p>
<div className="mb-6 space-y-2"> {/* Tokenomics Info */}
{data.map((item, index) => ( {/* <motion.div
<div key={index} className="flex items-center"> initial={{ opacity: 0, x: 50 }}
<div animate={{ opacity: 1, x: 0 }}
className="w-4 h-4 rounded mr-2" transition={{ duration: 0.8 }}
style={{ backgroundColor: item.color }} className="text-left"
></div> >
<p className="text-lg">{item.name} ({item.value}%)</p> <h2 className="text-4xl font-orbitron font-bold mb-4">Tokenomics</h2>
</div> <p className="text-gray-500 mb-4">
))} Transparent Allocation – Designed for Growth and Sustainability
</div> </p>
<h3 className="text-xl font-semibold mb-3">Vesting Plan</h3> <div className="mb-6 space-y-2">
<div className="space-y-2"> {data.map((item, index) => (
{vestingData.map((item, index) => ( <div key={index} className="flex items-center">
<div key={index} className="flex items-center"> <div
<div className="w-4 h-4 rounded mr-2"
className="w-4 h-4 rounded mr-2" style={{ backgroundColor: item.color }}
style={{ backgroundColor: item.color }} ></div>
></div> <p className="text-lg">{item.name} ({item.value}%)</p>
<p className="text-lg">{item.name}</p> </div>
</div> ))}
))} </div>
</div>
</motion.div> <h3 className="text-xl font-semibold mb-3">Vesting Plan</h3>
<div className="space-y-2">
{vestingData.map((item, index) => (
<div key={index} className="flex items-center">
<div
className="w-4 h-4 rounded mr-2"
style={{ backgroundColor: item.color }}
></div>
<p className="text-lg">{item.name}</p>
</div>
))}
</div>
</motion.div> */}
</div>
</div> </div>
); );
}; };