brandan/personal-website
1
0
Fork 0
Code Pull requests Activity

add more socials

Browse source
This commit is contained in:
cirroskais 2024-04-18 15:53:06 -04:00
parent 1c4068ff87
commit 8c4426e5ae
No known key found for this signature in database
GPG key ID: 5FC73EBF2678E33D
4 changed files with 43 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
src/app.css
View file

@ -19,3 +19,13 @@ body {
.hero > div {
backdrop-filter: blur(10px);
}
a {
@apply hover:text-neutral-400;
@apply transition-colors;
}
a > div {
@apply hover:text-neutral-400;
@apply transition-colors;
}

10
src/lib/components/Icons/Bluesky.svelte Normal file
View file

@ -0,0 +1,10 @@
<svg
role="img"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
stroke="none"
fill="currentColor"
><title>Bluesky</title><path
d="M12 10.8c-1.087-2.114-4.046-6.053-6.798-7.995C2.566.944 1.561 1.266.902 1.565.139 1.908 0 3.08 0 3.768c0 .69.378 5.65.624 6.479.815 2.736 3.713 3.66 6.383 3.364.136-.02.275-.039.415-.056-.138.022-.276.04-.415.056-3.912.58-7.387 2.005-2.83 7.078 5.013 5.19 6.87-1.113 7.823-4.308.953 3.195 2.05 9.271 7.733 4.308 4.267-4.308 1.172-6.498-2.74-7.078a8.741 8.741 0 0 1-.415-.056c.14.017.279.036.415.056 2.67.297 5.568-.628 6.383-3.364.246-.828.624-5.79.624-6.478 0-.69-.139-1.861-.902-2.206-.659-.298-1.664-.62-4.3 1.24C16.046 4.748 13.087 8.687 12 10.8Z"
/></svg
>
Side by side

After

Width:  |  Height:  |  Size: 708 B

10
src/lib/components/Icons/X.svelte Normal file
View file

@ -0,0 +1,10 @@
<svg
role="img"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
stroke="none"
fill="currentColor"
><title>X</title><path
d="M18.901 1.153h3.68l-8.04 9.19L24 22.846h-7.406l-5.8-7.584-6.638 7.584H.474l8.6-9.83L0 1.154h7.594l5.243 6.932ZM17.61 20.644h2.039L6.486 3.24H4.298Z"
/></svg
>
Side by side

After

Width:  |  Height:  |  Size: 299 B

14
src/routes/+page.svelte
View file

@ -6,6 +6,8 @@
import Lastfm from '$lib/components/Icons/LastFM.svelte';
import GitHub from '$lib/components/Icons/GitHub.svelte';
import Mastodon from '$lib/components/Icons/Mastodon.svelte';
import X from '$lib/components/Icons/X.svelte';
import Bluesky from '$lib/components/Icons/Bluesky.svelte';
</script>
<svelte:head>
@ -55,12 +57,22 @@
<Discord />
</div>
</a>
<a class="flex" href="https://x.com/{config.TWITTER}">
<div class="h-7 w-7 my-auto text-white/75">
<X />
</div>
</a>
<a class="flex" href="https://bsky.app/profile/{config.BLUESKY}">
<div class="h-7 w-7 my-auto text-white/75">
<Bluesky />
</div>
</a>
</div>
<div class="md:w-[42rem] p-2 bg-black/75 rounded-lg mt-1">
<div class="flex space-x-4">
<img
class="w-24 h-24 rounded-lg"
class="w-24 h-24"
src={$page.data.lastfm?.recenttracks?.track[0]?.image.find(
(_) => _.size == 'extralarge'
)?.['#text']}