1---
 2import { getIntlayer, type Locale } from "intlayer";
 3
 4import { DEFAULT_LOCALE, SITE_CONFIG } from "@/config";
 5import { getLocaleFeedUrl } from "@/utils/url.ts";
 6
 7const locale = (Astro.currentLocale ?? DEFAULT_LOCALE) as Locale;
 8const globalI18n = getIntlayer("global", locale);
 9---
10
11<footer class="footer">
12  <div class="footer-alternatives">
13    <a href={getLocaleFeedUrl(locale)}>
14      {globalI18n.feed}
15    </a>
16    <a href="https://git.trin.one/HPCesia/kerplunk">{globalI18n.source}</a>
17  </div>
18  <div class="footer-colophon">
19    <span>Copyright © {new Date().getFullYear()} {SITE_CONFIG.author}</span>
20    <span>
21      Powered by <a href="https://astro.build/">Astro</a> and{" "}
22      <a href="https://typst.app/">Typst</a>
23    </span>
24    <span>
25      Theme <a href="https://git.trin.one/HPCesia/kerplunk">Kerplunk</a>
26    </span>
27  </div>
28</footer>
29
30<style lang="scss" is:global>
31footer.footer {
32  position: relative;
33  border-top: 0.1rem;
34  border-top-style: solid;
35  display: flex;
36  gap: 1rem;
37  justify-content: space-between;
38  align-items: baseline;
39  padding-block: 0.5rem 1rem;
40  margin-top: 2rem;
41
42  @media (max-width:48rem) {
43    flex-direction: column;
44  }
45
46  .footer-alternatives,
47  .footer-colophon {
48    display: flex;
49    flex-wrap: wrap;
50    gap: 1rem;
51
52    @media (max-width:48rem) {
53      width: 100%;
54      justify-content: center;
55    }
56  }
57
58  &::before {
59    content: "";
60    position: absolute;
61    left: 0;
62    right: 0;
63    top: -0.3rem;
64    background: currentColor;
65    height: 0.05rem;
66  }
67
68  a {
69    color: inherit;
70    text-decoration: none;
71
72    &:hover {
73      text-decoration-line: underline;
74    }
75  }
76}
77</style>