blob: dbb863e58493394841f2f34ce7e7fdcb2edff511 (
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
52
53
54
|
---
import config from "virtual:starlight/user-config";
const links = config.social || [];
// Built-in SVG icons 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>',
};
---
{
links.length > 0 && (
<>
{links.map(({ label, href }) => (
<a href={href} rel="me" class="sl-flex" title={label}>
<span class="sr-only">{label}</span>
{label === "CGit" ? (
<span class="sl-social-text">cgit</span>
) : (
<span class="sl-social-icon" set:html={BUILTIN["code-branch"]} />
)}
</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;
}
.sl-social-text {
font-size: 0.8rem;
font-weight: 700;
line-height: 1;
font-family: var(--__sl-font-mono, monospace);
}
}
</style>
|
