website/src/routes/+page.svelte

352 lines
11 KiB
Svelte
Raw Normal View History

2024-04-23 22:43:13 +10:00
<script>
import links from "../data/links.json";
import DateTime from "$lib/components/DateTime.svelte";
import { getPages } from "$lib/pages";
const pages = getPages();
</script>
<main id="main-content">
<header>
<h1 id="about-me">About Me</h1>
<p>
I'm a 21 year old from Australia (it's
<DateTime display="time" timeZone="Australia/Brisbane" />). I like
cats, Linux, and programming. I have a vision impairment. Some games
I like are: Minecraft, OneShot, Team Fortress 2, Celeste,
<span class="upper">Death Stranding</span>, and Red Dead Redemption
2.
</p>
</header>
<h2 id="links">Links</h2>
<p>Other profiles and places you can find me on the internet:</p>
{#each links as link}
<div class="icon-link">
<img src={"/assets/icons/" + link.icon} alt={link.name} />
<a href={link.href} target="_blank">
{link.name} ({link.username})
</a>
</div>
{/each}
<h3 id="contact">Contact</h3>
<p>
I would prefer if you contact me on the Fediverse
<a href="https://cats.city/@pancakes" target="_blank">
@pancakes@cats.city
</a>
or Matrix
<a href="https://matrix.to/#/@pancakes:void.rehab" target="_blank">
@pancakes:void.rehab
</a>
but I also have a Discord account @trypancakes.
</p>
<h2 id="pages">Pages</h2>
<div class="notice">
<p>
Content under the pages section uses the
<a
href="https://creativecommons.org/licenses/by-sa/4.0/"
target="_blank"
>
Creative Commons Attribution-ShareAlike 4.0 International (CC
BY-SA 4.0)
</a>
license unless specified in the page footer.
</p>
</div>
<dl>
{#each pages as page}
<h3>
<a href={"/" + page.slug + "/"}>
{page.title}
</a>
</h3>
<p>{page.description}</p>
{#if page.published}
<p>
<small>
Published:
<DateTime datetime={page.published} />
{#if page.edited}
&bull; Last edited:
<DateTime
datetime={page.edited}
display="dateTime"
/>
{/if}
</small>
</p>
{/if}
{/each}
</dl>
<h2 id="projects">Projects</h2>
<h3 id="firefish-edits">Firefish Edits</h3>
<p>
A set of CSS snippets for Firefish and Iceshrimp that make the
experience better for me. This includes things such as indicating when
media doesn't have alt text or that a post is mention-only.
</p>
<p>
<a
href="https://codeberg.org/pancakes/firefish-edits"
target="_blank"
rel="noopener noreferrer"
>
View Project
</a>
</p>
<h3 id="scp-wiki-pages">SCP Wiki Pages</h3>
<p>
A Fediverse bot that posts random articles from the
<a
href="https://scp-wiki.wikidot.com"
target="_blank"
rel="noopener noreferrer"
>
SCP Foundation Wiki
</a>
multiple times per day. The bot posts at
<time datetime="00:00">00:00</time>
<time datetime="06:00">06:00</time>,
<time datetime="12:00">12:00</time>, and
<time datetime="18:00">18:00</time> Sydney time. It displays the title, rating,
author, item number, object class/anomaly classification, tags, and an image
when possible.
</p>
<figure>
<img
src="/assets/project/scp_pages/screenshot.png"
alt="A Mastodon post from @scp_pages@botsin.space. The post content matches the general description noted before."
/>
<figcaption>
Example post:
<a
href="https://botsin.space/@scp_pages/111328337740557018"
target="_blank"
>
View Original
</a>
</figcaption>
</figure>
<p>
<a href="https://botsin.space/@scp_pages" target="_blank">
View Project
</a>
</p>
2024-06-05 20:13:26 +10:00
<ul class="buttons">
<li>
<a href="/" title="pancakes">
<img src="/assets/88x31.png" alt="pancakes" />
</a>
</li>
<li>
<a href="https://aagaming.me/" target="_blank" title="aagaming">
<img
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFgAAAAfCAYAAABjyArgAAAACXBIWXMAAAsTAAALEwEAmpwYAAADVUlEQVR4nO3XiU/TYBjH8f59xmjUaIxGjfeBCAIqarxiVETFA5HLKxqPP8ErSiQaTYz3EY+ojG3d0R2EwU73NW1f2nWHTNicW0fSvO3TbW/74dlvbyVJkqhvUjkN6sBSHViqyLdM/at3sFQHxuYxVAVf1chDiAxBZBgmnpj16AuIvoLoG4i+M+uxLxD/BvHvkBgx60kZkl5IKZAK6rVf45Ce0PfTCUs8ZEbE1H52PbOW79x/D8z4feuxAGbyubUefStwP1rriR9idFrrqYAAHhO4k2JM5qBOB56NXV3AkXtZwMMC+Jm1HntdAPi7GB3WelIR0GEBnb+LC8HVDvD4nQzsRxB5LICfmvXoSy0qdOD31vfHv+UAazGR9AnYkBgjAjhmL2BJg70LkQdif8isTzwzokJFNuqxDxD7BPHPEP9q1hMOSLgMZG1M6cDGa9JRAZUC0kVBVnUGS7P952QA/5P57Af8uQ4slRpVXbbF3uX84JWzawvEQ/EdjHsbyNsr3pFS9W1FAsuNYmwBua3SF03tAbu3Wo89Oyp94dQYcAO4G0FuykDeWfILInwTxm7bEXgLyA0ii5szkHeVBjZ0FULXBPItGwK7Noku3mrpYh25feawwQEIXrTWwjftCLxR72IVWW4Ed3MW8m7w7gXvfvAeAN9h8B0B37E/4Pbm1sLXIHzDjsDrRReryCpwRhbLf85i/B3g77TWAucLR0X4ul2BN4Jrs4gJPYuRW4ueDOUkKKdAOZP/fPAShK4YWWwz4LU6slvv4tlMitKVB3cwA/iqDYGda4wuLsXEKKezgPshNAihS5UGqQywjrwOXBuMLtaiwt2kPULjaf3rdTGBs2LsgWBf3hVFDWzToS4H50pwrioOzbMLvFMrin3gPTgN8jntB49Ar0AerE1gRubCyHxwLADHInAshtGlMLoMRlcI5NVmVKhd7Coui/EeMpdt/o48yN16F2vIA7UKPGdGH2A+QjeDpwU8baKL28G7R1sX57xHOQ7+E9qKQj82u/g/ACkPsHajP9UunlfySfCpDx4HtS7Oxe7SshilG4I9tQ1s3LQWFQvLMiFqVPiPgv94/vOBCxDoq21g42a1LF5Stsnxd+oPHv586+J+bUVB8HKlgWa1/QYdo4m5c/5ljgAAAABJRU5ErkJggg=="
alt="AA gaming"
/>
</a>
</li>
<li>
<a
href="https://eris.meows.gay/"
target="_blank"
title="about eris :3"
>
<img
src="https://eris.meows.gay/images/badges/meowsdotgay.png"
alt="meows dot gay meow meow meow"
/>
</a>
</li>
<li>
<a href="https://blueb.me/" target="_blank" title="blueb's website">
<img
src="https://blueb.me/_nuxt/kattgutte.D3vLs2tl.png"
alt="kattgutte er ikke ekte"
/>
</a>
</li>
2024-06-05 20:42:19 +10:00
<li>
<a href="https://elke.cafe/" target="_blank" title="elke.cafe">
<img
src="https://elke.cafe/assets/images/buttons/elke.cafe.gif"
alt="elke dot cafe"
/>
</a>
</li>
2024-06-05 20:13:26 +10:00
<li>
<a
href="https://notfire.cc"
target="_blank"
title="home // notfire.cc"
>
<img
src="https://notfire.cc/design/images/buttons/notfire-cc-88x31-af.gif"
alt="not fire dot CC"
/>
</a>
</li>
<li>
<a
href="https://micro.pages.gay"
target="_blank"
title="micro's site"
>
<img src="/assets/buttons/micro.png" alt="Micro" />
</a>
</li>
<li>
<a
href="https://sneexy.pages.gay/"
target="_blank"
title="sneexy dot pages dot gay"
>
<img
src="https://sneexy.pages.gay/assets/buttons/sneexy.png"
alt="Sneexy"
/>
</a>
</li>
<li>
<a href="https://void.rehab" target="_blank" title="void.rehab">
<img
src="https://void.rehab/88x31/void.rehab.png"
alt="void dot rehab"
/>
</a>
</li>
<li>
<a href="https://w.on-t.work/" target="_blank" title="Won't Work!">
<img
src="https://w.on-t.work/assets/88x31.png"
alt="wont work"
/>
</a>
</li>
</ul>
2024-04-23 22:43:13 +10:00
2024-06-05 20:13:26 +10:00
<ul class="buttons">
<li>
2024-04-23 22:43:13 +10:00
<img
2024-06-05 20:13:26 +10:00
src="/assets/buttons/anythingbutchrome.gif"
alt="Anything But Chrome"
title="Anything But Chrome"
2024-04-23 22:43:13 +10:00
/>
2024-06-05 20:13:26 +10:00
</li>
<li>
<img
src="/assets/buttons/archlinux.gif"
alt="arch linux"
title="arch linux"
/>
</li>
<li>
<img
src="/assets/buttons/debian.png"
alt="Powered by debian"
title="Powered by debian"
/>
</li>
<li>
<img
src="/assets/buttons/emulate.gif"
alt="Emulate Now!"
title="Emulate Now!"
/>
</li>
<li>
<img
src="/assets/buttons/getfirefox.gif"
alt="Get Firefox"
title="Get Firefox"
/>
</li>
<li>
<img
src="/assets/buttons/fediverse.gif"
alt="Join the Fediverse"
title="Join the Fediverse"
/>
</li>
<li>
<img
src="/assets/buttons/knbutton.gif"
alt="KDE Now!"
title="KDE Now!"
/>
</li>
<li>
<img
src="/assets/buttons/xenia.gif"
alt="Linux Now!"
title="Linux Now!"
/>
</li>
<li>
<img
src="/assets/buttons/paws.png"
alt="made with My Own Two Paws"
title="made with MY OWN TWO PAWS"
/>
</li>
<li>
<img src="/assets/buttons/scp.png" alt="SCP" title="SCP" />
</li>
<li>
2024-04-23 22:43:13 +10:00
<img
src="/assets/buttons/team_fortress_get_it.gif"
2024-06-05 20:13:26 +10:00
alt="Team Fortress Get It!"
title="Team Fortress GET IT!"
2024-04-23 22:43:13 +10:00
/>
2024-06-05 20:13:26 +10:00
</li>
<li>
<img
src="/assets/buttons/ublock.png"
alt="uBlock Origin Now!"
title="uBlock Origin Now!"
/>
</li>
<li>
<img src="/assets/buttons/wii.png" alt="Wii" title="Wii" />
</li>
</ul>
2024-04-23 22:43:13 +10:00
</main>
<style>
2024-06-05 20:13:26 +10:00
ul.buttons {
2024-04-23 22:43:13 +10:00
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap: 0.25rem;
justify-content: center;
2024-06-05 20:13:26 +10:00
padding: 0;
margin: 0;
list-style: none;
}
ul.buttons + ul.buttons {
margin-top: 1rem;
2024-04-23 22:43:13 +10:00
}
2024-06-05 20:13:26 +10:00
ul.buttons img {
2024-04-23 22:43:13 +10:00
image-rendering: pixelated;
width: 88px;
height: 31px;
}
</style>