blob: 4cceb9a8c29e4fc68a3507a73270c37ad96e0c22 (
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
48
49
50
51
|
---
import config from "virtual:starlight/user-config";
const links = config.social || [];
// Built-in SVG icons (replacing Starlight's Icon component for social links)
const BUILTIN: Record<string, string> = {
"x.com":
'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4l11.733 16h4.267l-11.733 -16z"/><path d="M4 20l6.768 -6.768m2.46 -2.46L20 4"/></svg>',
"code-branch":
'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="6" cy="6" r="2.5"/><circle cx="6" cy="18" r="2.5"/><line x1="6" y1="8.5" x2="6" y2="15.5"/><path d="M6 12 L18 8"/><circle cx="18" cy="6" r="2.5"/></svg>',
};
// CGit 専用アイコン（cgit.yasutakeyohei.com の favicon に基づく）
const CGIT_SVG =
'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="7" cy="7" r="3"/><circle cx="7" cy="17" r="3"/><line x1="7" y1="10" x2="7" y2="14"/><path d="M7 12h6a3 3 0 0 0 3-3V7"/><circle cx="17" cy="7" r="3"/></svg>';
---
{
links.length > 0 && (
<>
{links.map(({ label, href, icon }) => {
const svg = label === "CGit" ? CGIT_SVG : (BUILTIN[String(icon)] || BUILTIN["code-branch"]);
return (
<a href={href} rel="me" class="sl-flex" title={label}>
<span class="sr-only">{label}</span>
<span class="sl-social-icon" set:html={svg} />
</a>
);
})}
</>
)
}
<style>
@layer starlight.core {
a {
color: var(--sl-color-text-accent);
padding: 0.5em;
margin: -0.5em;
}
a:hover {
color: var(--sl-color-white);
}
.sl-social-icon :global(svg) {
width: 1rem;
height: 1rem;
display: block;
}
}
</style>
|
