import Header from "../components/Header.js";
import Banner from "../components/Banner.js";
import {
	PaperPlane,
	DiscordIcon,
	YtIcon,
	GithubIcon,
	TwitterIcon,
	MemberIcon,
	CalendarIcon,
	WikiIcon,
} from "../assets/Icons.js";
export default function Home() {
	return (
		<>
			<Header />
			<Banner />
			<article className="main">
				<div className="Map">
					<a className="msg">
						<h1>99,9k</h1>
						<p>Wysłane wiadomości</p>
						<PaperPlane className="icons" />
					</a>
					<a className="bots">
						<p>Status botów</p>
					</a>
					<a className="discord" href="/discord">
						<DiscordIcon className="icons" />
					</a>
					<a className="twitter" href="/twitter">
						<TwitterIcon className="icons" />
					</a>
					<a className="members">
						<h1>196</h1>
						<p>Członków</p>
						<MemberIcon className="icons" />
					</a>
					<a className="days">
						<h1>
							{Math.floor(
								// (Date.now() - new Date("06.07.2020").getTime()) / 86400000
								(Date.now() - new Date("2020-07-06").getTime()) / 86400000
							)}{" "}
							dni
						</h1>
						<p>Istnienia Gractwa</p>
						<CalendarIcon className="icons" />
					</a>
					<a className="yt" href="/youtube">
						<YtIcon className="icons" />
					</a>
					<a className="github" href="/github">
						<GithubIcon className="icons" />
					</a>
					<a className="wiki" href="https://gractwo.pl/wiki">
						<WikiIcon className="icons" />
					</a>
				</div>
			</article>
		</>
	);
}