leilukin-site/blog/posts/index.html

680 lines
21 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="en" dir="ltr" id="top">
<head>
<meta property="og:title" content="Blog Archive">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="author" content="Leilukin">
<meta name="description" content="Archive of blog posts on Leilukin's Hub">
<meta name="generator" content="Eleventy v3.0.0">
<meta property="og:type" content="website">
<meta property="og:url" content="https://leilukin.com/blog/posts/">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:locale" content="en_MY">
<meta property="og:description" content="Archive of blog posts on Leilukin's Hub">
<meta name="twitter:card" content="summary">
<meta name="twitter:url" content="https://leilukin.com/blog/posts/">
<meta name="twitter:description" content="Archive of blog posts on Leilukin's Hub">
<link rel="canonical" href="https://leilukin.com/blog/posts/">
<link rel="preload" href="/assets/fonts/lexend/lexend-v19-latin-regular.woff2" as="font" type="font/woff2" crossorigin>
<link rel="preload" href="/assets/fonts/lexend/lexend-v19-latin-700.woff2" as="font" type="font/woff2" crossorigin>
<style>
@font-face {
font-display: swap;
font-family: 'Lexend';
font-style: normal;
font-weight: 400;
src: url('/assets/fonts/lexend/lexend-v19-latin-regular.woff2') format('woff2');
}
@font-face {
font-display: swap;
font-family: 'Lexend';
font-style: normal;
font-weight: 600;
src: url('/assets/fonts/lexend/lexend-v19-latin-600.woff2') format('woff2');
}
@font-face {
font-display: swap;
font-family: 'Lexend';
font-style: normal;
font-weight: 700;
src: url('/assets/fonts/lexend/lexend-v19-latin-700.woff2') format('woff2');
}
</style>
<link rel="stylesheet" href="/assets/fonts/intel-one-mono/intel-one-mono.css">
<link rel="stylesheet" href="/assets/css/global.css"><link rel="stylesheet" href="/assets/css/general.css"><link rel="stylesheet" href="/assets/css/content.css"><link rel="stylesheet" href="/assets/css/plugins.css"><link rel="stylesheet" href="/assets/css/components.css"><link rel="stylesheet" href="/assets/css/pridesymbols.css"><link rel="stylesheet" href="/assets/css/utility.css">
<style>.blog__postlist {
display: grid;
gap: 1em;
padding-left: 1em;
}
.blog__postlist--title {
font-size: clamp(1.55rem, 1rem + 3vw, 1.3rem);
line-height: 1.3;
margin-bottom: 0.2em;
}
.content__nav {
padding: 1.2em clamp(1em, 5%, 1.5em);
background-color: var(--clr-content-bg);
}
.content__nav--title {
font-size: 1.7rem;
}
.breadcrumbs {
list-style-type: "";
padding: 0;
margin: 0 0 0.7em 0;
display: flex;
gap: 0.5em;
flex-wrap: wrap;
justify-content: center;
}
.breadcrumbs li::after {
content: '➔';
padding-left: 0.3em;
}
.blog__post--pagination {
padding-top: 1em;
margin-top: 2.5em;
border-top: 0.1em solid var(--clr-title-border);
}
.blog__post--nextprev {
list-style-type: "";
padding: 0;
margin: 0;
display: grid;
gap: 0.7em;
grid-template-columns: repeat(2, 1fr);
grid-template-areas: 'prev next';
}
.blog__post--prev { grid-area: prev; }
.blog__post--next { grid-area: next; }
.hero img { filter:
drop-shadow(0.1rem 0.1rem 0.2rem black)
drop-shadow(0.1rem 0.1rem 0.2rem rgba(30, 30, 30, 0.8))
; }
.hero {
width: 100%;
background-color: var(--clr-hero-bg);
display: flex;
flex-direction: column;
justify-content: center;
text-align: center;
}
.hero__top-bar {
background-color: var(--clr-navbar-bg);
width: 100%;
padding: 0.5em 0.7em;
}
.hero__img {
display: grid;
place-content: center;
}
.hero img {
object-fit: contain;
overflow: hidden;
max-height: 16rem;
}
.navbar {
background: var(--clr-navbar-bg);
width: 100%;
z-index: 998;
position: sticky;
top: 0;
padding: 0.6em;
}
.navbar__menu {
list-style-type: "";
margin: 0;
padding: 0;
display: flex;
gap: 1em;
flex-wrap: wrap;
text-align: center;
}
.navbar__menu a {
color: var(--clr-navbar-link);
text-decoration: none;
cursor: pointer;
display: inline-block;
}
.navbar__menu a:hover { color: var(--clr-link-hover); }
.navbar__menu a:focus { outline-offset: 0.2em; }
.navbar__links {
display: flex;
flex-wrap: wrap;
justify-content: space-evenly;
gap: 0.5em;
}
.navbar__toggle {
background-color: inherit;
color: var(--clr-navbar-link);
border: none;
padding: 0;
font-size: 1.25rem;
font-weight: 700;
display: none;
align-items: center;
gap: 0.3em;
}
.navbar__toggle svg { fill: currentColor; }
.navbar__toggle:focus,
.navbar__menu a:focus { outline-offset: 0.1em; }
.navbar__toggle:focus,
.navbar__menu a:focus { outline: 0.15em solid var(--clr-navbar-link); }
.navbar__popover {
background-color: var(--clr-navbar-bg);
border: 0.15em solid var(--clr-navbar-link);
padding: 1.5em;
max-width: 85%;
}
.navbar__popover::backdrop {
background-color: black;
opacity: 0.5;
}
@supports selector([popover]) {
.navbar__toggle { display: flex; }
.navbar__links { display: none; }
}
/* Tablet screen size */
@media only screen and (min-width: 43.75rem) {
.navbar { padding: 1em 0.6em; }
.navbar__toggle, .navbar__popover { display: none; }
.navbar__links { display: flex; }
}
.top-btn,
.top-btn:hover {
color: var(--clr-top-btn-txt);
text-decoration: none;
}
.top-btn {
position: fixed;
bottom: 0.5rem;
right: 0.5rem;
z-index: 999;
background-color: var(--clr-top-btn-bg);
display: flex;
align-items: center;
border-radius: 50em;
padding: 0.3em 0.5em;
gap: 0.2em;
}
.top-btn:focus {
outline: 0.25em solid var(--clr-top-btn-bg);
outline-offset: 0.15em;
}
.top-btn__arrow {
display: inline-block;
width: 1em;
aspect-ratio: 1 / 1;
stroke-width: 0;
stroke: currentColor;
fill: currentColor;
}
:root { --footer-gap: 0.5em; }
.footer {
margin-top: auto;
width: 100%;
background: var(--clr-main-footer-bg);
padding: 1.5rem 1rem clamp(1.5rem, calc(100% - 1.5rem), 3.5rem);
text-align: center;
display: grid;
gap: var(--footer-gap);
}
.footer__links,
.footer__shrines {
display: flex;
flex-wrap: wrap;
justify-content: center;
column-gap: var(--footer-gap);
}
.footer__links { justify-self: center; }
.footer__shrines { align-self: center; }</style>
<link rel="apple-touch-icon" sizes="180x180" href="/assets/favicon/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/assets/favicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/assets/favicon/favicon-16x16.png">
<link rel="manifest" href="/assets/favicon/site.webmanifest">
<link rel="me" href="mailto:contact@leilukin.com">
<link rel="me" href="https://mstdn.social/@leilukin">
<link rel="me" href="https://twitter.com/Leilukin">
<link rel="me" href="https://github.com/Leilukin">
<link rel="authorization_endpoint" href="https://indieauth.com/auth">
<link rel="webmention" href="https://webmention.io/leilukin.com/webmention">
<script src="/assets/js/MnPoD-suxd.js" defer></script>
<title>
Blog Archive | Leilukin's Hub
</title>
</head>
<body>
<div class="skip-btn"><a href="#content">Skip to content</a></div>
<header class="hero">
<div class="hero__top-bar hidden"></div>
<div class="hero__img">
<img fetchpriority="high" src="/assets/leilukin/Leilukins-Hub-website-banner.avif" alt="Banner of Leilukin's Hub" width="900" height="300">
</div>
</header>
<nav class="navbar" aria-labelledby="top-level-nav-title">
<h2 class="visually-hidden" id="top-level-nav-title">Top Level</h2>
<ul class="navbar__menu navbar__links">
<li>
<a href="/">Home</a>
</li>
<li>
<a href="/about/">About</a>
</li>
<li>
<a href="/now/">Now</a>
</li>
<li>
<a href="/blog/">Blog</a>
</li>
<li>
<a href="/articles/">Articles</a>
</li>
<li>
<a href="/projects/">Projects</a>
</li>
<li>
<a href="/shrines/">Shrines</a>
</li>
<li>
<a href="/adoptables/">Adoptables</a>
</li>
<li>
<a href="/links/">Links</a>
</li>
<li>
<a href="/guestbook/">Guestbook</a>
</li>
</ul>
<button class="navbar__toggle" popovertarget="nav-menu" aria-label="Toggle navigation menu">
<svg aria-hidden="true" focusable="false" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--!Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M0 96C0 78.3 14.3 64 32 64l384 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 128C14.3 128 0 113.7 0 96zM0 256c0-17.7 14.3-32 32-32l384 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 288c-17.7 0-32-14.3-32-32zM448 416c0 17.7-14.3 32-32 32L32 448c-17.7 0-32-14.3-32-32s14.3-32 32-32l384 0c17.7 0 32 14.3 32 32z"/></svg>
Navigation
</button>
</nav>
<div popover id="nav-menu" class="navbar__popover">
<ul class="navbar__menu">
<li>
<a href="/">Home</a>
</li>
<li>
<a href="/about/">About</a>
</li>
<li>
<a href="/now/">Now</a>
</li>
<li>
<a href="/blog/">Blog</a>
</li>
<li>
<a href="/articles/">Articles</a>
</li>
<li>
<a href="/projects/">Projects</a>
</li>
<li>
<a href="/shrines/">Shrines</a>
</li>
<li>
<a href="/adoptables/">Adoptables</a>
</li>
<li>
<a href="/links/">Links</a>
</li>
<li>
<a href="/guestbook/">Guestbook</a>
</li>
</ul>
</div>
<main id="content">
<header class="main__header">
<h1>Blog Archive</h1>
<p>Archive of blog posts on Leilukin&#39;s Hub</p>
</header>
<content-wrapper>
<div class="content">
<ul class="blog__postlist">
<li class="blog__postlist--item">
<h2 class="blog__postlist--title">
<a href="/blog/posts/2024-07-27-hostinger-migration-leilukins-hub/">
Leilukin&#39;s Hub Has Migrated to Hostinger
</a>
</h2>
<p>27 July 2024</p>
</li>
<li class="blog__postlist--item">
<h2 class="blog__postlist--title">
<a href="/blog/posts/2024-07-02-fanlisting-collective-launch/">
Cassette Beasts Fanlisting and My Fanlisting Collective Launched
</a>
</h2>
<p>2 July 2024</p>
</li>
<li class="blog__postlist--item">
<h2 class="blog__postlist--title">
<a href="/blog/posts/2024-06-24-cassette-beasts-fanlisting-approved/">
My Cassette Beasts Fanlisting Application has been Approved
</a>
</h2>
<p>24 June 2024</p>
</li>
<li class="blog__postlist--item">
<h2 class="blog__postlist--title">
<a href="/blog/posts/2024-06-21-leilukins-hub-tumbleblog-launched/">
Leilukin&#39;s Hub Tumbleblog Launched
</a>
</h2>
<p>21 June 2024</p>
</li>
<li class="blog__postlist--item">
<h2 class="blog__postlist--title">
<a href="/blog/posts/2024-06-12-performance-improvement-leilukins-hub/">
Improving Site Performance of Leilukin&#39;s Hub
</a>
</h2>
<p>12 June 2024</p>
</li>
<li class="blog__postlist--item">
<h2 class="blog__postlist--title">
<a href="/blog/posts/2024-05-31-domain-name-hosting-change-leilukins-hub/">
Custom Domain Name and Hosting Change for Leilukin&#39;s Hub
</a>
</h2>
<p>31 May 2024</p>
</li>
<li class="blog__postlist--item">
<h2 class="blog__postlist--title">
<a href="/blog/posts/2024-05-29-new-guestbook-leilukins-hub/">
The Search for a Guestbook Solution for Leilukin&#39;s Hub
</a>
</h2>
<p>29 May 2024</p>
</li>
<li class="blog__postlist--item">
<h2 class="blog__postlist--title">
<a href="/blog/posts/2024-05-14-james-somerton-my-video-game-footage/">
James Somerton Used My Video Game Footage Without Credit or Permission
</a>
</h2>
<p>14 May 2024</p>
</li>
<li class="blog__postlist--item">
<h2 class="blog__postlist--title">
<a href="/blog/posts/2024-04-27-lesbian-visibility-day1-year-anniversary-of-cassette-beasts/">
Happy Lesbian Visibility Day and 1-Year Anniversary of Cassette Beasts
</a>
</h2>
<p>27 April 2024</p>
</li>
<li class="blog__postlist--item">
<h2 class="blog__postlist--title">
<a href="/blog/posts/2024-04-21-april-2024-leilukins-hub-overhaul-with-eleventy/">
April 2024 Leilukin&#39;s Hub Overhaul with Eleventy
</a>
</h2>
<p>21 April 2024</p>
</li>
<li class="blog__postlist--item">
<h2 class="blog__postlist--title">
<a href="/blog/posts/2024-03-06-i-received-a-lifetime-premium-membership-on-nexus-mods-for-free/">
I Received a Lifetime Premium Membership on Nexus Mods for Free
</a>
</h2>
<p>6 March 2024</p>
</li>
<li class="blog__postlist--item">
<h2 class="blog__postlist--title">
<a href="/blog/posts/2023-11-20-finally-beat-a-bugs-life-video-game-24-years-later/">
Finally Beat A Bug&#39;s Life The Video Game — 24 Years Later
</a>
</h2>
<p>20 November 2023</p>
</li>
<li class="blog__postlist--item">
<h2 class="blog__postlist--title">
<a href="/blog/posts/2023-11-19-i-can-finally-game-on-a-solid-state-drive/">
I Can Finally Game on a Solid-State Drive
</a>
</h2>
<p>19 November 2023</p>
</li>
<li class="blog__postlist--item">
<h2 class="blog__postlist--title">
<a href="/blog/posts/2023-10-30-support-for-my-steam-review-of-a-summers-end/">
Support for My Steam Review of A Summers End — Hong Kong 1986
</a>
</h2>
<p>30 October 2023</p>
</li>
<li class="blog__postlist--item">
<h2 class="blog__postlist--title">
<a href="/blog/posts/2023-10-13-my-cassette-beasts-pombomb-plushie-arrived/">
My Cassette Beasts Pombomb Plushie Arrived!
</a>
</h2>
<p>13 October 2023</p>
</li>
<li class="blog__postlist--item">
<h2 class="blog__postlist--title">
<a href="/blog/posts/2023-09-11-happy-1st-anniversary-to-leilukins-hub/">
Happy 1st Anniversary to Leilukin&#39;s Hub
</a>
</h2>
<p>11 September 2023</p>
</li>
<li class="blog__postlist--item">
<h2 class="blog__postlist--title">
<a href="/blog/posts/2023-07-28-my-first-birthday-after-the-launch-of-leilukins-hub/">
My First Birthday After the Launch of Leilukin&#39;s Hub
</a>
</h2>
<p>28 July 2023</p>
</li>
<li class="blog__postlist--item">
<h2 class="blog__postlist--title">
<a href="/blog/posts/2023-06-23-june-2023-leilukins-hub-layout-rewrite/">
June 2023 Leilukin&#39;s Hub Layout Rewrite
</a>
</h2>
<p>23 June 2023</p>
</li>
<li class="blog__postlist--item">
<h2 class="blog__postlist--title">
<a href="/blog/posts/2023-05-09-onboard-the-dracula-daily-hype-train/">
Onboard the Dracula Daily Hype Train
</a>
</h2>
<p>9 May 2023</p>
</li>
<li class="blog__postlist--item">
<h2 class="blog__postlist--title">
<a href="/blog/posts/2023-01-28-leilukins-hub-now-has-a-blog/">
Leilukin&#39;s Hub Now has a Blog!
</a>
</h2>
<p>28 January 2023</p>
</li>
<li class="blog__postlist--item">
<h2 class="blog__postlist--title">
<a href="/blog/posts/2023-01-26-new-year-leilukins-hub-redesign/">
2023 New Year Redesign of Leilukin&#39;s Hub
</a>
</h2>
<p>26 January 2023</p>
</li>
</ul>
</div>
<aside class="right-sidebar" aria-label="Right sidebar">
<nav class="content__nav sidebar--sticky" aria-labelledby="my-contents-title">
<h2 class="content__nav--title" id="my-contents-title">My Contents</h2>
<ul class="content__nav--links">
<li><a href="/archive/">Content Archive</a></li>
<li><a href="/categories/">Content Categories</a></li>
<li><a href="/articles/">Articles</a></li>
<li><a href="/blog/posts/">Blog Archive</a></li>
<li><a href="/blog/">Blog Home</a></li>
</ul>
</nav>
</aside>
</content-wrapper>
</main>
<footer class="footer">
<p>Made with ♥ by Leilukin since 11 September 2022</p>
<ul class="inline-nav footer__links">
<li><a href="/feed.xml">RSS</a></li>
<li><a
href="/sitemap/
">Site Map</a></li>
<li><a
href="/changelogs/"
>Changelogs</a></li><li><a
href="/accessibility/"
>Accessibility</a></li><li><a
href="/colophon/"
>Colophon</a></li></ul>
<p><a href="mailto:contact@leilukin.com">Contact me by email</a></p><div class="h-card hidden">
<span class="p-name p-nickname">Leilukin</span>
<a href="/" class="u-url">Home page</a>
<img src="https://i.postimg.cc/RZJgS6tY/leilukin-bee.avif" alt="Leilukin" class="u-photo" loading="lazy">
<span class="p-country-name">Malaysia</span>
<span class="p-note">They/she. A proudly queer and autistic <span class="p-gender-identity">non-binary</span> lesbian from Malaysia.</span>
</div><a href="#top" class="top-btn">
<svg class="top-btn__arrow" focusable="false" aria-hidden="true" viewBox="0 0 26 28">
<path d="M25.172 15.172c0 0.531-0.219 1.031-0.578 1.406l-1.172 1.172c-0.375 0.375-0.891 0.594-1.422 0.594s-1.047-0.219-1.406-0.594l-4.594-4.578v11c0 1.125-0.938 1.828-2 1.828h-2c-1.062 0-2-0.703-2-1.828v-11l-4.594 4.578c-0.359 0.375-0.875 0.594-1.406 0.594s-1.047-0.219-1.406-0.594l-1.172-1.172c-0.375-0.375-0.594-0.875-0.594-1.406s0.219-1.047 0.594-1.422l10.172-10.172c0.359-0.375 0.875-0.578 1.406-0.578s1.047 0.203 1.422 0.578l10.172 10.172c0.359 0.375 0.578 0.891 0.578 1.422z"></path>
</svg>
Back to Top
</a>
</footer>
</body>
</html>