60 lines
1.6 KiB
Plaintext
60 lines
1.6 KiB
Plaintext
---
|
|
import Logo from "@components/images/Logo.astro"
|
|
|
|
type SocialPlatform = {
|
|
name: string;
|
|
url: string;
|
|
iconLight: string;
|
|
iconDark: string;
|
|
};
|
|
|
|
interface Props {
|
|
pageTitle: string;
|
|
}
|
|
|
|
const { pageTitle } = Astro.props;
|
|
|
|
const socialPlatforms: SocialPlatform[] = [
|
|
{
|
|
name: 'Facebook',
|
|
url: `https://www.facebook.com/sharer/sharer.php?u=${Astro.url}`,
|
|
iconLight: 'https://cdn.jsdelivr.net/gh/selfhst/icons@main/webp/facebook.webp',
|
|
iconDark: 'https://cdn.jsdelivr.net/gh/selfhst/icons@main/webp/facebook.webp',
|
|
},
|
|
{
|
|
name: 'Twitter',
|
|
url: `https://x.com/intent/tweet?url=${Astro.url}&text=${pageTitle}`,
|
|
iconLight: 'https://cdn.jsdelivr.net/gh/selfhst/icons@main/webp/twitter.webp',
|
|
iconDark: 'https://cdn.jsdelivr.net/gh/selfhst/icons@main/webp/twitter.webp',
|
|
},
|
|
{
|
|
name: 'LinkedIn',
|
|
url: `https://www.linkedin.com/sharing/share-offsite/?url=${Astro.url}`,
|
|
iconLight: 'https://cdn.jsdelivr.net/gh/selfhst/icons@main/webp/linkedin.webp',
|
|
iconDark: 'https://cdn.jsdelivr.net/gh/selfhst/icons@main/webp/linkedin.webp',
|
|
},
|
|
];
|
|
---
|
|
|
|
<div class="inline-flex items-center gap-x-2">
|
|
{socialPlatforms.map((platform) => (
|
|
<a
|
|
class="button-base-hidden group inline-flex rounded-lg gap-x-2"
|
|
href={platform.url}
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
title={`Share on ${platform.name}`}
|
|
>
|
|
<div class="button-text-title-hidden flex relative items-center text-center">
|
|
<Logo
|
|
srcLight={platform.iconLight}
|
|
srcDark={platform.iconDark}
|
|
alt={platform.name}
|
|
width="24"
|
|
height="24"
|
|
/>
|
|
</div>
|
|
</a>
|
|
))}
|
|
</div>
|