diff options
Diffstat (limited to 'apps/website/src/components/base/Footer.astro')
| -rw-r--r-- | apps/website/src/components/base/Footer.astro | 39 |
1 files changed, 33 insertions, 6 deletions
diff --git a/apps/website/src/components/base/Footer.astro b/apps/website/src/components/base/Footer.astro index 0eaa4ba..bf019ac 100644 --- a/apps/website/src/components/base/Footer.astro +++ b/apps/website/src/components/base/Footer.astro @@ -1,15 +1,42 @@ --- - +import Icon from "@components/icons/Icon.astro"; +import Logo from "@components/logos/Logo.astro"; +import configConst from "@config"; +import Link from "./Link.astro"; --- -<footer class="flex flex-row justify-between items-start min-h-[400px] bg-blue-100 mt-4"> - <div class="p-20 max-w-[1024px]"> - <div class="flex-1"> +<footer class="flex justify-center items-center bg-blue-100 mt-4 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 */} + <div class="flex flex-row gap-3"> + <a href="" class="hover:text-[#5865F2]"><Icon icon="discord" /></a> + <a href="" class="hover:text-[#ff0000]"><Icon icon="youtube" /></a> + <a href="" 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-1 "> - + <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> |