blob: 9463edcc0f94366f16726675d3cc431c33f8795b (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
|
---
import Icon from '@components/icons/Icon.astro';
import Logo from '@components/logos/Logo.astro';
import configConst from '@config';
import type { HTMLAttributes } from 'astro/types';
import Link from './Link.astro';
interface Props extends HTMLAttributes<'footer'> {}
const props = Astro.props;
---
<footer {...props} class="section flex justify-center items-center bg-blue-100 -mt-40 pt-20 pb-8 px-20">
<div class="max-w-[1024px] w-full flex flex-col gap-y-24">
<div class="flex flex-col gap-y-20 justify-center items-start md:flex-row md:items-start md:justify-between">
<div class="flex-1 flex flex-col gap-y-3 text-blue-gray">
<Logo logo="polyfrost.full" />
<p>English, USA</p> {/* hardcoded for now, todo i18n */}
<div class="flex flex-row gap-3">
<a href={configConst.socials.discord} target="_blank" class="hover:text-[#5865F2]"><Icon icon="discord" /></a>
<a href={configConst.socials.youtube} target="_blank" class="hover:text-[#ff0000]"><Icon icon="youtube" /></a>
<a href={configConst.socials.github} target="_blank" class="hover:text-[#000000]"><Icon icon="github" /></a>
</div>
</div>
<div class="flex-1 flex flex-col md:flex-row justify-end gap-8">
{configConst.footer.map(column => (
<div class="flex flex-col gap-y-3">
<h3 class="text-gray-700 text-md">{column.header}</h3>
<ul class="flex flex-col gap-y-1">
{column.links.map(link => (
<li>
<Link href={link.url} class="text-blue-gray text-sm text-nowrap">{link.text}</Link>
</li>
))}
</ul>
</div>
))}
</div>
</div>
<div class="flex flex-col items-center md:flex-row md:items-start md:justify-between">
<p class="text-blue-gray text-sm">© {new Date().getFullYear()} Polyfrost. All rights reserved.</p>
<p class="text-blue-gray text-sm">Not affiliated with Mojang Studios.</p>
</div>
</div>
</footer>
|
