forked from sashaastiadi/www_mycelium_net
74 lines
2.5 KiB
TypeScript
74 lines
2.5 KiB
TypeScript
import {
|
|
BookOpenIcon,
|
|
LifebuoyIcon,
|
|
ChatBubbleOvalLeftEllipsisIcon,
|
|
UserGroupIcon,
|
|
} from '@heroicons/react/24/outline';
|
|
|
|
const features = [
|
|
{
|
|
name: 'Documentation',
|
|
description: 'Documentation for Mycelium.',
|
|
href: 'https://threefold.info/mycelium_network/docs/',
|
|
icon: BookOpenIcon,
|
|
},
|
|
{
|
|
name: 'Support',
|
|
description: 'Talk to an expert.',
|
|
href: 'https://threefoldfaq.crisp.help/en/',
|
|
icon: LifebuoyIcon,
|
|
},
|
|
{
|
|
name: 'Forum',
|
|
description: 'Forum for all your questions.',
|
|
href: 'https://forum.threefold.io/',
|
|
icon: ChatBubbleOvalLeftEllipsisIcon,
|
|
},
|
|
{
|
|
name: 'Community',
|
|
description: 'Join our Developers community on telegram.',
|
|
href: 'https://t.me/threefoldtesting',
|
|
icon: UserGroupIcon,
|
|
},
|
|
];
|
|
|
|
export function DevHub() {
|
|
return (
|
|
<div className="bg-gray-900 py-24 sm:py-32">
|
|
<div className="mx-auto max-w-7xl px-6 lg:px-8">
|
|
<div className="mx-auto grid max-w-2xl grid-cols-1 gap-x-8 gap-y-16 sm:gap-y-20 lg:mx-0 lg:max-w-none lg:grid-cols-5">
|
|
<div className="col-span-2">
|
|
<h2 className="text-base/7 font-semibold text-cyan-500 mb-2">Get Started</h2>
|
|
<p className="text-3xl lg:text-4xl font-medium tracking-tight text-white">
|
|
Developer Hub
|
|
</p>
|
|
<p className="mt-6 text-lg text-gray-300">
|
|
Our Developer Hub is a resource center for developers looking to build on top of Mycelium. Join our Developers community on telegram to get started.
|
|
</p>
|
|
</div>
|
|
<dl className="col-span-3 grid grid-cols-1 gap-8 sm:grid-cols-2">
|
|
{features.map((feature) => (
|
|
<a
|
|
key={feature.name}
|
|
href={feature.href}
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className="block rounded-2xl border border-gray-700 p-6 shadow-sm transition-all duration-300 ease-in-out hover:scale-105 hover:border-cyan-500 hover:shadow-lg hover:shadow-cyan-500/20 hover:bg-gray-800"
|
|
>
|
|
<feature.icon
|
|
aria-hidden="true"
|
|
className="h-6 w-6 flex-none text-cyan-500 mb-4"
|
|
/>
|
|
<dt className="font-semibold text-white">
|
|
{feature.name}
|
|
</dt>
|
|
<dd className="mt-2 text-gray-400">{feature.description}</dd>
|
|
</a>
|
|
))}
|
|
</dl>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|