diff --git a/src/lib/components/Anilist.svelte b/src/lib/components/Anilist.svelte new file mode 100644 index 0000000..69ca0e9 --- /dev/null +++ b/src/lib/components/Anilist.svelte @@ -0,0 +1,13 @@ +<script lang="ts"> + export let className: string = '' +</script> + +<svg + role="img" + class={className} + viewBox="0 0 24 24" + xmlns="http://www.w3.org/2000/svg" + ><title>AniList</title><path + d="M24 17.53v2.421c0 .71-.391 1.101-1.1 1.101h-5l-.057-.165L11.84 3.736c.106-.502.46-.788 1.053-.788h2.422c.71 0 1.1.391 1.1 1.1v12.38H22.9c.71 0 1.1.392 1.1 1.101zM11.034 2.947l6.337 18.104h-4.918l-1.052-3.131H6.019l-1.077 3.131H0L6.361 2.948h4.673zm-.66 10.96-1.69-5.014-1.541 5.015h3.23z" + /></svg +> diff --git a/src/lib/components/bluesky.svelte b/src/lib/components/Bluesky.svelte similarity index 100% rename from src/lib/components/bluesky.svelte rename to src/lib/components/Bluesky.svelte diff --git a/src/lib/components/forgejo.svelte b/src/lib/components/Forgejo.svelte similarity index 100% rename from src/lib/components/forgejo.svelte rename to src/lib/components/Forgejo.svelte diff --git a/src/lib/components/lastfm.svelte b/src/lib/components/Lastfm.svelte similarity index 100% rename from src/lib/components/lastfm.svelte rename to src/lib/components/Lastfm.svelte diff --git a/src/lib/components/twitch.svelte b/src/lib/components/Twitch.svelte similarity index 100% rename from src/lib/components/twitch.svelte rename to src/lib/components/Twitch.svelte diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index a244c76..916bf47 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -1,9 +1,10 @@ <script lang="ts"> import Pfp from '$lib/images/pfp.jpg' - import Forgejo from '$lib/components/forgejo.svelte' - import Bluesky from '$lib/components/bluesky.svelte' - import Lastfm from '$lib/components/lastfm.svelte' - import Twitch from '$lib/components/twitch.svelte' + import Forgejo from '$lib/components/Forgejo.svelte' + import Bluesky from '$lib/components/Bluesky.svelte' + import Lastfm from '$lib/components/Lastfm.svelte' + import Twitch from '$lib/components/Twitch.svelte' + import Anilist from '$lib/components/Anilist.svelte' </script> <svelte:head> @@ -52,5 +53,12 @@ /> </span> </a> + <a href="https://anilist.co/user/notoh/" aria-label="Anilist"> + <span class="inline-block motion-preset-expand motion-delay-400"> + <Anilist + className="w-8 h-8 fill-current color-transition hover:text-accent hover:motion-preset-pulse" + /> + </span> + </a> </div> </div>