blob: f34eb758684276831086b53d2df7f5ed08245c61 (
plain) (
blame)
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
|
<script lang="ts">
const {
name,
icon,
href,
rel,
}: {
name: string;
icon: string;
href: string;
rel?: string | null | undefined;
} = $props();
</script>
<a
class="card shadow-md border border-neutral my-1 mx-1 socialhover p-2"
{rel}
{href}
target="_blank"
title={name}
>
<span class="text-3xl md:text-6xl {icon}"></span>
</a>
<style>
.socialhover {
span {
color: var(--color-fg);
}
}
.socialhover:hover,
.socialhover:active {
background-color: var(--color-fg);
span {
color: var(--color-bg);
}
}
</style>
|
