plane/apps/www/components/landing/Community.tsx
2022-12-21 00:56:19 +05:30

87 lines
3.2 KiB
TypeScript

import React from "react";
// next imports
import Image from "next/image";
import Link from "next/link";
const Community = () => {
return (
<div className="bg-[#00091F] text-white">
<div className="container mx-auto px-5 py-20 md:py-24 ">
<h2 className="text-3xl tracking-tight md:text-3xl ">
Join Our Growing Developer Community
</h2>
<div className="max-w-2xl mt-4 text-sm">
Join our global community of contributors, developers, and enthusiasts
on Discord and Github. Learn more about Plane through documentation
from the crew.
</div>
<div className="mt-10 grid md:grid-cols-3 gap-4">
<Link href="https://twitter.com/planepowers" target="_blank">
<a className="rounded-lg card-border-gradient p-[1.5px]">
<div className="rounded-lg bg-[#00091F]">
<div className="flex flex-col items-center card-gradient py-14 rounded-lg">
<div className="relative h-20 w-20">
<Image
layout="fill"
height="40px"
width="40px"
src="/icons/twitter.svg"
alt="Twitter"
/>
</div>
<div className="text-gray-400 mt-4">
twitter.com
<span className="text-[#05C3FF]">/planepowers</span>{" "}
</div>
</div>
</div>
</a>
</Link>
<Link href="https://github.com/makeplane" target="_blank">
<a className="rounded-lg card-border-gradient p-[1.5px]">
<div className="rounded-lg bg-[#00091F]">
<div className="flex flex-col items-center card-gradient py-14 rounded-lg">
<div className="relative h-20 w-20">
<Image
layout="fill"
height="40px"
width="40px"
src="/icons/github.svg"
alt="Twitter"
/>
</div>
<div className="text-gray-400 mt-4">
github
<span className="text-white">/makeplane</span>
</div>
</div>
</div>
</a>
</Link>
<Link href="https://discord.com/invite/A92xrEGCge" target="_blank">
<a className="rounded-lg card-border-gradient p-[1.5px]">
<div className="rounded-lg bg-[#00091F]">
<div className="flex flex-col items-center card-gradient py-14 rounded-lg">
{" "}
<div className="relative h-20 w-20">
<Image
layout="fill"
height="40px"
width="40px"
src="/icons/discord.svg"
alt="Twitter"
/>
</div>
<div className="mt-4">Join our community</div>
</div>
</div>
</a>
</Link>
</div>
</div>
</div>
);
};
export default Community;