blob: 00e7f97602b4d4adb2b603722d182f252cf93112 (
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
|
---
import { Icon } from "astro-icon/components";
/**
Uses https://www.astroicon.dev/getting-started/
Find icons via guide: https://www.astroicon.dev/guides/customization/#open-source-icon-sets
Only installed pack is: @iconify-json/mdi
*/
const socialLinks: {
friendlyName: string;
isWebmention?: boolean;
link: string;
name: string;
}[] = [
{
friendlyName: "Github",
link: "https://github.com/chrismwilliams/astro-cactus",
name: "mdi:github",
},
];
---
<div class="flex flex-wrap items-end gap-x-2">
<p>Find me on</p>
<ul class="flex flex-1 items-center gap-x-2 sm:flex-initial">
{
socialLinks.map(({ friendlyName, isWebmention, link, name }) => (
<li class="flex">
<a
class="hover:text-link inline-block"
href={link}
rel={`noreferrer ${isWebmention ? "me authn" : ""}`}
target="_blank"
>
<Icon aria-hidden="true" class="h-8 w-8" focusable="false" name={name} />
<span class="sr-only">{friendlyName}</span>
</a>
</li>
))
}
</ul>
</div>
|
