82 lines
3.1 KiB
Text
82 lines
3.1 KiB
Text
---
|
|
import Icon from "./Icon.astro";
|
|
import { SITE, authors } from "../lib/blog-data.js";
|
|
|
|
// Social profiles come from site.config.json -> author.sameAs, which is also
|
|
// what feeds the Person JSON-LD. One list, not two.
|
|
const socials = (authors[0]?.sameAs ?? []).map((href) => {
|
|
const host = new URL(href).hostname.replace(/^www\./, "");
|
|
const label = host.split(".")[0];
|
|
return { href, label: label.charAt(0).toUpperCase() + label.slice(1) };
|
|
});
|
|
|
|
const { flush = false } = Astro.props;
|
|
---
|
|
|
|
<footer class:list={[flush ? "mt-0" : "mt-24", "border-t border-border/60"]}>
|
|
<div class="mx-auto grid max-w-6xl gap-10 px-5 py-12 md:grid-cols-4">
|
|
<div class="md:col-span-2">
|
|
<div class="font-serif text-lg font-semibold">{SITE.name}</div>
|
|
<p class="mt-3 max-w-sm text-sm leading-relaxed text-muted-foreground">
|
|
{SITE.description}
|
|
</p>
|
|
<div class="mt-5 flex flex-wrap items-center gap-x-5 gap-y-2">
|
|
{
|
|
socials.map((s) => (
|
|
<a
|
|
href={s.href}
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
class="ca-quiet font-mono text-xs tracking-[0.1em] text-muted-foreground uppercase hover:text-foreground"
|
|
>
|
|
{s.label}
|
|
</a>
|
|
))
|
|
}
|
|
<a
|
|
href="/rss.xml"
|
|
class="ca-quiet font-mono text-xs tracking-[0.1em] text-muted-foreground uppercase hover:text-foreground"
|
|
>RSS</a
|
|
>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<div class="text-xs font-medium uppercase tracking-wider text-muted-foreground">Services</div>
|
|
<ul class="mt-3 space-y-2 text-sm">
|
|
{
|
|
[
|
|
{ label: "Automation", href: "/services#automation" },
|
|
{ label: "Website Design", href: "/services#website-design" },
|
|
{ label: "Digital Marketing", href: "/services#digital-marketing" },
|
|
{ label: "For Law Firms", href: "/services" },
|
|
].map((s) => (
|
|
<li>
|
|
<a
|
|
href={s.href}
|
|
class="text-foreground/80 hover:text-foreground"
|
|
>
|
|
{s.label}
|
|
</a>
|
|
</li>
|
|
))
|
|
}
|
|
</ul>
|
|
</div>
|
|
<div>
|
|
<div class="text-xs font-medium uppercase tracking-wider text-muted-foreground">The site</div>
|
|
<ul class="mt-3 space-y-2 text-sm">
|
|
<li><a href="/about" class="hover:text-foreground">About</a></li>
|
|
<li><a href="/projects" class="hover:text-foreground">Projects</a></li>
|
|
<li><a href="/resume" class="hover:text-foreground">Resume</a></li>
|
|
<li><a href="/contact" class="hover:text-foreground">Contact</a></li>
|
|
<li><a href="/changelog" class="hover:text-foreground">Changelog</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="border-t border-border/60">
|
|
<div class="mx-auto flex max-w-6xl flex-col items-start justify-between gap-2 px-5 py-5 text-xs text-muted-foreground sm:flex-row sm:items-center">
|
|
<div>© {new Date().getFullYear()} {SITE.name}.</div>
|
|
<div>Set in Fraunces & Inter.</div>
|
|
</div>
|
|
</div>
|
|
</footer>
|