Move out original site folder

This commit is contained in:
Helen Chong 2024-04-06 11:54:28 +08:00
parent 06d7c22aec
commit a16f4c2464
191 changed files with 9 additions and 9507 deletions

View File

@ -17,10 +17,18 @@ jobs:
steps: steps:
- uses: actions/checkout@v4 - uses: actions/checkout@v4
# Set up any tools and build steps here # Set up any tools and build steps here
- name: Use Node.js
uses: actions/setup-node@v4
with:
node-version: lts/*
- name: Install deps and build
run: |
bun i
bun run build
# When the dist_dir is ready, deploy it to neocities # When the dist_dir is ready, deploy it to neocities
- name: Deploy to neocities - name: Deploy to neocities
uses: bcomnes/deploy-to-neocities@v2.0.2 uses: bcomnes/deploy-to-neocities@v2.0.2
with: with:
api_token: ${{ secrets.NEOCITIES_API_TOKEN }} api_token: ${{ secrets.NEOCITIES_API_TOKEN }}
cleanup: true cleanup: true
dist_dir: Leilukins-Hub dist_dir: "_site/"

View File

@ -1,119 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr" id="page-top">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:url" content="https://leilukin.neocities.org/about">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="About">
<meta property="og:description" content="About this website and its owner.">
<link rel="stylesheet" href="/css/style-main.css" type="text/css" media="all">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.1/css/all.css">
<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">
<script src="/js/main-components.js" defer></script>
<title>About | Leilukin's Hub</title>
</head>
<body>
<header class="main-header">
<noscript>
JavaScript is disabled in your browser. To get the best user experience on
this website, it is recommended that you enable it.
</noscript>
</header>
<nav class="navbar"></nav>
<main>
<!-- <aside class="left-sidebar">
Left sidebar content here
</aside> -->
<article class="divided-article">
<section class="content-section">
<h1>About</h1>
<p>Learn more about this website and its owner.</p>
</section>
<section class="content-section">
<h2>The Site</h2>
<p>This website serves as a personal hub for my interests and self-expression, as well as my own corner on the internet outside social media platforms.</p>
<p>On this site, you can find various stuff and resources I have created or compiled, as well as articles dedicated to my interests.</p>
<p>While the primary purpose of this website is my own space of self-expression, I also want my website to be accessible to viewers. Therefore, I strive to design this website to be mobile-friendly and accessible to provide the best user experience with my site.</p>
<p>Feel free to drop a message and say hi on <a href="https://leilukin.123guestbook.com/" target="_blank">my guestbook</a>!</p>
<p>You can link to my website with this button:</p>
<div class="site-btn__container">
<div>
<a href="https://leilukin.neocities.org/" target="_blank"><img src="/assets/Leilukins-Hub-button.png" alt="Button of Leilukin's Hub" title="Leilukin's Hub"></a>
</div>
<textarea class="site-btn__textarea textarea-for-copy"><a href="https://leilukin.neocities.org/" target="_blank"><img src="https://leilukin.neocities.org/assets/Leilukins-Hub-button.png" alt="Button of Leilukin's Hub" title="Leilukin's Hub"></a></textarea>
<button class="copy-txt-btn">Copy HTML</button>
<script>
document.querySelector(".copy-txt-btn").onclick = () => {
document.querySelector(".textarea-for-copy").select();
document.execCommand('copy');
}
</script>
</div>
<p>If you also have a Neocities account, you can follow this site through its <a href="https://neocities.org/site/leilukin" target="_blank">Neocities profile</a>.</p>
<a href="https://neocities.org/site/leilukin" target="_blank"><img src="/assets/hosted-by-neocities.png" alt="a website button with Penelope the cat, the mascot of Neocities, and the text &quot;hosted by neocities&quot;" title="Hosted by Neocities"></a>
</section>
<sectioin class="content-section">
<h2>The Site Owner</h2>
<img src="/assets/leilukin-bee.png" style="border-radius: 50%; width: 15rem; display: flex; margin: 0.5em auto;">
<p>You can call me Leilukin. I am a Malaysian Chinese non-binary lesbian born in the early 90s. My pronouns are they/she/他/她.</p>
<p>I speak Mandarin, English, Cantonese and Malay, though I am most fluent in Mandarin and English.</p>
<p>I am also autistic, so this website serves as a platform for my special interests.</p>
<p>Social media platforms you can find me on:<br>
<a href="https://lesbiannova.tumblr.com/" target="_blank">Tumblr</a> |
<a href="https://www.youtube.com/Leilukin" target="_blank">YouTube</a> |
<a href="https://twitter.com/Leilukin" target="_blank">Twitter</a> |
<a href="https://mstdn.social/@leilukin" target="_blank">Mastodon</a> |
<a href="https://elekk.xyz/@leilukin" target="_blank">Mastodon (for gaming)</a> |
<a href="https://bsky.app/profile/leilukin.bsky.social" target="_blank">Blusky</a> |
<a href="https://www.instagram.com/leilukin" target="_blank">Instagram</a>
</p>
<p>However, I am most active on Tumblr, so if you want to interact with me on a social media platform, Tumblr would be the best option.</p>
<p>I also have media catalogues online on the following platforms:<br>
<a href="https://steamcommunity.com/id/leilukin/" target="_blank">Steam</a> |
<a href="https://app.thestorygraph.com/profile/leilukin" target="_blank">The StoryGraph</a>
</p>
<p>You can contact me via email: <a href="mailto:leilukin@outlook.com">leilukin@outlook.com</a>.</p>
<p>If you enjoy my work, you can support me on Ko-Fi or Buy Me a Coffee:
<script type='text/javascript' src='https://storage.ko-fi.com/cdn/widget/Widget_2.js'></script><script type='text/javascript'>kofiwidget2.init('Support Me on Ko-fi', '#7A37A3', 'A1042UH4');kofiwidget2.draw();</script><br><br>
<script type="text/javascript" src="https://cdnjs.buymeacoffee.com/1.0.0/button.prod.min.js" data-name="bmc-button" data-slug="leilukin" data-color="#7a37a3" data-emoji="" data-font="Cookie" data-text="Buy me a coffee" data-outline-color="#ffffff" data-font-color="#ffffff" data-coffee-color="#FFDD00" ></script>
</p>
</sectioin>
</article>
<!-- <aside class="right-sidebar">
Right sidebar content here
</aside> -->
</main>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -1,75 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr" id="page-top">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:url" content="https://leilukin.neocities.org/articles/designated-lesbian-syndrome-fandom">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="Designated Lesbian Syndrome in Fandom">
<meta property="og:description" content="On fandom's tokenisation of lesbians, and how I hate it as a lesbian myself.">
<link rel="stylesheet" href="/css/style-main.css" type="text/css" media="all">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.1/css/all.css">
<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">
<script src="/js/main-components.js" defer></script>
<title>Designated Lesbian Syndrome in Fandom | Articles | Leilukin's Hub</title>
</head>
<body>
<header class="main-header">
<noscript>
JavaScript is disabled in your browser. To get the best user experience on
this website, it is recommended that you enable it.
</noscript>
</header>
<nav class="navbar"></nav>
<main>
<!-- <aside class="left-sidebar">
Left sidebar content here
</aside> -->
<article>
<h1>Designated Lesbian Syndrome in Fandom</h1>
<div class="center-text">
<p>Written by Leilukin</p>
<p>Originally published on 18 August 2023</p>
</div>
<p>Over the years of interacting with and observing fandom, I have come to <a href="my-dislike-of-shipping-culture.html" target="_blank">dislike fandom and shipping culture</a> for many reasons. One major reason I want to talk about here is the "Designated Lesbian Syndrome" phenomenon.</p>
<p>I first encountered this term from <a href="https://desolationlesbian.tumblr.com/post/662432767484870656/designated-lesbian-syndrome-n-when-fans-of-a" target="_blank">this Tumblr post</a> made by user desolationlesbian:</p>
<blockquote>
<p>Designated Lesbian Syndrome (n.): When fans of a piece of media pick two female characters and pair them together as the token F/F ship and put them in everything, but do not bother to engage with their dynamic in any way more substantive than having them hold hands in the background. Everyone agrees its a good ship and it has nothing but their full support, yet this never materializes into real effort or content creation.</p>
<p>Most common with works that have little-to-no narratively important women, but in rare cases can even happen to major and complex characters who are then reduced to token background lesbians as everyone hones in on the boys.</p>
</blockquote>
<p>The example I am most familiar with is the fandom of Grand Admiral Thrawn and the Chiss from <cite>Star Wars</cite> — specifically, some shippers of Thrawn/Eli Vanto, also known as Thranto, pair Ar'alani and Karyn Faro as their token "pair-the-spares" femslash ship. However, while Thranto shippers have create fan content about the Ar'alani/Karyn Faro ship, they do not do it with even a fraction of the interest and enthusiasm as they do Thranto. This is evident in the difference between the amount of fan works these two pairings have received on Archive On Our Own (AO3): as of this writing, the <a href="https://archiveofourown.org/tags/Thrawn%20%7C%20Mitth'raw'nuruodo*s*Eli%20Vanto/works" target="_blank">Thrawn | Mitth'raw'nuruodo/Eli Vanto</a> tag contains 1,358 works, while the <a href="https://archiveofourown.org/tags/Ar'alani*s*Karyn%20Faro/works" target="_blank">Ar'alani/Karyn Faro</a> tag contains 34 works only. It is also worth noting that if you use the tag page's filter function, you will notice that out of these 34 Ar'alani/Faro works, 23 of them are also tagged with Thrawn/Eli Vanto, proving the significant overlap between Thranto and Ar'alani/Faro shippers.</p>
<p>Part of the Designated Lesbian Syndrome also involves shippers headcanonning the female characters who could be considered "threats" to their favourite ship that involved male characters as lesbians. It does not matter if the female characters are actually romantically involved with the male characters' in the source material or not. Thrawn never has a canon love interest in both <cite>Legends</cite> and the Disney continuities, but the fact that Ar'alani and Faro are close to Thrawn as his long-time friend and protégée respectively is enough to make them the go-to candidates for lesbian headcanons from shippers who ship Thrawn with anyone else. Lesbian Ar'alani and Faro headcanons are most common among Thrawn/Eli shippers, but I had seen at least one Thrawn/Governor Pryce (a pairing that I cannot stand at all) shipper literally headcanons Ar'alani as a lesbian so Pryce does not need to worry about Ar'alani fighting with Pryce over Thrawn.</p>
<p>Ar'alani and Karyn Faro are unfortunately perfect examples of the above post by desolationlesbian of major female characters who are reduced to token background lesbians by shippers. As a huge fan of both Ar'alani and Faro as characters, I find it immensely frustrating, to the extent that the Thrawn shipping fandom has utterly turned me off on both Thranto and Ar'alani/Faro ships.</p>
<p>As a lesbian myself, I loathe the Designated Lesbian Syndrome with a passion, because this phenomenon is literally tokenism, specifically tokenisation of lesbians. As a consequence, I have reached the point where when it comes to fandoms with big Male/Male (M/M) ships that are not canon, I only trust lesbian headcanons from fellow lesbians. Yes, this means I do not trust lesbian Ar'alani and Karyn Faro headcanons from people who are not lesbians.</p>
<p>I really hate that it comes to this because as a lesbian, in theory I am in favour of lesbian headcanons for female characters who are cishet-coded or who do not have a canon sexuality. Unfortunately, lesbian headcanons have been used as a progressive way to get female characters out of the way of Male/Male ships (and occasionally Male/Female ships as well, though this phenomenon is more common in fandoms of M/M ships), not because these shippers actually care about lesbians and the female characters.</p>
<p>These shippers rarely put as much energy in talking about or creating fan content for the female characters they headcanon as lesbians as they do the male characters from their ships. These shippers can pretend they care about lesbians all they want, but my lesbian ass can see through their performative bullshit, and recognise their lesbian headcanons are nothing more than tokenism.</p>
</article>
<!-- <aside class="right-sidebar">
Right sidebar content here
</aside> -->
</main>
<footer class="main-footer"></footer>
</body>
</htm

View File

@ -1,68 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr" id="page-top">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:url" content="https://leilukin.neocities.org/articles">
<meta property="og:type" content="website">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="Articles | Leilukin's Hub">
<meta property="og:description" content="List of articles published on my website.">
<link rel="stylesheet" href="/css/style-main.css" type="text/css" media="all">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.1/css/all.css">
<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">
<script src="/js/main-components.js" defer></script>
<title>Articles | Leilukin's Hub</title>
</head>
<body>
<header class="main-header">
<noscript>
JavaScript is disabled in your browser. To get the best user experience on
this website, it is recommended that you enable it.
</noscript>
</header>
<nav class="navbar"></nav>
<main>
<!-- <aside class="left-sidebar">
Left sidebar content here
</aside> -->
<div class="content-container">
<section class="content-section">
<h1>Articles</h1>
<p>List of articles I have written.</p>
</section>
<section class="content-section">
<h2>Fandom Culture</h2>
<ul class="article-list">
<li><a href="my-dislike-of-shipping-culture.html">My Disinterest in Shipping and Dislike of Shipping Culture</a></li>
<li><a href="designated-lesbian-syndrome-fandom.html">Designated Lesbian Syndrome in Fandom</a></li>
</ul>
</section>
<section class="content-section">
<h2>Specific Video Games with Their Own Pages</h2>
<ul class="article-list">
<li>My <cite>Cassette Beasts</cite> shrine <a href="/shrines/cassettebeasts/articles/">Articles</a> page</li>
<li>My <cite>Star Wars: Knights of the Old Republic</cite> shrine <a href="/shrines/starwarskotor/articles/">Articles</a> page</li>
</ul>
</section>
</div>
<!-- <aside class="right-sidebar">
Right sidebar content here
</aside> -->
</main>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -1,65 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr" id="page-top">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:url" content="https://leilukin.neocities.org/articles/my-dislike-of-shipping-culture">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="My Disinterest in Shipping and Dislike of Shipping Culture">
<meta property="og:description" content="On my lack of interest in shipping and dislike of shipping culture in fandom, and why.">
<link rel="stylesheet" href="/css/style-main.css" type="text/css" media="all">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.1/css/all.css">
<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">
<script src="/js/main-components.js" defer></script>
<title>My Disinterest in Shipping and Dislike of Shipping Culture | Articles | Leilukin's Hub</title>
</head>
<body>
<header class="main-header">
<noscript>
JavaScript is disabled in your browser. To get the best user experience on
this website, it is recommended that you enable it.
</noscript>
</header>
<nav class="navbar"></nav>
<main>
<!-- <aside class="left-sidebar">
Left sidebar content here
</aside> -->
<article>
<h1>My Disinterest in Shipping and Dislike of Shipping Culture</h1>
<div class="center-text">
<p>Written by Leilukin</p>
<p>Originally published on 14 August 2023</p>
<p>{Note: The original version of this writing was posted on my Tumblr blog on 3 May 2021}</p>
</div>
<p>I feel that the older I get, the less interested I am in shipping in general, and the less I can understand grown adults in late 20s or older who build their personality around shipping and cannot engage with any fiction without shipping something (before I remade my Tumblr account in 2015, I used to follow a 30-something-year-old fandom blogger who was literally like this).</p>
<p>I have also come to actually dislike shipping culture, especially the mindset of engaging with media primarily through a shipping lens at the expense of the characterisation, non-romantic relationships, themes, and general content of a piece of media. Throughout my years of experience with various fandoms, I have witnessed so many incredible characters and non-romantic relationships get ignored or underappreciated by the fandom because theyre not part of a popular ship. On the other hand, there are also many amazing characters get mischaracterised to make a fanon ship work, or get reduced to a handful of tropes as shippers Flanderise them in their shipping fan works.</p>
<p>Do not even get me started on the shippers who will complain about not being able to enjoy a piece of media just because “theres no couple to ship”. Ffor example, Ive literally seen people on Tumblr make such complaints about the film <cite>Parasite</cite>, as if a profound piece of art that brutally critiques the class system does not matter if it does not provide any shipping material. Its honestly very infuriating to see shippers like these are so willing to ignore art with meaningful story, characters and themes just because it lacks shipping fodder for them to project fanon onto.</p>
<p>Speaking of fanon, I really hate it when shippers, particularly shippers of popular non-canon pairings, expect anyone who is a fan of the same piece of media or any of the characters involved in the pairing to care about ships and treat the popular fanon ships as canon. These shippers also tend to act like their fanon and headcanons are universal, using languages like “the fandom has decided” and “everyone has agreed that”. And these shippers wonder why others who do not engage with that piece of media for shipping get sick and tired of shipping taking over discussions about said piece of media.</p>
<p>If you are so invested in shipping to the point that you are willing to disregard a piece of media just because you cannot find anything to ship, or you treat it as a personal attack when people talk about being sick and tired of shipping culture as well as how shipping dominates discussions about a piece of media, maybe you need to consider taking a step back from shipping and learning to take your shipping goggles off when you interact with a piece of media.</p>
</article>
<!-- <aside class="right-sidebar">
Right sidebar content here
</aside> -->
</main>
<footer class="main-footer"></footer>
</body>
</htm

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.4 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 34 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 40 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 60 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 723 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.8 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 15 KiB

View File

@ -1,20 +0,0 @@
{
"name": "Leilukin's Hub",
"short_name": "Leilukin's Hub",
"icons":
[
{
"src": "/android-chrome-192x192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "/android-chrome-512x512.png",
"sizes": "512x512",
"type": "image/png"
}
],
"theme_color": "#7A37A3",
"background_color": "#000000",
"display": "standalone"
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 131 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 98 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 567 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.0 KiB

View File

@ -1,36 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:url" content="https://leilukin.neocities.org/blog/archive.html">
<meta property="og:type" content="website">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="Blog Archive">
<meta name="author" content="Leilukin">
<meta property="og:description" content="The full list of posts on my blog.">
<link rel="stylesheet" href="./css/style-blog.css" type="text/css" media="all">
<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">
<script src="./js/blog.js" defer></script>
<title>Blog Archive | Leilukin's Hub</title>
</head>
<body>
<main class="blog-container" id="container">
<header class="blog-header" id="header">...</header>
<article class="blog-content" id="content">
<h1 class="blog__title">Blog Archive</h1>
<section class="blog-post-list" id="postlistdiv"></section>
</article> <!-- end of article id="content" -->
<footer class="blog-footer" id="footer"></footer>
</main> <!-- end of main id="container" -->
</body>
</html>

View File

@ -1,274 +0,0 @@
@import url('https://fonts.googleapis.com/css?family=Noto+Sans&display=swap');
/* CSS RESET */
/* Box sizing rules */
*,
*::before,
*::after {
box-sizing: border-box;
}
/* Remove default margin */
body,
h1,
h2,
h3,
h4,
p,
figure,
blockquote,
dl,
dd {
margin: 0;
}
/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
ul[role='list'],
ol[role='list'] {
list-style: none;
}
/* Set core root defaults */
html:focus-within {
scroll-behavior: smooth;
}
/* Set core body defaults */
body {
min-height: 100vh;
text-rendering: optimizeSpeed;
line-height: 1.5;
}
/* A elements that don't have a class get default styles */
a:not([class]) {
text-decoration-skip-ink: auto;
}
/* Make images easier to work with */
img,
picture {
max-width: 100%;
display: block;
}
/* Inherit fonts for inputs and buttons */
input,
button,
textarea,
select {
font: inherit;
}
/* Remove all animations, transitions and smooth scroll for people that prefer not to see them */
@media (prefers-reduced-motion: reduce) {
html:focus-within {
scroll-behavior: auto;
}
*,
*::before,
*::after {
animation-duration: 0.01ms !important;
animation-iteration-count: 1 !important;
transition-duration: 0.01ms !important;
scroll-behavior: auto !important;
}
}
/* STYLING BEGINS */
/* General styles */
body {
background-color: black;
background: url('../img/bg_space.png') no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
font-size: 1.3rem;
font-family: 'Noto Sans', Arial, sans-serif;
min-height: 100vh;
display: flex;
align-items: center;
justify-content: center;
}
h1 {
margin-bottom: 1.2rem;
}
h1, h2, h3, h4, h5 {
color: #5fc7cd;
}
p {
line-height: 1.6em;
padding: 0.5rem 0;
}
strong {
color: #5fc7cd;
}
img {
max-width: 100%;
height: auto;
margin-top: 0.5em;
margin-bottom: 0.5em;
}
blockquote {
margin: 1.5rem 0;
padding: 0.5rem 1rem;
border-inline-start: 0.1rem solid #5fc7cd;
background-color: #34220b;
}
.right {
float: right;
margin-left: 1em;
}
.left {
float: left;
margin-right: 1em;
}
.center {
display: block;
margin-right: auto;
margin-left: auto;
text-align: center;
}
@media only screen and (min-width: 37.5rem) {
.small {
max-width: 60%;
height: auto;
}
}
.caption {
margin-top: 0;
font-size: 0.9em;
font-style: italic;
}
a {
color: #ffc000;
}
a:hover {
background-color: #34220b;
}
hr {
border-width: 0.1rem 0 0 0;
border-style: dotted;
border-color: #a3bdc4;
}
/* The rectangle that has contains everything but the background */
.blog-container {
width: 95%;
max-width: 68.75rem;
background-color: #101010;
color: #dddddd;
border-radius: 2rem;
overflow: hidden;
box-shadow: 0 -2px 10px 0 #c7d8f4 inset;
margin: 1em 0;
padding: 1em 2em;
}
/* HEADER STYLE */
.blog-header {
margin-bottom: 0.5em;
}
.blog-header ul {
display: inline-block;
list-style-type: none;
padding: 0;
margin-bottom: 1em;
margin-top: 1em;
}
.blog-header li {
font-size: 1.1em;
display: inline-block;
margin-right: 0.5em;
margin-bottom: 0.5em;
margin-top: 0.5em;
}
.blog-header li a {
color: white;
background-color: #1b548e;
border-radius: 25px;
border: 3px solid #7cd8ff;
padding: 6px 30px;
box-shadow: 0 -2px 12px 0 #23a4f8 inset;
text-transform: uppercase;
text-decoration: none;
}
.blog-header li a:hover {
background-color: #1f64aa;
text-decoration: none;
}
/* POST TITLE STYLE */
.blog__title,
.blog-post__title {
font-size: 1.75em;
}
/* POST STYLE */
.blog-post__figure--img {
padding: 1rem 0;
}
/* POST DATE STYLE */
.blog-post__date {
font-size: 1.1em;
margin-bottom: 1.1em;
}
/* POST LIST STYLE */
.blog-recent-post-list {
margin-top: 1em;
}
.blog-post-list ul,
.blog-recent-post-list ul {
font-size: 1.1em;
padding: 0;
list-style-type: none;
}
.blog-post-list ul li,
.blog-recent-post-list ul li {
margin-bottom: 0.5em;
}
.moreposts {
font-size: 0.8em;
margin-top: 0.2em;
}
/*NEXT AND PREVIOUS LINKS STYLE*/
.blog-nextprev {
text-align: center;
margin: 1.4em 0;
}
/* DISQUS STYLE */
#disqus_thread {
margin-top: 1.6em;
}
/* FOOTER STYLE */
.blog-footer {
font-size: 0.8em;
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.8 MiB

View File

@ -1,41 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:url" content="https://leilukin.neocities.org/blog">
<meta property="og:type" content="website">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="Leilukin's Blog">
<meta name="author" content="Leilukin">
<meta property="og:description" content="My blog hosted on my website.">
<link rel="stylesheet" href="./css/style-blog.css" type="text/css" media="all">
<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">
<script src="./js/blog.js" defer></script>
<title>Blog | Leilukin's Hub</title>
</head>
<body>
<main class="blog-container" id="container">
<header class="blog-header" id="header">This site requires JavaScript!</header>
<article class="blog-content" id="content">
<h1 class="blog__title">Welcome to Leilukin's Hub Blog!</h1>
<p>This is my blog that is hosted on my own personal website. Hope you enjoy your time here!</p>
<section class="blog-recent-post-list" id="recentpostlistdiv"></section>
</article> <!-- end of article id="content" -->
<footer class="blog-footer" id="footer"></footer>
</main> <!-- end of main id="container" -->
</body>
</html>

View File

@ -1,231 +0,0 @@
/*Welcome to the script file! Your 1st time here, you should update
the basic info section to include your name and website/social
media link (if desired). Most of the time, you will just come
here to update the posts array. However, you can also edit or
add your own scripts to do whatever you like!*/
//TABLE OF CONTENTS
// 1. Basic Info
// 2. Posts Array
// 3. Creating HTML Sections to Be Inserted (Header, Footer, etc)
// 4. Inserting the Sections Into our Actual HTML Pages
//-----------------------------
//==[ 1. BASIC INFO ]==
let blogName = "Leilukin's Hub Blog";
let authorName = "Leilukin";
let authorLink = "https://leilukin.neocities.org/"; // Enter your website, social media, etc. Some way for people to tell you they like your blog! (Leaving it empty is okay too)
//-----------------------------
//==[ 2. POSTS ARRAY ]==
/* Each time you make a new post, add the filepath here at the top of postsArray.
This will cause all the right links to appear and work.
NOTE: It's important to follow this exact naming convention, because the scripts
below are expecting it ( 'posts/YYYY-MM-DD-Title-of-Your-Post.html', ). You can
alter the scripts if you want to use a different naming convention */
/* UPDATE: as of version 1.3, you may omit the date if you would like. But if you
use a date it must still follow that format. */
let postsArray = [
[ "posts/2024-03-06-I-Received-a-Lifetime-Premium-Membership-on-Nexus-Mods-for-Free.html" ],
[ "posts/2023-11-20-Finally-Beat-A-Bugs-Life-Video-Game-24-Years-Later.html", encodeURI( `Finally Beat A Bug's Life The Video Game — 24 Years Later` ) ],
[ "posts/2023-11-19-I-Can-Finally-Game-on-a-Solid-State-Drive.html", encodeURI( `I Can Finally Game on a Solid-State Drive` ) ],
[ "posts/2023-10-30-Support-for-My-Steam-Review-of-A-Summers-End.html", encodeURI( `Support for My Steam Review of A Summer's End — Hong Kong 1986` ) ],
[ "posts/2023-10-13-My-Cassette-Beasts-Pombomb-Plushie-Arrived.html", encodeURI( `My Cassette Beasts Pombomb Plushie Arrived!` ) ],
[ "posts/2023-09-11-Happy-1st-Anniversary-to-Leilukins-Hub.html", encodeURI( `Happy 1st Anniversary to Leilukin's Hub` ) ],
[ "posts/2023-07-28-My-First-Birthday-After-the-Launch-of-Leilukins-Hub.html", encodeURI( `My First Birthday After the Launch of Leilukin's Hub` ) ],
[ "posts/2023-05-09-Onboard-the-Dracula-Daily-Hype-Train.html" ],
[ "posts/2023-01-28-Leilukins-Hub-Now-Has-a-Blog.html", encodeURI( `Leilukin's Hub Now Has a Blog!` ) ]
// [ "posts/2020-11-10-Special-Characters-Example.html", encodeURI( 'Spéci@l "Character\'s" Examp|e' ) ],
// [ "posts/2020-11-10-Post-Template.html" ]
];
//-----------------------------
//==[ 3. CREATING HTML SECTIONS TO BE INSERTED ]==
let url = window.location.pathname;
//The date format to look for is 4 digits, hyphen, 2 digits, hyphen, 2 digits, hyphen.
const postDateFormat = /\d{4}\-\d{2}\-\d{2}\-/;
//Check if you are in posts (if so, the links will have to go up a directory)
let relativePath = ".";
if ( url.includes("posts/") ) {
relativePath = "..";
}
//Variable for my main site URL
const mainSiteURL = "/home.html";
//Write the Header HTML, a series of list items containing links.
let headerHTML = '<ul> <li><a href="' + relativePath + '/index.html">Blog</a></li>' +
'<li><a href="' + relativePath + '/archive.html">Archive</a></li>' +
'<li><a href="' + mainSiteURL + '">Main Site</a></li> </ul>';
//Write the Footer HTML, which has information about the blog.
let footerHTML = "<hr><p>" + blogName + " is written by <a href='" + authorLink + "'>" + authorName + "</a>, built with <a href='https://zonelets.net/' target='_blank'>Zonelets</a>.</p>";
//To do the following stuff, we want to know where we are in the posts array (if we're currently on a post page).
let currentIndex = -1;
let currentFilename = url.substring(url.lastIndexOf('posts/'));
//Depending on the web server settings (Or something?), the browser url may or may not have ".html" at the end. If not, we must add it back in to match the posts array. (12-19-2022 fix)
if ( ! currentFilename.endsWith(".html") ) {
currentFilename += ".html";
}
let i;
for (i = 0; i < postsArray.length; i++) {
if ( postsArray[i][0] === currentFilename ) {
currentIndex = i;
}
}
//Convert the post url to readable post name. E.g. changes "2020-10-10-My-First-Post.html" to "My First Post"
//Or pass along the "special characters" version of the title if one exists
function formatPostTitle(i) {
// Check if there is an alternate post title
if ( postsArray[i].length > 1 ) {
//Remember how we had to use encodeURI for special characters up above? Now we use decodeURI to get them back.
return decodeURI(postsArray[i][1]);
} else {
//If there is no alternate post title, check if the post uses the date format or not, and return the proper title
if ( postDateFormat.test ( postsArray[i][0].slice( 6,17 ) ) ) {
return postsArray[i][0].slice(17,-5).replace(/-/g," ");
} else {
return postsArray[i][0].slice(6,-5).replace(/-/g," ");
}
}
}
//Get the current post title and date (if we are on a post page)
let currentPostTitle = "";
let niceDate = "";
if ( currentIndex > -1 ) {
currentPostTitle = formatPostTitle( currentIndex );
//Generate the "nice to read" version of date
if ( postDateFormat.test ( postsArray[currentIndex][0].slice( 6,17 ) ) ) {
let monthSlice = postsArray[currentIndex][0].slice( 11,13 );
let month = "";
if ( monthSlice === "01") { month = "Jan";}
else if ( monthSlice === "02") { month = "Feb";}
else if ( monthSlice === "03") { month = "Mar";}
else if ( monthSlice === "04") { month = "Apr";}
else if ( monthSlice === "05") { month = "May";}
else if ( monthSlice === "06") { month = "Jun";}
else if ( monthSlice === "07") { month = "Jul";}
else if ( monthSlice === "08") { month = "Aug";}
else if ( monthSlice === "09") { month = "Sep";}
else if ( monthSlice === "10") { month = "Oct";}
else if ( monthSlice === "11") { month = "Nov";}
else if ( monthSlice === "12") { month = "Dec";}
niceDate = postsArray[currentIndex][0].slice( 14,16 ) + " " + month + ", " + postsArray[currentIndex][0].slice( 6,10 );
}
}
//Generate the Post List HTML, which will be shown on the "Archive" page.
function formatPostLink(i) {
let postTitle_i = "";
if ( postsArray[i].length > 1 ) {
postTitle_i = decodeURI(postsArray[i][1]);
} else {
if ( postDateFormat.test ( postsArray[i][0].slice( 6,17 ) ) ) {
postTitle_i = postsArray[i][0].slice(17,-5).replace(/-/g," ");
} else {
postTitle_i = postsArray[i][0].slice(6,-5).replace(/-/g," ");
}
}
if ( postDateFormat.test ( postsArray[i][0].slice( 6,17 ) ) ) {
return '<li><a href="' + relativePath + '/'+ postsArray[i][0] +'">' + postsArray[i][0].slice(6,16) + " \u00BB " + postTitle_i + '</a></li>';
} else {
return '<li><a href="' + relativePath + '/'+ postsArray[i][0] +'">' + postTitle_i + '</a></li>';
}
}
let postListHTML = "<ul>";
for ( let i = 0; i < postsArray.length; i++ ) {
postListHTML += formatPostLink(i);
}
postListHTML += "</ul>";
//Generate the Recent Post List HTML, which can be shown on the home page (or wherever you want!)
let recentPostsCutoff = 3; //Hey YOU! Change this number to set how many recent posts to show before cutting it off with a "more posts" link.
let recentPostListHTML = "<h2>Recent Posts:</h2><ul>";
let numberOfRecentPosts = Math.min( recentPostsCutoff, postsArray.length );
for ( let i = 0; i < numberOfRecentPosts; i++ ) {
recentPostListHTML += formatPostLink(i);
}
/*If you've written more posts than can fit in the Recent Posts List,
then we'll add a link to the archive so readers can find the rest of
your wonderful posts and be filled with knowledge.*/
if ( postsArray.length > recentPostsCutoff ) {
recentPostListHTML += '<li class="moreposts"><a href=' + relativePath + '/archive.html>\u00BB more posts</a></li></ul>';
} else {
recentPostListHTML += "</ul>";
}
//Generate the Next and Previous Post Links HTML
let nextprevHTML = "";
let nextlink = "";
let prevlink = "";
/*If you're on the newest blog post, there's no point to
a "Next Post" link, right? And vice versa with the oldest
post! That's what the following code handles.*/
if ( postsArray.length < 2 ) {
nextprevHTML = '<a href="' + relativePath + '/index.html">Blog</a>';
} else if ( currentIndex === 0 ) {
prevlink = postsArray[currentIndex + 1][0];
nextprevHTML = '<a href="' + relativePath + '/index.html">Blog</a> | <a href="'+ relativePath + '/' + prevlink +'">Previous Post \u00BB</a>';
} else if ( currentIndex === postsArray.length - 1 ) {
nextlink = postsArray[currentIndex - 1][0];
nextprevHTML = '<a href="' + relativePath + '/' + nextlink +'">\u00AB Next Post</a> | <a href="' + relativePath + '/index.html">Blog</a>';
} else if ( 0 < currentIndex && currentIndex < postsArray.length - 1 ) {
nextlink = postsArray[currentIndex - 1][0];
prevlink = postsArray[currentIndex + 1][0];
nextprevHTML = '<a href="' + relativePath + '/'+ nextlink +'">\u00AB Next Post</a> | <a href="' + relativePath + '/index.html">Blog</a> | <a href="' + relativePath + '/'+ prevlink +'">Previous Post \u00BB</a>';
}
//-----------------------------
//==[ 4. INSERTING THE SECTIONS INTO OUR ACTUAL HTML PAGES ]==
/*Here we check if each relevant div exists. If so, we inject the correct HTML!
NOTE: All of these sections are optional to use on any given page. For example, if there's
one particular blog post where we don't want the footer to appear,
we simply don't put a <div id="footer"> on that page.*/
if (document.getElementById("nextprev")) {
document.getElementById("nextprev").innerHTML = nextprevHTML;
}
if (document.getElementById("postlistdiv")) {
document.getElementById("postlistdiv").innerHTML = postListHTML;
}
if (document.getElementById("recentpostlistdiv")) {
document.getElementById("recentpostlistdiv").innerHTML = recentPostListHTML;
}
if (document.getElementById("header")) {
document.getElementById("header").innerHTML = headerHTML;
}
if (document.getElementById("blogTitleH1")) {
document.getElementById("blogTitleH1").innerHTML = blogTitle;
}
if (document.getElementById("postTitleH1")) {
document.getElementById("postTitleH1").innerHTML = currentPostTitle;
}
if (document.getElementById("postDate")) {
document.getElementById("postDate").innerHTML = niceDate;
}
if (document.getElementById("footer")) {
document.getElementById("footer").innerHTML = footerHTML;
}
//Dynamically set the HTML <title> tag from the postTitle variable we created earlier
//The <title> tag content is what shows up on browser tabs
if (document.title === "Blog Post") {
document.title = currentPostTitle + ` | Blog | Leilukin's Hub`;
}

View File

@ -1,46 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:url" content="https://leilukin.neocities.org/blog/2023-01-28-Leilukins-Hub-Now-Has-a-Blog.html">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="Leilukin's Hub Now has a Blog! | Blog">
<meta name="author" content="Leilukin">
<meta property="og:description" content="I have finally set up a blog on my own website.">
<link rel="stylesheet" href="../css/style-blog.css" type="text/css" media="all">
<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">
<script src="../js/blog.js" defer></script>
<title>Blog Post</title> <!-- If you leave title as "Blog Post", it will automatically be updated to the post title -->
</head>
<body>
<main class="blog-container" id="container">
<header class="blog-header" id="header">...</header>
<article class="blog-content" id="content">
<h1 class="blog-post__title" id="postTitleH1"></h1>
<h2 class="blog-post__date" id="postDate"></h2>
<p>I finally built a blog on my own website!</p>
<p>After launching this site in September 2022, I had been considering setting up a blog here, as I want a blog that is hosted on my own site, but it was not until I discovered <a href="https://zonelets.net/" target="_blank">Zonelets</a>, a HTML blogging engine created with Neocities in mind, and it was exactly what I was looking for to build a blog on my own Neocities site: it is simple enough for beginners to use, yet also open for more customisation and flexibility for users who have enough knowledge about HTML, CSS and JavaScript.</p>
<p>My site does have an <a href="/articles" target="_blank">articles</a> section, but what makes this blog different from the articles is that the articles are meant to be timeless, sort of like my public statements for certain topics, while posts from this blog are more like journals or reactions to a timely subject.</p>
<p>Welcome to my blog! Hope you enjoy your stay on this blog and my website!</p>
<section class="blog-nextprev" id="nextprev"></section>
</article> <!-- end of div id="content" -->
<footer class="blog-footer" id="footer"></footer>
</main> <!-- end of div id="container" -->
</body>
</html>

View File

@ -1,44 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:url" content="https://leilukin.neocities.org/blog/2023-05-09-Onboard-the-Dracula-Daily-Hype-Train.html">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="Onboard the Dracula Daily Hype Train | Blog">
<meta name="author" content="Leilukin">
<meta property="og:description" content="I have signed up to join the Dracula Daily hype.">
<link rel="stylesheet" href="../css/style-blog.css" type="text/css" media="all">
<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">
<script src="../js/blog.js" defer></script>
<title>Blog Post</title> <!-- If you leave title as "Blog Post", it will automatically be updated to the post title -->
</head>
<body>
<main class="blog-container" id="container">
<header class="blog-header" id="header">...</header>
<article class="blog-content" id="content">
<h1 class="blog-post__title" id="postTitleH1"></h1>
<h2 class="blog-post__date" id="postDate"></h2>
<p><a href="https://draculadaily.com/" target="_blank"><cite>Dracula Daily</cite></a>, the free subscription newsletter that sends Bram Stoker's 1897 novel <cite>Dracula</cite> to subscribers via email, became an internet sensation, especially on Tumblr. Some of my Tumblr mutuals were also on the hype train, though I missed it.</p>
<p>Fortunately, <cite>Dracula Daily</cite> returns in 2023, so I decided to sign up to subscribe to the newsletter and join the hype. This year, <a href="https://redracula.live/" target="_blank"><cite>Re: Dracula</cite></a>, the audio drama podcast adaptation of <cite>Dracula</cite>, also debuts. Like <cite>Dracula Daily</cite>, <cite>Re: Dracula</cite> releases new entries in as close to real time as it happens, meaning you can now enjoy <cite>Dracula Daily</cite> in audio form as well, with excellent voice acting and sound design to enhance the experience.</p>
<p>Confession: This is actually my first time reading <cite>Dracula</cite>, so I am looking forward to this serialised way of reading the novel!</p>
<section class="blog-nextprev" id="nextprev"></section>
</article> <!-- end of article id="content" -->
<footer class="blog-footer" id="footer"></footer>
</main> <!-- end of main id="container" -->
</body>
</html>

View File

@ -1,48 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:url" content="https://leilukin.neocities.org/blog/2023-07-28-My-First-Birthday-After-the-Launch-of-Leilukins-Hub.html">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="My First Birthday After the Launch of Leilukin's Hub | Blog">
<meta name="author" content="Leilukin">
<meta property="og:description" content="28th July 2023 marks my first birthday after the launch of this personal website.">
<link rel="stylesheet" href="../css/style-blog.css" type="text/css" media="all">
<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">
<script src="../js/blog.js" defer></script>
<title>Blog Post</title> <!-- If you leave title as "Blog Post", it will automatically be updated to the post title -->
</head>
<body>
<main class="blog-container" id="container">
<header class="blog-header" id="header">...</header>
<article class="blog-content" id="content">
<h1 class="blog-post__title" id="postTitleH1"></h1>
<h2 class="blog-post__date" id="postDate"></h2>
<p>28 July is my birthday, and in 2023, it also marks my first birthday after the launch of this personal website. I have had a nice birthday this year.</p>
<p>I spent the moments counting down to my birthday by playing <cite>Cassette Beasts</cite>, which has become one of my all-time favourite video games, to the extent that I am planning to make a shrine for it on this site. I defeated <a href="https://wiki.cassettebeasts.com/wiki/Lamento_Mori" target="_blank">Lamento Mori</a>, who in the lore of <cite>Cassette Beasts</cite> is an <a href="https://wiki.cassettebeasts.com/wiki/Archangel" target="_blank">Archangel</a>, one of the eldritch entities in the game's settings, that specifically embodies humanity's fear of death. It is both amusing and poetic that I celebrated the countdown to my birthday by defeating a boss in a video game that represents death.</p>
<p>Since I have been playing and loving <cite>Cassette Beasts</cite>, and I want to support indie developers of indie games I love, I decided to purchase the Deluxe Edition on Steam, which includes the soundtrack, the art book and the Cosplay Pack as a birthday gift for myself. I received the base game as a Steam gift from a friend, and now I chose to use my money to support the developers myself as well. Not to mention, the music of <cite>Cassette Beasts</cite> is amazing. "Same Old Story", the battle theme of the Archangels, in particular, has become one of my all-time favourite battle themes in video games.</p>
<p>I had my birthday celebration with my family and received birthday wishes from friends.</p>
<p>Happy Birthday to me!</p>
<section class="blog-nextprev" id="nextprev"></section>
</article> <!-- end of article id="content" -->
<footer class="blog-footer" id="footer"></footer>
</main> <!-- end of main id="container" -->
</body>
</html>

View File

@ -1,50 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:url" content="https://leilukin.neocities.org/blog/posts/2023-09-11-Happy-1st-Anniversary-to-Leilukins-Hub.html">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="Happy 1st Anniversary to Leilukin's Hub | Blog">
<meta name="author" content="Leilukin">
<meta property="og:description" content="Celebrating the first anniversary of Leilukin's Hub and reflecting on the evolution of my website throughout past year.">
<link rel="stylesheet" href="../css/style-blog.css" type="text/css" media="all">
<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">
<script src="../js/blog.js" defer></script>
<title>Blog Post</title> <!-- If you leave title as "Blog Post", it will automatically be updated to the post title -->
</head>
<body>
<main class="blog-container" id="container">
<header class="blog-header" id="header">...</header>
<article class="blog-content" id="content">
<h1 class="blog-post__title" id="postTitleH1"></h1>
<h2 class="blog-post__date" id="postDate"></h2>
<p>11 September 2023 marks the first anniversary of Leilukin's Hub, my personal website, hosted on Neocities. I am proud to be able to succeed in not only building my own website, but also updating, improving and maintaining my website to achieve my vision for my own personal hub on the internet outside social media platforms.</p>
<p>I registered a Neocities account on 28 May 2022, while my own website, Leilukin's Hub, was officially launched on 11 September 2022. I set up this website because I wanted to have a personal web page outside social media platforms to gather various stuff and resources I had created or compiled on online spaces throughout the years. Furthermore, I settled for Neocities because I like the flexibility of customisation by coding my website with HTML, CSS and JavaScript. Initially, I considered and tried <a href="https://carrd.co/" target="_blank">Carrd</a> to create my web pages, but free accounts on Carrd can only add up to 100 elements on a web page, which is not enough for my purpose.</p>
<p>This site's <a href="/changelog/">changelog</a> and <a href="/changelog/layouts.html">layout archive</a> document the evolution of Leilukin's Hub throughout the past year: from the humble beginning of a simple black background with white text and light brown titles, to the responsive, mobile-friendly, full-fledged personal website with its own site button, <a href="/feed.xml">RSS feed</a>, a <a href="/blog/">blog</a> and multiple <a href="/shrines/">shrines</a>.</p>
<p>Coding my own website was also an excellent way to put my HTML and CSS knowledge and skills into good use. I already had basic knowledge of HTML and CSS from what I learned from my teenage years of customising my blog on Blogger.</p>
<p>Working on Leilukin's Hub had ignited my interest in coding, so I took courses to learn more about HTML, CSS, JavaScript and more about coding, and in turn, I put my new coding knowledge into good use by improving and adding more features to Leilukin's Hub, which was totally worth it. Therefore, I have also <a href="/resources/web-building-resources.html">compiled resources for building websites</a> here for those who need it.</p>
<p>You may feel intimidated by the idea of building your website because you do not know how to code, but good news! There are plenty of resources for you to learn HTML, CSS and JavaScript, including free courses. Neocities also has <a href="https://neocities.org/tutorial/html/" target="_blank">its own HTML course</a> for you to get started. Happy coding!</p>
<section class="blog-nextprev" id="nextprev"></section>
</article> <!-- end of div id="content" -->
<footer class="blog-footer" id="footer"></footer>
</main> <!-- end of div id="container" -->
</body>
</html>

View File

@ -1,70 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:url" content="https://leilukin.neocities.org/blog/2023-10-13-My-Cassette-Beasts-Pombomb-Plushie-Arrived.html">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="My Cassette Beasts Pombomb Plushie Arrived! | Blog">
<meta name="author" content="Leilukin">
<meta property="og:description" content="The official Cassette Beasts Pombomb plushie I purchased finally arrived.">
<link rel="stylesheet" href="../css/style-blog.css" type="text/css" media="all">
<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">
<script src="../js/blog.js" defer></script>
<title>Blog Post</title> <!-- If you leave title as "Blog Post", it will automatically be updated to the post title -->
<style>
/* Tablet screen size */
@media only screen and (min-width: 43.75rem) {
.pombomb-plush-photos {
display: grid;
grid-template-columns: auto auto;
column-gap: 1.1rem;
}
}
</style>
</head>
<body>
<main class="blog-container" id="container">
<header class="blog-header" id="header">...</header>
<article class="blog-content" id="content">
<h1 class="blog-post__title" id="postTitleH1"></h1>
<h2 class="blog-post__date" id="postDate"></h2>
<p>YAAAYYYYYYYY! I finally received my Pombomb plushie on 11 October 2023!</p>
<div class="pombomb-plush-photos">
<a href="https://postimg.cc/MMccL6vP" target="_blank"><img src="https://i.postimg.cc/QtmpHVs3/2023-10-11-14-25-27.jpg" alt="2023-10-11-14-25-27"/></a>
<a href="https://postimg.cc/dkDdKRS9" target="_blank"><img src="https://i.postimg.cc/k4vyKfQL/2023-10-11-14-28-36.jpg" alt="2023-10-11-14-28-36"/></a>
<a href="https://postimg.cc/47Mc4KDR" target="_blank"><img src="https://i.postimg.cc/7hPnV0Xh/2023-10-11-14-29-09.jpg" alt="2023-10-11-14-29-09"/></a>
<a href="https://postimg.cc/5YZHdhzx" target="_blank"><img src="https://i.postimg.cc/qq72n0MC/2023-10-11-14-30-36.jpg" alt="2023-10-11-14-30-36"/></a>
</div>
<p><cite>Cassette Beasts</cite> has become my favourite monster collecting game and one of my all-time favourite games since the first time I played it. In fact, I have created a <a href="/shrines/cassettebeasts/" target="blank"><cite>Cassette Beasts</cite> shrine</a> on my own website here. Among the monsters from <cite>Cassette Beasts</cite>, <a href="https://wiki.cassettebeasts.com/wiki/Pombomb" target="blank">Pombomb</a> is one of my favourites.</p>
<p>I love Cassette Beasts and Pombomb so much that I am willing to spend money on not only the <a href="https://www.symbiotestudios.com/online-store/Cassette-Beasts-Pombomb-p582974319" target="blank">official Pombomb plushie</a> itself, but also the shipping fee to import it to my region. It took a month for this cutie to arrive at my home, but it is worth the wait!</p>
<p>The plushie is very well-made; it is firm decently sized.</p>
<p>Even better, when I shared my Pombomb plushie, Bytten Studio, the developer of <cite>Cassette Beasts</cite> <a href="https://twitter.com/ByttenStudio/status/1712191037957927126" target="blank">retweeted</a> me!</p>
<blockquote class="twitter-tweet"><p lang="en" dir="ltr">Look at the lil guy! Perfect! Perfection!! <a href="https://t.co/zgMDvOQjt3">https://t.co/zgMDvOQjt3</a></p>&mdash; CASSETTE BEASTS 📼 OUT NOW ON PC &amp; CONSOLES (@ByttenStudio) <a href="https://twitter.com/ByttenStudio/status/1712191037957927126?ref_src=twsrc%5Etfw">October 11, 2023</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
<img src="https://i.postimg.cc/8cmwZxD3/bytten-studio-on-my-pombomb-plushie.png" alt="Screenshot of ByttenStudio's retweet of Leilukin's Cassette Beasts Pombomb plushie">
<section class="blog-nextprev" id="nextprev"></section>
</article> <!-- end of div id="content" -->
<footer class="blog-footer" id="footer"></footer>
</main> <!-- end of div id="container" -->
</body>
</html>

View File

@ -1,64 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:url" content="https://leilukin.neocities.org/blog/2023-10-30-Support-for-My-Steam-Review-of-A-Summers-End.html">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="Support for My Steam Review of A Summer's End — Hong Kong 1986 | Blog">
<meta name="author" content="Leilukin">
<meta property="og:description" content="A thank-you post for the people who have supported my Steam review of A Summer's End — Hong Kong 1986.">
<link rel="stylesheet" href="../css/style-blog.css" type="text/css" media="all">
<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">
<script src="../js/blog.js" defer></script>
<title>Blog Post</title> <!-- If you leave title as "Blog Post", it will automatically be updated to the post title -->
</head>
<body>
<main class="blog-container" id="container">
<header class="blog-header" id="header">...</header>
<article class="blog-content" id="content">
<h1 class="blog-post__title" id="postTitleH1"></h1>
<h2 class="blog-post__date" id="postDate"></h2>
<p>As part of my effort to support and promote <a href="https://www.asummersend.com/" target="blank"><cite>A Summer's End — Hong Kong 1986</cite></a>, the sapphic visual novel and my absolute favourite piece of queer art ever, I left a <a href="https://steamcommunity.com/id/leilukin/recommended/1111370/" target="blank">glowing review on Steam</a> on 17 August 2023, talking about how much <cite>A Summer's End</cite> means too me as a Cantonese-speaking Chinese lesbian who grew up with Hong Kong media. I love <cite>A Summer's End</cite> so much that I had created a <a href="/shrines/asummersend/" target="blank">shrine</a> for it on my own website here.</p>
<p>Since then, as of the writing of this post on 30 October 2023, my review made to the top of the most helpful reviews in the past 90 days on the <a href="https://steamcommunity.com/app/1111370" target="blank">Steam store page of <cite>A Summer's End</cite></a> with 12 votes.</p>
<img src="https://i.postimg.cc/R0PQhpTy/Screenshot-2023-10-30-at-09-52-13-A-Summer-s-End-Hong-Kong-1986-on-Steam.png" alt="Screenshot of Leilukin's review of A Summer's End — Hong Kong 1986 on Steam">
<p>In addition, I have received multiple Steam awards, with Steam Points along with them, including:</p>
<ul>
<li>Heartwarning, which awards 200 Steam Points, given by two people</li>
<li>Golden Unicorn, which awards 800 Steam Points, given by one person</li>
<li>Take My Points, which awards 1,600(!) Steam Points, given by one person</li>
</ul>
<p>Recently, on 22 October 2023, the <a href="https://leilukin.123guestbook.com/" target="_blank">guestbook</a> of my website here have also received a message from someone named Rob, who expressed appreciation for my Steam review:</p>
<blockquote>
<p>Thanks so much for your steam review of a summer's end!! So glad you have this board, so I could thank you for the heart warming review. I want to get this game for a friend of mine who is new to speaking english, and the story definitely will resonate with her.</p>
<p>I am introducing her to visual novels to hopefully help aid in her learning and practice.</p>
</blockquote>
<p>I am amazed by the amount of appreciation my Steam review of <cite>A Summer's End</cite> has been given. Thank you! <cite>A Summer's End</cite> truly deserves all the love and support it can get.</p>
<p>I cannot stress enough that <cite>A Summer's End</cite> is important because LGBTQ+ Hong Kong people and Cantonese speakers are criminally underrepresented in media. This is why we need to be vocal about our support for queer art made by non-white people, to signify to both the creators and every LGBTQ+ people that stories of queer non-white people deserve to be told.</p>
<p>Therefore, here is your reminder to check out <cite>A Summer's End — Hong Kong 1986</cite> if you have not already, especially you are also an Asian sapphic woman!</p>
<section class="blog-nextprev" id="nextprev"></section>
</article> <!-- end of div id="content" -->
<footer class="blog-footer" id="footer"></footer>
</main> <!-- end of div id="container" -->
</body>
</html>

View File

@ -1,48 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:url" content="https://leilukin.neocities.org/blog/2023-11-19-I-Can-Finally-Game-on-a-Solid-State-Drive.html">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="I Can Finally Game on a Solid-State Drive | Blog">
<meta name="author" content="Leilukin">
<meta property="og:description" content="I just got the solid-state drive (SSD) of my 5-year-old gaming laptop replaced with a new onw with a larger storage capacity.">
<link rel="stylesheet" href="../css/style-blog.css" type="text/css" media="all">
<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">
<script src="../js/blog.js" defer></script>
<title>Blog Post</title> <!-- If you leave title as "Blog Post", it will automatically be updated to the post title -->
</head>
<body>
<main class="blog-container" id="container">
<header class="blog-header" id="header">...</header>
<article class="blog-content" id="content">
<h1 class="blog-post__title" id="postTitleH1"></h1>
<h2 class="blog-post__date" id="postDate"></h2>
<p>The laptop I am using for doing everything on desktop — including coding and managing this very website and blog — is the first gaming laptop I ever had. I bought this laptop in 2018, meaning I have used it for 5 years by the time of this writing.</p>
<p>In 2018, I was able to purchase a budget gaming laptop with a solid-state drive (SSD) as its system drive. However, the SSD only had a 258GB storage capacity, which is paltry by today's hard drive standards, especially if you are a gamer, since the installation size of mainstream video games has grown bigger over time (which is actually one of the reasons I rarely play new AAA games any more).</p>
<p>This means that even though I immediately experienced the night-and-day difference in how much the speed of booting my operating system compared to all the laptops I owned previously, I was unable to enjoy the benefit of gaming on an SSD, which is faster loading of games, because I still had to install video games on my hard disk drive to preserve the space of my SSD system drive... until now.</p>
<p>After using my gaming laptop for 5 years, my SSD started displaying signs of age with random shutdowns and blue screens of death, followed by a "No Bootable Device" error even after my laptop restarted. As the issue became more frequent, and none of the possible solutions I found online worked at all, I finally asked for professional help to replace my corrupted SSD system drive. I chose a 1TB SSD with Windows 11 installed as my new system drive. </p>
<p>As a result, on 16 November, my 5-year-old gaming laptop was reborn with a new SSD system drive. A new SSD with much larger storage capacity means I can finally experience gaming on an SSD, and the benefit that came with it. It truly felt like I had a new computer again, since I needed to reinstall all the apps I use, but it was a small price to pay, and I have always kept lists of apps I use in case I am in situations where I needed to restart my system like this.</p>
<section class="blog-nextprev" id="nextprev"></section>
</article> <!-- end of div id="content" -->
<footer class="blog-footer" id="footer"></footer>
</main> <!-- end of div id="container" -->
</body>
</html>

View File

@ -1,48 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:url" content="https://leilukin.neocities.org/blog/2023-11-20-Finally-Beat-A-Bugs-Life-Video-Game-24-Years-Later.html">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="Finally Beat A Bug's Life The Video Game — 24 Years Later | Blog">
<meta name="author" content="Leilukin">
<meta property="og:description" content="My childhood goal of beating A Bug's Life video game was finally fulfilled.">
<link rel="stylesheet" href="../css/style-blog.css" type="text/css" media="all">
<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">
<script src="../js/blog.js" defer></script>
<title>Blog Post</title> <!-- If you leave title as "Blog Post", it will automatically be updated to the post title -->
</head>
<body>
<main class="blog-container" id="container">
<header class="blog-header" id="header">...</header>
<article class="blog-content" id="content">
<h1 class="blog-post__title" id="postTitleH1"></h1>
<h2 class="blog-post__date" id="postDate"></h2>
<p><cite>A Bug's Life</cite> was one of my favourite films in my childhood, to the extent I had lost count of how many times I rewatched it even just as a child alone by playing the CD on my house's television over and over. I was such a huge fan of <cite>A Bug's Life</cite> that I had also played its tie-in game, specifically the 3D action platformer game, and it became one of my childhood favourite video games as well.</p>
<p>However, I had a regret relating to <cite>A Bug's Life</cite> the video game for years — I did not finish the game. I managed to reach Level 15, the final level of the game, but the reason I did not beat it was my CD-ROM of the game literally broke into pieces inside the CD-ROM drive, accompanied by a loud breaking sound, when I was playing Level 15, likely due to the CD-ROM being dislocated. It happened in 1999. Needless to say, the breaking of the CD-ROM of one of my childhood favourite video games broke my heart. My family and I had tried to look for a new copy of A Bug's Life video game, but with no success because at that time the stores in my local area no longer sold it.</p>
<p>Over the years growing up, I still harbour nostalgia for <cite>A Bug's Life</cite>. While my love for the film had been tainted by the fact that <a href="https://therottenappl.es/result/movie/9487/A-Bug's-Life" target="blank">both Kevin Spacey, who voiced Hopper, and John Lasseter, the director, were accused of sexual misconduct</a>, my wish of being able to finish the tie-in video game myself lingered from time to time. I had watched playthrough videos of <cite>A Bug's Life</cite> video game on YouTube to help to fill the void, but it was not the same as playing the game myself. The main obstacle that prevented my wish from being fulfilled was the fact that it was a very old game that its PC version is no longer officially sold, not even on online game stores such as Steam and GOG. In other words, <cite>A Bug's Life</cite> the video game had become an abandonware. As a result, I sought out <a href="https://www.myabandonware.com/" target="blank">My Abandonware</a>, which does <a href="https://www.myabandonware.com/game/disney-pixar-a-bug-s-life-h0q" target="blank">provide the game to download for free</a>.</p>
<p>From My Abandonware, I downloaded and installed the Full-Rip with dgVoodoo by Destabilize version of A Bug's Life video game on my Windows 11. I was delighted when I successfully launched and played the old childhood favourite video game for the first time. Soon, I searched for a save file of the PC version of A Bug's Life video game that unlocked all levels, and found it on <a href="https://www.thetechgame.com/Downloads/id=62821/a-bugs-life.html" target="blank">The Tech Game</a>. Finally, at long last, on 20 November 2023, after 24 years, I successfully beat <cite>A Bug's Life</cite> video game by myself. I did not aim for 100% completion because my main goal was to defeat Hopper, the final boss, myself.</p>
<p>Given that the game was released in 1998, the graphics were obviously dated, and the camera and control were also awkward, but playing it again for the first time in decades brought back childhood memories of the game, and I still enjoy the game's soundtrack. This experience has also deepened my appreciation for internet archives, including ones that archive old video games. Thank you, My Abandonware, for allowing a childhood video game goal of mine got fulfilled decades later.</p>
<section class="blog-nextprev" id="nextprev"></section>
</article> <!-- end of div id="content" -->
<footer class="blog-footer" id="footer"></footer>
</main> <!-- end of div id="container" -->
</body>
</html>

View File

@ -1,74 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:url" content="https://leilukin.neocities.org/blog/2024-03-06-I-Received-a-Lifetime-Premium-Membership-on-Nexus-Mods-for-Free.html">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="I Received a Lifetime Premium Membership on Nexus Mods for Free | Blog">
<meta name="author" content="Leilukin">
<meta property="og:description" content="In light of my mods hosted on Nexus Mods reaching 30,000 unique downloads, I was rewarded a free lifetime Premium membership on Nexus Mods.">
<link rel="stylesheet" href="../css/style-blog.css" type="text/css" media="all">
<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">
<script src="../js/blog.js" defer></script>
<title>Blog Post</title> <!-- If you leave title as "Blog Post", it will automatically be updated to the post title -->
</head>
<body>
<main class="blog-container" id="container">
<header class="blog-header" id="header">...</header>
<article class="blog-content" id="content">
<h1 class="blog-post__title" id="postTitleH1"></h1>
<h2 class="blog-post__date" id="postDate"></h2>
<figure class="blog-post__figure--img">
<img src="https://i.postimg.cc/P5zQQ9dt/thunderbird-2024-03-06-20-45-36-381.png" alt="A partial email message from Nexus Mods about a free lifetime Premium membership reward">
<figcaption>
<p>[Image description: A partial email message from Nexus Mods that reads:</p>
<blockquote>
<p>Hey leilukin,</p>
<p>Congratulations! Many people are downloading your mods and your efforts have been recognised with a free Nexus Mods Premium reward.</p>
<p>To see and redeem your rewards, you can visit your rewards tab on the billing page.</p>
<p>Redeem now</p>
</blockquote>
<p>End desctiption.]</p>
</figcaption>
</figure>
<figure class="blog-post__figure--img">
<img src="https://i.postimg.cc/XqCYnKpJ/Screenshot-2024-03-06-at-20-49-26-Nexus-Mods-Home.png" alt="Nexus Mods website notification about a lifetime Premium membership reward">
<figcaption>
[Image description: A notification on the Nexus Mods website that reads, "Your mods reached 30,000 UDLs! Enjoy Lifetime Premium membership on us." End description.]
</figcaption>
</figure>
<figure class="blog-post__figure--img">
<img src="https://i.postimg.cc/SjbNRXMG/Screenshot-2024-03-06-at-20-52-27-Nexus-Mods-Users.png" alt="The Membership tab on Nexus Mods account settings showing lifetime Premium membership">
<figcaption>
[Image description: The Membership tab in the Nexus Mods account setting page, showing the current membershiup being "Mod Author Reward: Lifetime Premium", starting from 6th Mar 2024 with no end date. End description.]
</figcaption>
</figure>
<p>Wow, I just got informed by Nexus Mods via email and website notification that I have received a lifetime Premium membership for free on Nexus Mods as a mod author reward, since <a href="https://www.nexusmods.com/users/3041255?tab=user+files" target="blank">all my mods that are hosted on Nexus Mods</a> have reached 30,000 unique downloads in total!</p>
<p>It was actually only through receiving this reward that I learned about Nexus Mods' <a href="https://www.nexusmods.com/news/14933" target="blank">program to reward free Premium memberships to mod authors</a>.</p>
<p>I never spent a single cent on Nexus Mods, and my mods are all passion projects, so I never expected to enjoy any extra benefits or privileges on Nexus Mods.</p>
<p>That said, I cannot complain about receiving a premium membership on a website I use regularly for free, even though the unlimited mod download speed is the only benefit I am really interested in. After all, I do download a lot of mods for various video games from Nexus Mods.</p>
<section class="blog-nextprev" id="nextprev"></section>
</article> <!-- end of div id="content" -->
<footer class="blog-footer" id="footer"></footer>
</main> <!-- end of div id="container" -->
</body>
</html>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 684 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 243 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 649 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 260 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 258 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 247 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 438 B

View File

@ -1,208 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr" id="page-top">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:url" content="https://leilukin.neocities.org/changelog/2022.html">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="Website Changelog Archive: 2022">
<meta property="og:description" content="Changelog of my website during the year of 2022.">
<link rel="stylesheet" href="/css/style-main.css" type="text/css" media="all">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.1/css/all.css">
<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">
<script src="/js/main-components.js" defer></script>
<title>Website Changelog Archive: 2022 | Leilukin's Hub</title>
</head>
<body>
<header class="main-header">
<noscript>
JavaScript is disabled in your browser. To get the best user experience on
this website, it is recommended that you enable it.
</noscript>
</header>
<nav class="navbar"></nav>
<main>
<!-- <aside class="left-sidebar">
Left sidebar content here
</aside> -->
<article>
<h1>Website Changelog Archive: 2022</h1>
<p>You can subscribe to the <a href="/feed.xml" target="blank">Leilukin's Hub RSS feed</a> or follow <a href="https://neocities.org/site/leilukin" target="_blank">my Neocities profile</a> to get notified of the updates on this website.</p>
<div class="web-btn-wrapper center-el">
<a href="/feed.xml" target="blank" title="Leilukin's Hub RSS Feed">
<img src="/assets/rss-button.gif" alt="RSS feed button">
</a>
</div>
<p class="center-text">
Archive: <a href="/changelog/">Latest</a> | <a href="2023.html">2023</a> | <span class="bold-text">2022</span> | <a href="layouts.html">Website Layouts</a>
</p>
<p class="date-style">29 December 2022:</p>
<ul>
<li>Added my latest mod, KotOR 1 Twi'lek Male NPC Diversity, to <a href="/mycreations/kotor1mods">my mods for <cite>Star Wars: Knights of the Old Republic</cite></a> page.</li>
</ul>
<p class="date-style">19 December 2022:</p>
<ul>
<li>Added new resource, <cite>Star Wars: Knights of the Old Republic</cite> save files, to <a href="/resources">my resources</a> page: KotOR 2 Light Side Female Saves with The Sith Lords Restored Content Mod and PartySwap.</li>
</ul>
<p class="date-style">16 December 2022:</p>
<ul>
<li>Added my latest mods, Exile's Trial Overlay Removal and Visas Visible Jedi Robes, to <a href="/mycreations/kotor2mods">my mods for <cite>Star Wars: Knights of the Old Republic II: The Sith Lords</cite></a> page.</li>
</ul>
<p class="date-style">11 December 2022:</p>
<ul>
<li>For my <a href="/mycreations/kotor1mods">mod page for <cite>Star Wars: Knights of the Old Republic</cite></a>, No Flirting with Davik's Slaves has been updated and renamed to PC Dialogue with Davik's Slaves Change.</li>
</ul>
<p class="date-style">8 December 2022:</p>
<ul>
<li>Added my latest mod, No Flirting with Davik's Slaves, to <a href="/mycreations/kotor1mods">my mods for <cite>Star Wars: Knights of the Old Republic</cite></a> page.</li>
</ul>
<p class="date-style">27 November 2022:</p>
<ul>
<li>Added my latest mod, Prologue Item Recovery, to <a href="/mycreations/kotor2mods">my mods for <cite>Star Wars: Knights of the Old Republic II: The Sith Lords</cite></a> page.</li>
</ul>
<p class="date-style">24 November 2022:</p>
<ul>
<li>Added my latest mod, Bastila and Carth Romance Removal, to <a href="/mycreations/kotor1mods">my mods for <cite>Star Wars: Knights of the Old Republic</cite></a> page.</li>
</ul>
<p class="date-style">22 November 2022:</p>
<ul>
<li>Added my latest mod, No Jealousy Lock in Handmaiden Dialogue, to <a href="/mycreations/kotor2mods">my mods for <cite>Star Wars: Knights of the Old Republic II: The Sith Lords</cite></a> page.</li>
</ul>
<p class="date-style">16 November 2022:</p>
<ul>
<li>Added my latest mod, Lonna Vash Mod for TSLRCM, to <a href="/mycreations/kotor2mods">my mods for <cite>Star Wars: Knights of the Old Republic II: The Sith Lords</cite></a> page.</li>
</ul>
<p class="date-style">12 November 2022:</p>
<ul>
<li>Added my latest mod, Dahnis Unique Look, to <a href="/mycreations/kotor2mods">my mods for <cite>Star Wars: Knights of the Old Republic II: The Sith Lords</cite></a> page.</li>
</ul>
<p class="date-style">9 November 2022:</p>
<ul>
<li>Added my latest mod, TSL Workbench Lightsaber Creation, to <a href="/mycreations/kotor2mods">my mods for <cite>Star Wars: Knights of the Old Republic II: The Sith Lords</cite></a> page.</li>
<li>Rearrange the mod catogeries on <a href="/mycreations/kotor2mods">my mod page for <cite>Star Wars: Knights of the Old Republic II: The Sith Lords</cite></a>. </li>
</ul>
<p class="date-style">23 October 2022:</p>
<ul>
<li>Added my latest mod, Trask Ulgo Without Tutorials, to <a href="/mycreations/kotor1mods">my mods for <cite>Star Wars: Knights of the Old Republic</cite></a> page.</li>
</ul>
<p class="date-style">22 October 2022:</p>
<ul>
<li>Added my latest mod, KotOR 1 Twi'lek Female NPC Diversity, to <a href="/mycreations/kotor1mods">my mods for <cite>Star Wars: Knights of the Old Republic</cite></a> page.</li>
</ul>
<p class="date-style">17 October 2022:</p>
<ul>
<li>Added new resource, <cite>Star Wars: Knights of the Old Republic</cite> save files, to <a href="/resources">my resources</a> page: Light Side Female Saves with KOTOR 1 Community Patch and All Romances.</li>
</ul>
<p class="date-style">16 October 2022:</p>
<ul>
<li>Added my latest mod, KotOR 1 No Gendered Dialogue from Male NPCs, to <a href="/mycreations/kotor1mods">my mods for <cite>Star Wars: Knights of the Old Republic</cite></a> page.</li>
</ul>
<p class="date-style">11 October 2022:</p>
<ul>
<li>Added my latest mod, Juhani Dialogue Restoration, to <a href="/mycreations/kotor1mods">my mods for <cite>Star Wars: Knights of the Old Republic</cite></a> page.</li>
<li>Added new article about <cite>Star Wars: Knights of the Old Republic</cite>: <a href="/shrines/starwarskotor/articles/juhani-hostility-towards-canderous.html">How to Access Juhani's Conversaion about Canderous without Restoration Mods</a></li>
</ul>
<p class="date-style">6 October 2022:</p>
<ul>
<li>Added the <a href="https://ogp.me/" target="_blank">Open Graph protocol</a> on each page.</li>
</ul>
<p class="date-style">5 October 2022:</p>
<ul>
<li>Added navigation links bar under the websit banner on each page.</li>
<li>Added new article about <cite>Star Wars: Knights of the Old Republic II: The Sith Lords</cite>: <a href="/shrines/starwarskotor/articles/handmaiden-sisters-mother.html">Where is the Mother of the Handmaidens Sisters?</a>.</li>
<li>Added resource: <a href="/shrines/starwarskotor/resources/kotor2-female-exile-recruit-handmaiden-mods.html">List of <cite>Star Wars: Knights of the Old Republic II: The Sith Lords</cite> Mods that Allow Female Exiles to Recruit the Handmaiden as a Party Member</a></li>
</ul>
<p class="date-style">4 October 2022:</p>
<ul>
<li>Added download links to <a href="https://www.dropbox.com/s/ilntlihyaabthzg/Love%20Between%20Brianna%20And%20The%20Exile%20-%20TSLRCM%20version.zip?dl=0" target="_blank">Love Between Brianna and the Exile - The Sith Lords Restored Content Mod Version</a> and <a href="https://www.dropbox.com/s/af3h6y793f3zjxq/Remote%20Tells%20Influence%20Patch%20for%20TSLRCM.zip?dl=0" target="_blank">Remote Tells Influence Patch for The Sith Lords Restored Content Mod</a> on my <a href="/mycreations/kotor2mods">KotOR 2 mods</a> page.</li>
</ul>
<p class="date-style">3 October 2022:</p>
<ul>
<li>Added banner images for each of my <a href="/mycreations/kotor1mods">KotOR 1 mods</a> and <a href="/mycreations/kotor2mods">KotOR 2 mods</a>.</li>
</ul>
<p class="date-style">1 October 2022:</p>
<ul>
<li>Added article: <a href="/articles/arren-kae-kreia-theory.html">Why I Personally Do Not Subscribe to the “Arren Kae is Kreia” Theory</a>.</li>
</ul>
<p class="date-style">30 September 2022:</p>
<ul>
<li>Adjusted the codes for the <a href="/articles">Articles</a> and <a href="/featured">Featured</a> pages.</li>
</ul>
<p class="date-style">25 September 2022:</p>
<ul>
<li>Added a button to <a href="https://www.buymeacoffee.com/leilukin" target="_blank">my Buy Me a Coffee page</a> on the home page and About page.</li>
<li>The top banner on each page is now linked to the home page.</li>
</ul>
<p class="date-style">20 September 2022:</p>
<ul>
<li>Website banner created and placed on the top each page.</li>
<li>Rearrange the buttons on the main page.</li>
<li>Created indivisual sub-pages for the pieces shared on the <a href="/featured">Featured page</a>.</li>
<li>Added information about the playlists on the <a href="/playlists">Playlists page</a>.</li>
<li>Added a page for <a href="/shrines/starwarskotor/resources/kotor-same-gender-romance-mods.html">same-gender romance mods for <cite>Star Wars: Knights of the Old Republic</cite> series.</a></li>
<li>Added table of contents for some pages.</li>
</ul>
<p class="date-style">16 September 2022:</p>
<ul>
<li>Adjusted the font size, line and paragraph spacing of the website to make it easier to read and more responsive.</li>
<li>Redesigned the buttons on the website.</li>
</ul>
<p class="date-style">12 September 2022:</p>
<ul>
<li>Created a page for <a href="/shrines/starwarskotor/resources/tslrcm-m478ep-modules-music.html">The Sith Lords Restored Content Mod + M4-78 Enhancement Project Modules, Warp Codes & Music Overview</a>.</li>
<li>Modified the HTML and CSS codes of the entire website to make the website more accessible.</li>
</ul>
<p class="date-style">11 September 2022:</p>
<ul>
<li>Website launch.</li>
</ul>
</article>
<!-- <aside class="right-sidebar">
Right sidebar content here
</aside> -->
</main>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -1,419 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr" id="page-top">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:url" content="https://leilukin.neocities.org/changelog/2023.html">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="Website Changelog Archive: 2023">
<meta property="og:description" content="Changelog of my website during the year of 2023.">
<link rel="stylesheet" href="/css/style-main.css" type="text/css" media="all">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.1/css/all.css">
<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">
<script src="/js/main-components.js" defer></script>
<title>Website Changelog Archive: 2023 | Leilukin's Hub</title>
</head>
<body>
<header class="main-header">
<noscript>
JavaScript is disabled in your browser. To get the best user experience on
this website, it is recommended that you enable it.
</noscript>
</header>
<nav class="navbar"></nav>
<main>
<!-- <aside class="left-sidebar">
Left sidebar content here
</aside> -->
<article>
<h1>Website Changelog Archive: 2023</h1>
<p>You can subscribe to the <a href="/feed.xml" target="blank">Leilukin's Hub RSS feed</a> or follow <a href="https://neocities.org/site/leilukin" target="_blank">my Neocities profile</a> to get notified of the updates on this website.</p>
<div class="web-btn-wrapper center-el">
<a href="/feed.xml" target="blank" title="Leilukin's Hub RSS Feed">
<img src="/assets/rss-button.gif" alt="RSS feed button">
</a>
</div>
<p class="center-text">
Archive: <a href="/changelog/">Latest</a> | <span class="bold-text">2023</span> | <a href="2022.html">2022</a> | <a href="layouts.html">Website Layouts</a>
</p>
<p class="date-style">20 November 2023:</p>
<ul>
<li>New blog post: <a href="/blog/posts/2023-11-20-Finally-Beat-A-Bugs-Life-Video-Game-24-Years-Later.html">Finally Beat A Bug's Life The Video Game — 24 Years Later</a></li>
</ul>
<p class="date-style">19 November 2023:</p>
<ul>
<li>New blog post: <a href="/blog/posts/2023-11-19-I-Can-Finally-Game-on-a-Solid-State-Drive.html">I Can Finally Game on a Solid-State Drive</a></li>
</ul>
<p class="date-style">9 November 2023:</p>
<ul>
<li>Added extra header elements to the main site and the shrines to be dynamically displayed on certain days to celebrate special events. (Credit to <a href="https://kotor.neocities.org/" target="_blank">KotOR Community Portal</a> for the inspiration)</li>
</ul>
<p class="date-style">30 October 2023:</p>
<ul>
<li>New blog post: <a href="/blog/posts/2023-10-30-Support-for-My-Steam-Review-of-A-Summers-End.html">Support for My Steam Review of A Summer's End — Hong Kong 1986</a>.</li>
</ul>
<p class="date-style">18 October 2023:</p>
<ul>
<li><cite>Cassette Beasts</cite> <a href="/shrines/cassettebeasts/">shrine</a>: Added Developer Notes section to the <a href="/shrines/cassettebeasts/trivia.html">Trivia</a> page.</li>
</ul>
<p class="date-style">13 October 2023:</p>
<ul>
<li>New blog post: <a href="/blog/posts/2023-10-13-My-Cassette-Beasts-Pombomb-Plushie-Arrived.html">My Cassette Beasts Pombomb Plushie Arrived!</a></li>
</ul>
<p class="date-style">4 October 2023:</p>
<ul>
<li><cite>Cassette Beasts</cite> <a href="/shrines/cassettebeasts/">shrine</a>: Updated the Development History section of the <a href="/shrines/cassettebeasts/trivia.html">Trivia</a> page with info about the release of Update 1.5 and "Pier of the Unknown" DLC.</li>
</ul>
<p class="date-style">3 October 2023:</p>
<ul>
<li>Changed this website's font to Noto Sans.</li>
<li><cite>Cassette Beasts</cite> <a href="/shrines/cassettebeasts/">shrine</a>: Added link to my record of all the bootleg mosnters I have encountered to the <a href="/shrines/cassettebeasts/gamelog/">Game Log</a> page.</li>
</ul>
<p class="date-style">28 September 2023:</p>
<ul>
<li><cite>Cassette Beasts</cite> <a href="/shrines/cassettebeasts/">shrine</a>: Removed the Developer Insight page since the official <cite>Cassette Beasts</cite> wiki not has a page for a <a href="https://wiki.cassettebeasts.com/wiki/List_of_Interviews" target="blankk">list of interviews</a> the <cite>Cassette Beasts</cite> staff participated in.</li>
</ul>
<p class="date-style">15 September 2023:</p>
<ul>
<li><cite>Cassette Beasts</cite> <a href="/shrines/cassettebeasts/">shrine</a>: Updated the <a href="/shrines/cassettebeasts/devinsights.html">Developer Insight</a> page by adding an Event Showcase section.</li>
</ul>
<p class="date-style">13 September 2023:</p>
<ul>
<li><cite>Cassette Beasts</cite> <a href="/shrines/cassettebeasts/">shrine</a>: Updated the <a href="/shrines/cassettebeasts/trivia.html">Trivia</a> page's Development History section with new information about the "Pier of the Unknown" DLC.</li>
</ul>
<p class="date-style">11 September 2023:</p>
<ul>
<li>New blog post: <a href="/blog/posts/2023-09-11-Happy-1st-Anniversary-to-Leilukins-Hub.html">Happy 1st Anniversary to Leilukin's Hub</a>.</li>
<li>Updated the <a href="/about/">About</a> page.</li>
<li>Modified <a href="/blog/">blog</a> style.</li>
<li>Added the blog's new layout to the <a href="/changelog/layouts.html">layout archive</a>.</li>
</ul>
<p class="date-style">10 September 2023:</p>
<ul>
<li><cite>Star Wars: Knights of the Old Republic</cite> <a href="/shrines/starwarskotor/">shrine</a>: Hide the right sidebar.</li>
<li><cite>A Summers End — Hong Kong 1986</cite> <a href="/shrines/asummersend/">shrine</a>: Change the content of the right sidebar.</li>
<li><cite>Cassette Beasts</cite> <a href="/shrines/cassettebeasts/">shrine</a>: Change the content of the right sidebar.</li>
</ul>
<p class="date-style">7 September 2023:</p>
<ul>
<li><cite>Cassette Beasts</cite> <a href="/shrines/cassettebeasts/">shrine</a>: The <a href="/shrines/cassettebeasts/articles/">Articles</a> page now includes other people's <cite>Cassette Beasts</cite> articles that I recommend.</li>
</ul>
<p class="center-text">
Archive: <span class="bold-text">Latest</span> | <a href="2022.html">2022</a> | <a href="layouts.html">Website Layouts</a>
</p>
<p class="date-style">6 September 2023:</p>
<ul>
<li>Moved pages of my video game mods and playlists to <a href="/mycreations/">My Creations</a> page.</li>
</ul>
<p class="date-style">4 September 2023:</p>
<ul>
<li><cite>Cassette Beasts</cite> <a href="/shrines/cassettebeasts/">shrine</a>: Updated the Development History section of the <a href="/shrines/cassettebeasts/trivia.html">Trivia</a> page.</li>
</ul>
<p class="date-style">30 August 2023:</p>
<ul>
<li><cite>Star Wars: Knights of the Old Republic</cite> <a href="/shrines/starwarskotor/">shrine</a>: Added new article: <a href="/shrines/starwarskotor/articles/tslrcm-first-kotor2-playthrough.html">Should You Use The Sith Lords Restored Content Mod in Your First <cite>Star Wars: KotOR 2</cite> Playthrough?</a>.</li>
<li>Adjusted spacing between each item in the article index lists.</li>
<li>Make the date format consistent throughout the entire site by using the Day-Month-Year format.</li>
<li>Fixed broken links in the <a href="/changelog/2022.html">2022 changelog archive</a> due to the affected pages moved to other parts of the site.</li>
</ul>
<p class="date-style">29 August 2023:</p>
<ul>
<li>Added link button for the site's RSS feed.</li>
<li>Fixed the overflow issue of header images.</li>
<li>Added custom style for the <a href="/sitemap.html">Site Map</a> page.</li>
<li>Improved accessibility of the site's design by customising the CSS <code class="inline-code">:focus</code> selector.</li>
</ul>
<p class="date-style">28 August 2023:</p>
<ul>
<li><cite>A Summers End — Hong Kong 1986</cite> <a href="/shrines/asummersend/">shrine</a>: Updated the main page with information about the spiritual sequel <cite>In the Ocean I Learned to Float</cite>.</li>
<li><cite>Cassette Beasts</cite> <shrine href="/shrines/cassettebeasts/">shrine</a>: Adjusted header image and added more images to the home page.</li>
<li>Leilukin Hub now has an <a href="/feed.xml" target="blank">RSS feed</a>.</li>
</ul>
<p class="date-style">26 August 2023:</p>
<ul>
<li><cite>Cassette Beasts</cite> <shrine href="/shrines/cassettebeasts/">shrine</a>:</li>
<ul>
<li>Added a new page for <a href="/shrines/cassettebeasts/devinsights.html">developer insights</a>.</li>
<li>Added an <a href="/shrines/cassettebeasts/articles/">Articles</a> page and a new article: <a href="/shrines/cassettebeasts/articles/cassette-beasts-more-than-a-pokemon-clone.html">How <cite>Cassette Beasts</cite> is Much More than a <cite>Pokémon</cite> Clone</a></li>
</ul>
</ul>
<p class="date-style">21 August 2023:</p>
<ul>
<li><cite>Star Wars: Knights of the Old Republic</cite> <a href="/shrines/starwarskotor/">shrine</a>: Added a new page for <a href="/shrines/starwarskotor/universes/index.html">my <cite>KotOR</cite> universes</a>.</li>
</ul>
<p class="date-style">18 August 2023:</p>
<ul>
<li><cite>Cassette Beasts</cite> <a href="/shrines/cassettebeasts/">shrine</a>: Added links to <cite>Cassette Beasts</cite>'s official website, wiki, and platforms to purchase the game to the home page.</li>
<li>New article: <a href="/articles/designated-lesbian-syndrome-fandom.html">Designated Lesbian Syndrome in Fandom</a>.</li>
</ul>
<p class="date-style">15 August 2023:</p>
<ul>
<li><cite>Cassette Beasts</cite> <a href="/shrines/cassettebeasts/">shrine</a>: Added a <a href="/shrines/cassettebeasts/gamelog">Game Log</a> page.</li>
</ul>
<p class="date-style">14 August 2023:</p>
<ul>
<li>New article: <a href="/articles/my-dislike-of-shipping-culture.html">My Disinterest in Shipping and Dislike of Shipping Culture</a>.</li>
</ul>
<p class="date-style">13 August 2023:</p>
<ul>
<li>Streamlined JavaScript code for the website's components.</li>
<li>Added JavaScript scripts to generate article table of contents automatically.</li>
</ul>
<p class="date-style">10 August 2023:</p>
<ul>
<li>Reformatted source and reference citations, such as the <a href="/shrines/asummersend/trivia.html">Trivia</a> page on the A Summers End — Hong Kong 1986 shrine.</li>
<li>Updated the <a href="/about/">About</a> page to add the site button and the link to the site's <a href="https://neocities.org/site/leilukin" target="_blank">Neocities profile</a>.</li>
<li><cite>Cassette Beasts</cite> <a href="/shrines/cassettebeasts/">shrine</a>: Added a <a href="/shrines/cassettebeasts/trivia.html">Trivia</a> page.</li>
</ul>
<p class="date-style">8 August 2023:</p>
<ul>
<li><cite>Cassette Beasts</cite> <a href="/shrines/cassettebeasts/">shrine</a>: Added a <a href="/shrines/cassettebeasts/featured.html">Featured</a> page.</li>
<li>Added new resource: <a href="/resources/web-building-resources.html">Web Building Resources</a>.</li>
</ul>
<p class="date-style">3 August 2023:</p>
<ul>
<li>Launched new <a href="/shrines/">shrine</a>: <a href="/shrines/cassettebeasts/"><cite>Cassette Beasts</cite></a>.</li>
</ul>
<p class="date-style">28 July 2023:</p>
<ul>
<li>New blog post: <a href="/blog/posts/2023-07-28-My-First-Birthday-After-the-Launch-of-Leilukins-Hub.html">My First Birthday After the Launch of Leilukin's Hub</a>.</li>
<li>Added shrine launch date to the footer of each <a href="/shrines/">shrine</a>.</li>
</ul>
<p class="date-style">27 July 2023:</p>
<ul>
<li>For <a href="/mycreations/">my mods page</a>, adjusted the background width of the individual mods.</li>
<li>Rearranged my <a href="/links/">Links</a> page.</li>
<li><cite>Star Wars: Knights of the Old Republic</cite> <a href="/shrines/starwarskotor/"></a>shrine</a>:</li>
<ul>
<li>Updated the main page.</li>
<li>Moved links to <cite>KotOR</cite> fan listings to the sidebar.</li>
<li>Added articles I recommend to the <a href="/shrines/starwarskotor/articles/">articles page</a>.</li>
</ul>
</ul>
<p class="date-style">26 July 2023:</p>
<ul>
<li>Leilukin's Hub now has a site button for you to link to!</li>
<li>Restructured the navigation bar.</li>
<li>Rearranged CSS and JavaScript file directories.</li>
<li>Renamed custom CSS properties.</li>
</ul>
<p class="date-style">25 July 2023:</p>
<ul>
<li>Leilukin's Hub now has a <a href="https://leilukin.123guestbook.com/" target="_blank">guestbook</a>!</li>
<li><cite>A Summers End — Hong Kong 1986</cite> <a href="/shrines/asummersend/"></a>shrine</a>: Replaced some of the images on the shrine's pages, including the header image.</li>
<li>Moved the link to the <a href="/sitemap.html">site map</a> from the navigation bar to the footer.</li>
</ul>
<p class="date-style">12 July 2023:</p>
<ul>
<li><cite>Star Wars: Knights of the Old Republic</cite> <a href="/shrines/starwarskotor/"></a>shrine</a>: Added new article: <a href="/shrines/starwarskotor/articles/partyswap-management-takeover.html">On Me Taking Over the Management and Development of DarthTyren's PartySwap Mod</a>.</li>
<li>Added PartySwap to my <a href="/mycreations/kotor2mods"><cite>Star Wars: Knights of the Old Republic II: The Sith Lords</cite> mod page</a>, since I have taken over the management and development of the mod.</li>
</ul>
<p class="date-style">28 June 2023:</p>
<ul>
<li><cite>Star Wars: Knights of the Old Republic</cite> <a href="/shrines/starwarskotor/"></a>shrine</a>: Added new article: <a href="/shrines/starwarskotor/articles/keep-juhani-a-lesbian.html">Keep Juhani a Lesbian and Keep Juhani's Romance Exclusive to Female Characters</a>.</li>
</ul>
<p class="date-style">27 June 2023:</p>
<ul>
<li><cite>Star Wars: Knights of the Old Republic</cite> <a href="/shrines/starwarskotor/">shrine</a>:</li>
<ul>
<li>Added new article: <a href="/shrines/starwarskotor/articles/faq-same-gender-romance-mods.html">Frequently Asked Questions (FAQ) for My Same-Gender Romance Mods for <cite>Star Wars: Knight of the Old Republic</cite> Series</a>.</li>
<li>Make the sidebar table of contents of <a href="/shrines/starwarskotor/guides/kotor-redeeming-bastila-guide.html"><cite>Star Wars: Knights of the Old Republic</cite>: Redeeming Bastila Guide</a> sticky.</li>
</ul>
<li>Fixed broken links on the navigation bar.</li>
<li>Modified footer content.</li>
<li>Removed unnecessary code in CSS.</li>
<li>Removed the background image of the shrines that was accidentally done through importing the main CSS.</li>
</ul>
<p class="date-style">26 June 2023:</p>
<ul>
<li>Replaced incorrect uses of semantic HTML tags throughout the entire website, such as replacing <code class="inline-code">&lt;em&gt;</code> that were used for media titles with <code class="inline-code">&lt;cite&gt;</code>, <code class="inline-code">&lt;strong&gt;</code> that were used for styling with custom CSS class.</li>
</ul>
<p class="date-style">23 June 2023:</p>
<ul>
<li>The HTML, CSS and JavaScript of entire website has been rewritten to improve the site's layout! See the <a href="/changelog/updates/2023-june-layout-rewrite.html">June 2023 Layout Rewrite</a> for more information!</li>
</ul>
<p class="date-style">15 June 2023:</p>
<ul>
<li>Removed unnecessary CSS files.</li>
<li>Refactored the index page's HTML and CSS.</li>
</ul>
<p class="date-style">11 June 2023:</p>
<ul>
<li>Widened the website content layout.</li>
<li>Changed the header image of my <cite>Star Wars: Knights of the Old Republic</cite> <a href="/shrines/starwarskotor/"></a>shrine</a>.</li>
</ul>
<p class="date-style">9 May 2023:</p>
<ul>
<li>New blog post: <a href="/blog/posts/2023-05-09-Onboard-the-Dracula-Daily-Hype-Train.html">Onboard the Dracula Daily Hype Train</a>.</li>
</ul>
<p class="date-style">5 May 2023:</p>
<ul>
<li>Modify the web application manifest of this site to make this site look more like a mobile app when added to a mobile device's home screen.</li>
</ul>
<p class="date-style">22 April 2023:</p>
<ul>
<li>Switch the content of the left and right sidebars. Navigation links are now on the left sidebar, while the table of contents on the right sidebar.</li>
<li>Proper indentation of the HTML codes.</li>
</ul>
<p class="date-style">27 March 2023:</p>
<ul>
<li>Added my latest mod, Leilukin's Juhani's Outfit Reskin Pack, to <a href="/mycreations/kotor1mods">my mods for <cite>Star Wars: Knights of the Old Republic</cite></a> page.</li>
</ul>
<p class="date-style">22 March 2023:</p>
<ul>
<li>Added the dates of publication of articles.</li>
</ul>
<p class="date-style">20 March 2023:</p>
<ul>
<li>Tweaked the format of the dates of publication and update of articles.</li>
</ul>
<p class="date-style">19 March 2023:</p>
<ul>
<li>Added a new masterlist on my <a href="/resources/">Resources</a> page: <a href="/resources/anti-harry-potter-jk-rowling-masterlist.html">Anti-Harry Potter and Anti-J. K. Rowling Masterlist</a></li>
<li>Changed the color of subheadings.</li>
</ul>
<p class="date-style">2 March 2023:</p>
<ul>
<li><cite>Star Wars: Knights of the Old Republic</cite> <a href="/shrines/starwarskotor/">shrine</a>: Updated the <a href="/shrines/starwarskotor/guides/">Guides page</a> to add a section for lists of cheats for the <cite>KotOR</cite> games.</li>
</ul>
<p class="date-style">18 February 2023:</p>
<ul>
<li>Added <a href="/sitemap.html">Site Map</a>.</li>
<li><cite>Star Wars: Knights of the Old Republic</cite> <a href="/shrines/starwarskotor/">shrine</a>: Added <a href="/shrines/starwarskotor/guides/">guides</a>:</li>
<ul>
<li><a href="/shrines/starwarskotor/guides/kotor-juhani-romance-guide.html">Juhani Romance Guide</a></li>
<li><a href="/shrines/starwarskotor/guides/kotor-redeeming-bastila-guide.html">Redeeming Bastila Guide</a></li>
<li><a href="/shrines/starwarskotor/guides/kotor-sandral-matale-feud-guide.html">Sandral-Matale Feud Ending Guide</a></li>
</ul>
<li>Added a Site Map button on the site's <a href="/">index page</a>.</li>
</ul>
<p class="date-style">17 February 2023:</p>
<ul>
<li><cite>A Summers End — Hong Kong 1986</cite> <a href="/shrines/asummersend/"></a>shrine</a>:</li>
<ul>
<li>Added a <a href="/shrines/asummersend/trivia.html">Trivia</a> page.</li>
<li>Added information and link to <cite>A Summer's End</cite>'s' official soundtrack on the <a href="/shrines/asummersend/playlists.html">Playlists</a> page.</li>
</ul>
<li>Added a new shrine: <a href="/shrines/starwarskotor/"><cite>Star Wars: Knights of the Old Republic</cite></a>.</li>
</ul>
<p class="date-style">16 February 2023:</p>
<ul>
<li>Added a <a href="/shrines/">Shrines</a> page, with the first e-shrine on this website being <a href="/shrines/asummersend/"><cite>A Summers End — Hong Kong 1986</cite></a>.</li>
</ul>
<p class="date-style">10 February 2023:</p>
<ul>
<li>Updated the banner image of my Alternate Revan Romances REDUX mod on the <a href="/mycreations/kotor2mods"><cite>Star Wars: Knights of the Old Republic II: The Sith Lords</cite> mod page</a>.</li>
<li>Added a Webrings section on the <a href="/home.html">home page</a>.</li>
</ul>
<p class="date-style">7 February 2023:</p>
<ul>
<li>Updated the <a href="/resources">Resources</a> page to add a my <a href="https://deadlystream.com/files/file/2249-missing-k1-party-member-ports-for-tsl-modders-resource/" target="_blank">Missing K1 Party Member Ports for TSL</a> modder's resource.</li>
</ul>
<p class="date-style">31 January 2023:</p>
<ul>
<li>Updated the <a href="/links">Links</a> page as I have officially joined the <a href="https://isaacfish.neocities.org/webring/" target="_blank">Queer Coded webring</a>.</li>
</ul>
<p class="date-style">30 January 2023:</p>
<ul>
<li>Added my latest mod, Juhani Item Pack for TSL, to <a href="/mycreations/kotor2mods">my mods for <cite>Star Wars: Knights of the Old Republic II: The Sith Lords</cite></a> page.</li>
</ul>
<p class="date-style">28 January 2023:</p>
<ul>
<li>Added a <a href="/links">Links</a> page.</li>
<li>Move the link to <a href="/changelog/">changelog</a> to the sidebar.</li>
<li>Due to these new changes to the navigation links on the sidebar, I wrote a JavaScript file to dynamically generate the contents on the right sidebar and the footer across multiple pages on this site.</li>
<li>Adjust the line spacing and the spacing between the listed items on the <a href="/changelog/">changelog</a> page.</li>
<li>Made adjustments to the relative paths in the HTML files, to ensure this site's favicons will show up on the title bar by default.</li>
<li>Fixed the issue of the page style not applied to the Not Found page.</li>
<li>Updated the <a href="/about">About</a> page.</li>
<li>Update the <a href="/not_found.html">Page Not Found</a> page.</li>
</ul>
<p class="date-style">26 January 2023:</p>
<ul>
<li>The entire website has been redesigned! See the <a href="./updates/2023-redesign.html">2023 New Year Redesign of Leilukin's Hub</a> for more information!</li>
</ul>
<p class="date-style">25 January 2023:</p>
<ul>
<li>Added my latest mod, TSL Twi'lek Male NPC Diversity, to <a href="/mycreations/kotor2mods">my mods for <cite>Star Wars: Knights of the Old Republic II: The Sith Lords</cite></a> page.</li>
<li>Corrected the mod description of KotOR 1 Twi'lek Male NPC Diversity on <a href="/mycreations/kotor1mods">my mods for <cite>Star Wars: Knights of the Old Republic</cite></a> page.</li>
</ul>
</article>
<!-- <aside class="right-sidebar">
Right sidebar content here
</aside> -->
</main>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -1,87 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr" id="page-top">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:url" content="https://leilukin.neocities.org/changelog">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="Website Changelog">
<meta property="og:description" content="Changelog of my website.">
<link rel="stylesheet" href="/css/style-main.css" type="text/css" media="all">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.1/css/all.css">
<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">
<script src="/js/main-components.js" defer></script>
<title>Website Changelog | Leilukin's Hub</title>
</head>
<body>
<header class="main-header">
<noscript>
JavaScript is disabled in your browser. To get the best user experience on
this website, it is recommended that you enable it.
</noscript>
</header>
<nav class="navbar"></nav>
<main>
<!-- <aside class="left-sidebar">
Left sidebar content here
</aside> -->
<article>
<h1>Website Changelog</h1>
<p>You can subscribe to the <a href="/feed.xml" target="blank">Leilukin's Hub RSS feed</a> or follow <a href="https://neocities.org/site/leilukin" target="_blank">my Neocities profile</a> to get notified of the updates on this website.</p>
<div class="web-btn-wrapper center-el">
<a href="/feed.xml" target="blank" title="Leilukin's Hub RSS Feed">
<img src="/assets/rss-button.gif" alt="RSS feed button">
</a>
</div>
<p class="center-text">
Archive: <span class="bold-text">Latest</span> | <a href="2023.html">2023</a> | <a href="2022.html">2022</a> | <a href="layouts.html">Website Layouts</a>
</p>
<!-- CHANGELOG ITEMS BEGIN HERE -->
<p class="date-style">5 April 2024:</p>
<ul>
<li>Add table of contents to my <a href="/mycreations/kotor1mods/"><cite>Star Wars: Knights of the Old Republic</cite></a> and <a href="/mycreations/kotor2mods/"><cite>Star Wars: Knights of the Old Republic II: The Sith Lords</cite> mods</a>.</li>
</ul>
<p class="date-style">6 March 2024:</p>
<ul>
<li>New blog post: <a href="/blog/posts/2024-03-06-I-Received-a-Lifetime-Premium-Membership-on-Nexus-Mods-for-Free.html">I Received a Lifetime Premium Membership on Nexus Mods for Free</a>.</li>
</ul>
<p class="date-style">8 February 2024:</p>
<ul>
<li><cite>Cassette Beasts</cite> <a href="/shrines/cassettebeasts/">shrine</a>: Added <a href="/shrines/cassettebeasts/resources.html">Resources</a> page.</li>
</ul>
<p class="date-style">7 February 2024:</p>
<ul>
<li><a href="/mycreations/">My Creations</a>: Added My Characters section.</li>
</ul>
<p class="date-style">9 January 2024:</p>
<ul>
<li><cite>Cassette Beasts</cite> <a href="/shrines/cassettebeasts/">shrine</a>: Added a new section: My Contributions to the <cite>Cassette Beasts</cite> community.</li>
</ul>
</article>
<!-- <aside class="right-sidebar">
Right sidebar content here
</aside> -->
</main>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -1,66 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr" id="page-top">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:url" content="https://leilukin.neocities.org/changelog/layouts.html">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="Website Layout Archive">
<meta property="og:description" content="An archive for the page layout designs mt website has used.">
<link rel="stylesheet" href="/css/style-main.css" type="text/css" media="all">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.1/css/all.css">
<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">
<script src="/js/main-components.js" defer></script>
<title>Website Layout Archive | Leilukin's Hub</title>
</head>
<body>
<header class="main-header">
<noscript>
JavaScript is disabled in your browser. To get the best user experience on
this website, it is recommended that you enable it.
</noscript>
</header>
<nav class="navbar"></nav>
<main>
<!-- <aside class="left-sidebar">
Left sidebar content here
</aside> -->
<article>
<h1>Website Layout Archive</h1>
<p class="center-text">
Archive: <a href="../changelog/">Latest</a> | <a href="2023.html">2023</a> | <a href="2022.html">2022</a> | <span class="bold-text">Website Layouts</span>
</p>
<h2>11 September 2023 Blog Layout</h2>
<img src="./layouts/Leilukins-Hub-blog-layout-2023-09.png" alt="Screenshot of Leilukin's Hub blog on 11 September 2023">
<h2>23 June 2023</h2>
<img src="./layouts/Leilukins-Hub-layout-2023-06.png" alt="Screenshot of Leilukin's Hub home page on 23 June 2023">
<h2>26 January 2023</h2>
<img src="./layouts/Leilukins-Hub-layout-2023-01.png" alt="Screenshot of Leilukin's Hub home page on 26 January 2023">
<h2>11 September 2022 (Site Launch)</h2>
<img src="./layouts/Leilukins-Hub-layout-2022-index.png" alt="Screenshot of Leilukin's Hub index page during the site's launch on 11 September 2022">
<img src="./layouts/Leilukins-Hub-layout-2022-page.png" alt="Screenshot of Leilukin's Hub My Creation page during the site's launch on 11 September 2022">
</article>
<!-- <aside class="right-sidebar">
Right sidebar content here
</aside> -->
</main>
<footer class="main-footer"></footer>
</body>
</html>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 MiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 171 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 164 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 341 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 303 KiB

View File

@ -1,70 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr" id="page-top">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:url" content="https://leilukin.neocities.org/articles/2023-june-layout-rewrite">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="June 2023 Layout Rewrite">
<meta property="og:description" content="The HTML, CSS and JavaScript of my entire website have been rewritten in June 2023 to improve its layout.">
<link rel="stylesheet" href="/css/style-main.css" type="text/css" media="all">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.1/css/all.css">
<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">
<script src="/js/main-components.js" defer></script>
<title>June 2023 Layout Rewrite | Leilukin's Hub</title>
</head>
<body>
<header class="main-header">
<noscript>
JavaScript is disabled in your browser. To get the best user experience on
this website, it is recommended that you enable it.
</noscript>
</header>
<nav class="navbar"></nav>
<main>
<!-- <aside class="left-sidebar">
Left sidebar content here
</aside> -->
<article>
<h1>June 2023 Layout Rewrite</h1>
<p class="center-text">Published on 23 June 2023</p>
<img src="../layouts/Leilukins-Hub-layout-2023-06.png" alt="A screenshot of Leilukin's Hub home page, with its new layout released on June 23, 2023" width="100%" height="auto">
<p>Happy Pride Month! It is always Pride on this literally <a href="https://isaacfish.neocities.org/webring/" target="_blank">queer-coded</a> (as in, literally coded by a queer person) website, so Leilukin's Hub decided to celebrate Pride Month with a major update — rewriting the entire website's layout!</p>
<p>This new layout remains the same colour scheme as the previous one, which went live in January this year. The most noticeable change you would see in this new layout is the sticky navigation bar, a feature that previously only existed in <a href="/shrines/">my shrines</a>. However, under the hood the HTML, CSS and JavaScript all have been rewritten from the ground up to optimise the site's layout.</p>
<h2>Highlights of the June 2023 layout rewrite of Leilukin's Hub:</h3>
<ul>
<li>A new navigation bar throughout the entire website, instead of putting links to this site's pages on the sidebar. The design of this navigation bar is inspired by the dropdown menu bar at the end of this article: <a href="https://webdesign.tutsplus.com/articles/best-practices-for-responsive-dropdown-menus--cms-35212" target="_blank">6 Best Practices for Building Responsive Dropdown Menus</a>.</li>
<li>Rewrite the HTML elements to improve the website's layout.</li>
<li>Use a mobile-first workflow to rewrite the CSS of this website to make the website more responsive to various screen sizes (mobile, tablet and desktop). </li>
<li>Streamline the CSS of the main parts of the site into one CSS file. The only pages that also have their own CSS due to unique elements with custom classes exclusive to the pages are <a href="/mymods/">my mod pages</a>. The shrines still have their own CSS files, however.</li>
<li>Use <a href="https://andy-bell.co.uk/a-modern-css-reset/" target="_blank">Andy Bell's modern CSS reset</a> for the CSS of the entire website.</li>
<li>The header, navigation bar and footer have their own scripts to dynamically render the content of these elements with JavaScript's <a href="https://www.javascripttutorial.net/javascript-dom/javascript-innerhtml/" target="_blank"><code class="inline-code">innerHTML</code></a> property.</li>
<li>Add a "Back to top" link to the footer to quickly scroll back to the top of the page you are viewing</li>
</ul>
<p>Rewriting the layout of this entire website has taken me many hours on this site redesign. Nevertheless, I am very pleased with how it turns out. Enjoy!</p>
</article>
<!-- <aside class="right-sidebar">
Right sidebar content here
</aside> -->
</main>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -1,76 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr" id="page-top">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:url" content="https://leilukin.neocities.org/articles/2023-redesign.html">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="2023 New Year Redesign of Leilukin's Hub">
<meta property="og:description" content="About giving my website a new design in light of a new year of 2023.">
<link rel="stylesheet" href="/css/style-main.css" type="text/css" media="all">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.1/css/all.css">
<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">
<script src="/js/main-components.js" defer></script>
<title>Website Layout Archive | Leilukin's Hub</title>
</head>
<body>
<header class="main-header">
<noscript>
JavaScript is disabled in your browser. To get the best user experience on
this website, it is recommended that you enable it.
</noscript>
</header>
<nav class="navbar"></nav>
<main>
<!-- <aside class="left-sidebar">
Left sidebar content here
</aside> -->
<article>
<h1>2023 New Year Redesign of Leilukin's Hub</h1>
<p class="center-text">Published on 26 January 2023</p>
<img src="../layouts/Leilukins-Hub-layout-2023-01.png" alt="A screenshot of Leilukin's Hub home page, with its layout design released on January 26, 2023" width="100%" height="auto">
<p>In light of a new year, the Leilukin's Hub website has received a new design on 26 January 2023!</p>
<p>I have wanted to rewrite and redesign this site after learning HTML and CSS more and getting better at writing those languages. With Visual Studio Code and the <a href="https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer" target="_blank">Live Server</a> extension installed, I have also finally found a good workflow for me to write and test HTML and CSS.</p>
<p>Looking at other Neocities websites have also given me more ideas in enhancing my own website. Special thanks to <a href="https://sadgrl.online/" target="_blank">sadgrl.online</a>, whose various web building resources, including the Layout Builder, have helped tremendously in redesigning this site.</p>
<p>With this 2023 new year redesign of this website, the index page, which is for when you visit the link <a href="https://leilukin.neocities.org/">leilukin.neocities.org</a>, you will be presented with a very simple page, but when you click the "Enter" button to enter, you will be brought to my website's home page, and can start properly browsing my website, and enjoying the new design!</p>
<h2>Highlights of the 2023 New Year redesign of Leilukin's Hub:</h2>
<ul>
<li>Uses purple colour schemes primarily, as purple is one of my favourite colours.</li>
<li>Each page category has their own CSS file, allowing me to give certain pages unique elements. However, the site still has a main CSS file to be imported into CSS files of other pages, saving me time to edit the CSS files one by one just to tweak a certain part of the main layout design.</li>
<li>Background image added.</li>
<li>Sidebars added, with the contents being sticky, so you can still see them while scrolling through.</li>
<li>The navigation links are now on the right sidebar. Previously, the navigation links of my website are in a row placed at the header section.</li>
<li>The table of contents of some of my pages is now placed on the left sidebar.</li>
<li>The <a href="/changelog/">website changelog</a> page adds archives for the layout designs of this site and old changelog.</li>
<li>My <a href="/mymods">video game mod pages</a> have added a filter function, so you can use buttons to view a specific category of mods.</li>
</ul>
<p>After spending many hours on this site redesign, I am very pleased with how it turns out. Hope you enjoy it!</p>
</article>
<!-- <aside class="right-sidebar">
Right sidebar content here
</aside> -->
</main>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -1,159 +0,0 @@
:root {
--clr-body-bg: #000000;
--clr-body-txt: #ffffff;
--clr-h1: #BA6FE8;
--clr-link-btn-bg: #7A37A3;
--clr-link-btn-hover: #BA6FE8;
--fs-h1: 4rem;
--fs-body: 1rem;
--fs-link-btn: 2rem;
--fw-reg: 400;
--fw-link-btn: 600;
}
/* CSS RESET */
/* Box sizing rules */
*,
*::before,
*::after {
box-sizing: border-box;
}
/* Remove default margin */
body,
h1,
h2,
h3,
h4,
p,
figure,
blockquote,
dl,
dd {
margin: 0;
}
/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
ul[role='list'],
ol[role='list'] {
list-style: none;
}
/* Set core root defaults */
html:focus-within {
scroll-behavior: smooth;
}
/* Set core body defaults */
body {
min-height: 100vh;
text-rendering: optimizeSpeed;
line-height: 1.5;
}
/* A elements that don't have a class get default styles */
a:not([class]) {
text-decoration-skip-ink: auto;
}
/* Make images easier to work with */
img,
picture {
max-width: 100%;
display: block;
}
/* Inherit fonts for inputs and buttons */
input,
button,
textarea,
select {
font: inherit;
}
/* Remove all animations, transitions and smooth scroll for people that prefer not to see them */
@media (prefers-reduced-motion: reduce) {
html:focus-within {
scroll-behavior: auto;
}
*,
*::before,
*::after {
animation-duration: 0.01ms !important;
animation-iteration-count: 1 !important;
transition-duration: 0.01ms !important;
scroll-behavior: auto !important;
}
}
/* STYLING BEGINS */
body {
font-size: var(--clr-body-bg);
font-family: 'Source Sans Pro', Arial, Helvetica, sans-serif;
color: #FFFFFF;
background: var(--clr-body-bg);
text-align: center;
}
body,
main {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
}
main {
max-width: 56rem;
}
h1 {
font-size: var(--fs-h1);
color: var(--clr-h1);
font-weight: var(--fw-reg);
letter-spacing: 0.08em;
margin: 2rem 0;
line-height: 1;
}
p {
font-size: 1.5rem;
}
.index__btn-wrapper {
display: flex;
flex-wrap: wrap;
justify-content: center;
margin: 1.5rem 0;
}
.index__link {
text-decoration: none;
font-size: var(--fs-link-btn);
font-weight: var(--fw-link-btn);
border: none;
border-radius: 0.6rem;
padding: 1rem 1.25rem;
margin: 0.5rem;
background: var(--clr-link-btn-bg);
color: var(--clr-body-txt);
text-transform: uppercase;
}
.index__link:hover {
cursor: pointer;
background: var(--clr-link-btn-hover);
transition: 0.5s;
}
.index__link:focus {
outline-offset: 0.15em;
outline: 0.1em solid var(--clr-body-txt);
}
a:focus img {
outline: 0.2em solid var(--clr-body-txt);
}

View File

@ -1,756 +0,0 @@
@import url('https://fonts.googleapis.com/css?family=Noto+Sans&display=swap');
/* ------------------- */
/* Custom Properties */
/* ------------------- */
:root {
--clr-body-bg: #08031A;
--img-body-bg: url('/assets/starsforever.png');
--clr-body-txt: #fceaff;
--clr-content-bg: #3d2163;
--clr-main-heading: #ED64F5;
--clr-sub-heading: #e8b86f;
--clr-title-border: #d3aad5;
--clr-bold-txt: #ff9933;
--clr-link: #ED64F5;
--clr-link-hover: #c355c9;
--clr-quote-bg: #13092D;
--clr-quote-border: #999999;
--clr-code-bg: #241445;
--clr-code-border: #82668f;
--clr-dates: rgb(158, 203, 255);
--clr-link-btn-bg: #873eb5;
--clr-link-btn-txt: white;
--clr-link-btn-hover: #241445;
--clr-main-header-bg: black;
--clr-navbar-bg: #222;
--clr-navbar-link: white;
--clr-main-footer-bg: #13092D;
--ff-primary: 'Noto Sans';
}
/* ------------------- */
/* CSS Reset */
/* ------------------- */
/* Box sizing rules */
*,
*::before,
*::after {
box-sizing: border-box;
}
/* Remove default margin */
body,
h1,
h2,
h3,
h4,
p,
figure,
blockquote,
dl,
dd {
margin: 0;
}
/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
ul[role='list'],
ol[role='list'] {
list-style: none;
}
/* Set core root defaults */
html:focus-within {
scroll-behavior: smooth;
}
/* Set core body defaults */
body {
min-height: 100vh;
text-rendering: optimizeSpeed;
line-height: 1.5;
}
/* A elements that don't have a class get default styles */
a:not([class]) {
text-decoration-skip-ink: auto;
}
/* Make images easier to work with */
img,
picture {
max-width: 100%;
display: block;
}
/* Inherit fonts for inputs and buttons */
input,
button,
textarea,
select {
font: inherit;
}
/* Remove all animations, transitions and smooth scroll for people that prefer not to see them */
@media (prefers-reduced-motion: reduce) {
html:focus-within {
scroll-behavior: auto;
}
*,
*::before,
*::after {
animation-duration: 0.01ms !important;
animation-iteration-count: 1 !important;
transition-duration: 0.01ms !important;
scroll-behavior: auto !important;
}
}
/* ------------------- */
/* STYLING BEGINS */
/* ------------------- */
/* General Styles */
body {
display: flex;
align-items: center;
flex-direction: column;
font-family: var(--ff-primary), Arial, Helvetica, sans-serif;
color: var(--clr-body-txt);
background-color: var(--clr-body-bg);
background-image: var(--img-body-bg);
background-attachment: fixed;
}
h1 {
color: var(--clr-main-heading);
}
h1 {
margin-bottom: 1.2rem;
}
h2, h3 {
color: var(--clr-sub-heading);
}
h1 {
font-size: 2.2rem;
border-bottom: 0.18rem solid var(--clr-title-border);
}
h2 {
font-size: 1.7rem;
}
article:not(.divided-article) h2,
article h3,
.content-section h3 {
margin-top: 1.5rem;
}
p {
padding: 0.5rem 0;
}
hr {
border: 0.05rem solid var(--clr-title-border);
}
strong {
color: var(--clr-bold-txt);
}
:focus {
outline: 0.15em solid var(--clr-body-txt);
}
a {
font-weight: 700;
color: var(--clr-link);
}
a:hover {
color: var(--clr-link-hover);
}
a:not([class]):focus {
outline: 0.15rem solid var(--clr-link);
}
a:focus img {
outline: 0.2em solid var(--clr-body-txt);
}
blockquote {
margin: 1.5rem 0;
padding: 0.5rem 1rem;
border-inline-start: 0.1rem solid var(--clr-main-heading);
background-color: var(--clr-quote-bg);
}
button:hover {
cursor: pointer;
}
button:focus,
detail:focus {
outline-offset: 0.2em;
}
pre {
white-space: pre-wrap;
overflow-x: auto;
}
summary {
cursor: pointer;
}
dl {
display: grid;
grid-gap: 0.5rem 1rem;
grid-template-columns: max-content;
}
dt {
font-weight: bold;
}
dd {
grid-column-start: 2;
}
/* ELEMENT STYLES WITH CUSTOM CLASSES */
.bold-text {
font-weight: 700;
}
.center-el {
display: grid;
place-content: center;
}
.center-text {
text-align: center;
}
.date-style {
font-weight: 700;
color: var(--clr-dates);
}
.hidden {
display: none;
}
.article-list {
display: grid;
gap: 0.5em;
}
/* HEADER COMPONENT */
.main-header {
width: 100%;
background-color: var(--clr-main-header-bg);
display: flex;
flex-direction: column;
justify-content: center;
text-align: center;
}
.main-header__top-bar {
background-color: var(--clr-navbar-bg);
width: 100%;
padding: 0.5em 0;
}
.main-header__img {
display: grid;
place-content: center;
}
.main-header img {
object-fit: scale-down;
overflow: hidden;
filter: drop-shadow(0.1rem 0.1rem 0.2rem black);
}
/* NAVIGATION BAR COMPONENT */
.navbar {
background: var(--clr-navbar-bg);
padding: 0 0.6rem;
width: 100%;
z-index: 999;
}
.navbar a {
color: var(--clr-navbar-link);
text-decoration: none;
cursor: pointer;
}
.navbar a:hover {
color: var(--clr-link-hover);
}
.navbar a:focus {
outline-offset: 0.3em;
outline: 0.15em solid var(--clr-navbar-link);
}
.nav__menu {
list-style: none;
padding: 0;
display: flex;
justify-content: space-evenly;
flex-wrap: wrap;
gap: 0.5rem;
}
/* Added to the navbar with JS when it reaches its scroll position */
.sticky-nav {
position: fixed;
width: 100%;
top: 0;
}
/* Add some top padding to the page content to prevent sudden quick movement
as the navigation bar gets a new position at the top of the page
(position:fixed and top:0) */
.sticky-nav + main {
padding-top: 3.75rem;
}
/* MAIN CONTENT */
main,
.content-container,
.divided-article {
gap: 0.8rem;
display: flex;
flex-direction: column;
width: 100%;
}
main {
font-size: 1.2rem;
}
article:not(.divided-article),
.content-section,
.qna-section {
background-color: var(--clr-content-bg);
padding: 1.35rem;
}
.article-section {
padding: 1.25rem 0;
}
article, .content-container {
order: 1;
}
.sidebar--sticky {
position: sticky;
top: 5rem;
}
.left-sidebar,
.right-sidebar {
padding: 1rem;
font-size: 0.9rem;
background-color: var(--clr-content-bg);
}
.left-sidebar {
order: 2;
}
.right-sidebar {
order: 3;
}
.left-sidebar:empty,
.right-sidebar:empty {
display: none;
}
/* Tablet main content layout */
@media only screen and (min-width: 43.75rem) {
main {
flex-direction: row;
}
aside {
width: 10rem;
}
article, .content-container {
flex: 1;
order: 2;
}
.left-sidebar {
order: 1;
}
.right-sidebar {
order: 3;
}
}
/* Desktop main content layout */
@media only screen and (min-width: 60rem) {
main {
width: 60rem;
display: flex;
flex-direction: row;
justify-content: center;
}
aside {
width: 12rem;
}
}
@media only screen and (min-width: 65rem) {
main {
width: 65rem;
}
}
/* CUSTOM CLASSES FOR SPECIAL ELEMENTS */
.inline-code {
font-family: monospace;
border: 0.07rem solid var(--clr-code-border);
padding: 0.125rem 0.3rem;
margin: 0 0.125rem;
background: var(--clr-code-bg);
}
.code-snippet {
background: var(--clr-code-bg);
border: 0.08rem solid var(--clr-code-border);
display: block;
padding: 0.5em 0.8rem;
overflow-x: auto;
word-break: keep-all;
}
.text-box {
background: var(--clr-quote-bg);
border: 0.1em solid var(--clr-main-heading);
padding: 0.4em 0.8em;
margin: 0.5em 0;
}
/* Link button */
.link-btn {
font: 1.3rem 'Source Sans Pro', Arial, sans-serif;
display: inline-block;
border: 0.15rem solid var(--clr-link-btn-bg);
border-radius: 0.6rem;
padding: 0.75rem 1rem;
margin: 0.3rem;
background: var(--clr-link-btn-bg);
color: var(--clr-link-btn-txt);
cursor: pointer;
font-weight: 700;
text-transform: uppercase;
}
.link-btn,
.link-btn:hover,
.link-btn:visited {
text-decoration: none;
}
.link-btn:hover {
cursor: pointer;
background: var(--clr-link-btn-hover);
transition: 0.5s;
}
.link-btn:focus {
outline-offset: 0.2em;
outline: 0.15em solid var(--clr-link);
}
/* Q&A accordion */
.qna-accordion {
padding: 1rem 0;
}
.qna-accordion__question {
font-weight: 700;
}
.qna-accordion__answer {
padding: 0.7rem 1.5rem;
margin-top: 0.5rem;
background: hsla(0, 0%, 100%, 0.15);
}
/* Spoiler Accordion */
.spoiler-accordion {
padding: 0.5rem 0;
}
.spoiler-accordion__hint {
font-weight: 700;
}
.spoiler-accordion__spoiler {
padding: 0 1rem;
}
/* Embedded YouTube video */
.full-width-youtube-video {
position: relative;
padding-bottom: 56.25%;
height: 0;
}
.full-width-youtube-video iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
/* Website link button */
.site-btn__container {
display: flex;
gap: 1rem;
align-items: center;
margin: 0.5rem 0;
}
.site-btn__textarea {
width: 10rem;
height: 2.5rem;
font-size: 0.75rem;
background-color:black;
color: var(--clr-body-txt);
}
.copy-txt-btn {
border: none;
background: var(--clr-link-btn-bg);
color: var(--clr-body-txt);
padding: 0.3rem 0.8rem;
border-radius: 0.5rem;
font-size: 0.9rem;
font-weight: bold;
}
.copy-txt-btn:hover {
background: var(--clr-link-hover);
}
/* Web button lists */
.web-btn-wrapper {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
}
/* References list */
.references-list {
font-size: 0.96em;
}
/* Pride flag backgrounds */
.flag-ace {
background: repeating-linear-gradient(
#000000 0 25%,
#a3a3a3 0 50%,
#ffffff 0 75%,
#800080 0 100%
);
}
.flag-agender {
background: linear-gradient(
black 0 14.28%,
silver 0 28.57%,
white 0 42.85%,
#a3fa73 0 57.14%,
white 0 71.42%,
silver 0 85.71%,
black 0
);
}
.flag-aro {
background: linear-gradient(
#0a2 20%,
#7d6 0 40%,
white 0 60%,
darkgray 0 80%,
black 0
);
}
.flag-bi {
background: repeating-linear-gradient(
#d60270 0 40%,
#9b4f97 0 60%,
#0038a7 0 100%
);
}
.flag-demigirl {
background: linear-gradient(
#7F7F7F 0 14.28%,
#C4C4C4 0 28.57%,
#FDADC8 0 42.85%,
white 0 57.14%,
#FDADC8 0 71.42%,
#C4C4C4 0 85.71%,
#7F7F7F 0
);
}
.flag-bigender {
background: linear-gradient(
#d074a2 0 14.28%,
#f8a1cd 0 28.57%,
#d9c6ea 0 42.85%,
white 0 57.14%,
#d9c6ea 0 71.42%,
#90c8ec 0 85.71%,
#6583d5 0
);
}
.flag-gilbert-baker {
background: linear-gradient(
#FF6599 12.5%,
#e40303 0 25%,
#ff8c00 0 37.5%,
#ffed00 0 50%,
#008026 0 62.5%,
#00C0C0 0 75%,
#004dff 0 87.5%,
#750787 0
);
}
.flag-gilbert-baker-2017 {
background: linear-gradient(
#CD66FF 11.1%,
#FF6599 0 22.2%,
#e40303 0 33.3%,
#ff8c00 0 44.4%,
#ffed00 0 55.5%,
#008026 0 66.6%,
#00C0C0 0 77.7%,
#004dff 0 88.8%,
#750787 0
);
}
.flag-intersex {
background: radial-gradient(closest-side circle at center,
#ffd800 44%,
#7902aa 44%,
#7902aa 56%,
#ffd800 56%
);
}
.flag-lesbian {
background: repeating-linear-gradient(
#d52d00 0 14.29%,
#ef7627 0 28.57%,
#ff9a56 0 42.86%,
#ffffff 0 57.14%,
#d362a4 0 71.43%,
#b85490 0 86.71%,
#a30262 0 100%
);
}
.flag-non-binary {
background: repeating-linear-gradient(
#fff430 0 25%,
#ffffff 0 50%,
#9c59d1 0 75%,
#000000 0 100%
);
}
.flag-pan {
background: repeating-linear-gradient(
#ff218c 0 33.33%,
#ffd800 0 66.67%,
#21b1ff 0 100%
);
}
.flag-progress {
background:
conic-gradient(at 14% 50%, #0000 221.25deg, #ffffff 222deg 318deg, #0000 318.25deg),
conic-gradient(at 23% 50%, #0000 221.25deg, #f5a9b8 222deg 318deg, #0000 318.25deg),
conic-gradient(at 32% 50%, #0000 221.25deg, #5bcefa 222deg 318deg, #0000 318.25deg),
conic-gradient(at 41% 50%, #0000 221.25deg, #784F17 222deg 318deg, #0000 318.25deg),
conic-gradient(at 50% 50%, #0000 221.25deg, black 222deg 318deg, #0000 318.25deg),
linear-gradient(#e40303 0 16.66%, #ff8c00 0 33.33%, #ffed00 0 50%, #008026 0 66.66%, #004dff 0 83.33%, #750787 0);
}
.flag-progress-intersex {
background:
radial-gradient(circle at 9.75% 50%, #0000 6.66%, #7902aa 6.7% 8.33%, #0000 8.4%),
conic-gradient(at 26.66% 50%, #0000 222.75deg, #ffd800 0 317.25deg, #0000 0),
conic-gradient(at 33% 50%, #0000 222.75deg, #ffffff 0 317.25deg, #0000 0),
conic-gradient(at 39% 50%, #0000 222.75deg, #f5a9b8 0 317.25deg, #0000 0),
conic-gradient(at 45.66% 50%, #0000 222.75deg, #5bcefa 0 317.25deg, #0000 0),
conic-gradient(at 52% 50%, #0000 222.75deg, #753000 0 317.25deg, #0000 0),
conic-gradient(at 58.33% 50%, #0000 222.75deg, #000 0 317.25deg, #0000 0),
linear-gradient(#e40303 0 16.66%, #ff8c00 0 33.33%, #ffed00 0 50%, #008026 0 66.66%, #004dff 0 83.33%, #750787 0);
}
.flag-rainbow {
background: repeating-linear-gradient(
#e40303 0 16.67%,
#ff8c00 0 33.33%,
#ffed00 0 50%,
#008026 0 66.67%,
#004dff 0 83.33%,
#750787 0 100%
);
}
.flag-trans {
background: repeating-linear-gradient(
#5bcefa 0 20%,
#f5a9b8 0 40%,
#ffffff 0 60%,
#f5a9b8 0 80%,
#5bcefa 0 100%
);
}
/* FOOTER COMPONENT */
.main-footer {
background: var(--clr-main-footer-bg);
width: 100%;
padding: 0.5rem;
text-align: center;
}
.main-footer p {
padding: 0;
}

View File

@ -1,45 +0,0 @@
.index-link {
font-size: 1.6rem;
}
.psa {
font-weight: 700;
font-size: 1.4rem;
}
.mod-entry {
background: #241445;
position:relative;
margin: 1em 0;
padding: 1em 1.5em 1.5em 1.5em;
}
.filter-div {
display: none; /* Hidden by default */
}
/* The "show-items" class is added to the filtered elements */
.show-items {
display: block;
}
.filter-btn {
border: none;
outline: none;
padding: 0.75rem 1rem;
margin: 0.1875rem 0;
background-color: #d3aad5;
color: #241445;
cursor: pointer;
font-weight: 800;
font-size: 1.1rem;
}
.filter-btn:hover {
background-color: #d5c2d6;
}
.filter-btn.active {
background-color: #241445;
color: #ED64F5;
}

View File

@ -1,35 +0,0 @@
main ul {
display: grid;
gap: 0.5rem;
}
.link-list {
margin: 0 0 0 1em;
padding: 0;
list-style: none;
}
.link-list a:focus {
outline: 0.15rem solid var(--clr-link);
}
.link-list li {
padding-left: 0.5em;
align-items: start;
}
.link-list li::marker {
content: "▶";
}
.link-list ul li::marker {
content: "★";
}
.link-list ul ul li::marker {
content: "♥";
}
.link-list ul ul ul li::marker {
content: "❣";
}

View File

@ -1,68 +0,0 @@
/* Article Table of Contents */
.toc {
background-color: var(--clr-quote-bg);
max-width: max-content;
padding: 1rem 1.3rem 0.3rem 1.3rem;
margin-top: 1rem;
outline: 1px solid var(--clr-title-border);
position: relative;
border-radius: 0.4rem;
}
.toc-heading {
font-size: 1.1rem;
font-weight: 700;
margin-bottom: 0.5rem;
margin-right: 2rem;
cursor: pointer;
}
.toc ol {
border-top: 1px solid var(--clr-title-border);
padding: 0.8em 0 0 1em;
line-height: 1.8;
}
.toc ol ul {
list-style-type: disc;
line-height: 1.5;
padding-left: 1em;
}
.toc a {
font-size: 1.1rem;
padding-left: 0.4rem;
}
.toc ul a {
padding: 0;
font-size: 1rem;
}
/* Sidebar Table of Contents */
.sidebar__toc {
position: sticky;
top: 4rem;
}
.sidebar__toc-title {
font-size: 1.3rem;
font-weight: bold;
}
.sidebar__toc ol {
list-style: none;
margin-left: 0;
padding-left: 0;
font-size: 1rem;
}
.sidebar__toc ol li {
margin-bottom: 0.5em;
}
.sidebar__toc ol ul {
padding-top: 0.5em;
padding-left: 1.25rem;
list-style-type: disc;
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 183 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 167 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 128 KiB

View File

@ -1,57 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr" id="page-top">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:url" content="https://leilukin.neocities.org/featured">
<meta property="og:type" content="website">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="Featured | Leilukin's Hub">
<meta property="og:description" content="Compilation of me and my work getting featured on other websites or platforms, including interviews and spotlights.">
<link rel="stylesheet" href="/css/style-main.css" type="text/css" media="all">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.1/css/all.css">
<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">
<script src="/js/main-components.js" defer></script>
<title>Featured | Leilukin's Hub</title>
</head>
<body>
<header class="main-header">
<noscript>
JavaScript is disabled in your browser. To get the best user experience on
this website, it is recommended that you enable it.
</noscript>
</header>
<nav class="navbar"></nav>
<main>
<!-- <aside class="left-sidebar">
Left sidebar content here
</aside> -->
<div class="content-container">
<section class="content-section">
<h1>Featured</h1>
<h2>Interviews with Me</h2>
<ul class="article-list">
<li><a href="./kotor2-modder-interview-ars-technica.html">The modders who spent 15 years fixing Knights of the Old Republic 2 @ Ars Technica</a></li>
<li><a href="./lgbtq-booklet-interview-misi-bawang.html">Artist Interview for MISI:Bawang's Floating in a Sky Full of Pride</a></li>
</ul>
</section>
</div>
<!-- <aside class="right-sidebar">
Right sidebar content here
</aside> -->
</main>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -1,68 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr" id="page-top">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:url" content="https://leilukin.neocities.org/featured/kotor2-modder-interview-ars-technica">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="The modders who spent 15 years fixing Knights of the Old Republic 2 @ Ars Technica">
<meta property="og:description" content="Ars Technica's article on the KotOR 2's modding community to celebrate the game's 15th anniversary. I was interviewed for my same-gender romance mods for KotOR 2.">
<link rel="stylesheet" href="/css/style-main.css" type="text/css" media="all">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.1/css/all.css">
<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">
<script src="/js/main-components.js" defer></script>
<title>KotOR 2 Modders Interview on Ars Technica | Featured | Leilukin's Hub</title>
</head>
<body>
<header class="main-header">
<noscript>
JavaScript is disabled in your browser. To get the best user experience on
this website, it is recommended that you enable it.
</noscript>
</header>
<nav class="navbar"></nav>
<main>
<!-- <aside class="left-sidebar">
Left sidebar content here
</aside> -->
<article>
<h1>The modders who spent 15 years fixing <cite>Knights of the Old Republic 2</cite> @ Ars Technica</h1>
<p>On 6 December 2019, to celebrate the 15th anniversary of <cite>Star Wars: Knights of the Old Republic 2</cite>, Ars Technica has published <a href="https://arstechnica.com/gaming/2019/12/the-modders-that-spent-15-years-fixing-knights-of-the-old-republic-2/" target="_blank">an article about the modding community of KotOR 2</a>. I was interviewed by the author of this article, Austin Taylor, for my same-gender romance mods for KotOR 2.</p>
<blockquote>
<h3>Romance? Yes, Please</h3>
<p><a href="https://starwars.fandom.com/wiki/Juhani" target="_blank">Unlike the first <cite>KOTOR</cite></a>, there are no same-gender romance options in Obsidians sequel. Leilukin, a modder on the Nexus Forums, has focused much of her modding work since 2016 on <a href="https://www.nexusmods.com/kotor2/mods/927" target="_blank">fixing that oversight.</a></p>
<p>“As much as I love KOTOR2, I have always been frustrated by the fact that the romance content with the companions and certain NPCs… are all heterosexual,” she said.</p>
<p>Some of these fixes are relatively simple. In vanilla <cite>KOTOR2</cite>, for instance, only male characters can recruit The Handmaiden upon leaving Telos, while female characters are the only ones who can recruit The Disciple during the main quest on Dantooine. By default, Leilukens mod simply flips that gender check, so only male characters can recruit the Disciple and only females can recruit The Handmaiden.</p>
<p>But Leilukens mod goes further than that. The most challenging part, she said, was finding every reference to the Exiles gender throughout the game spoken by gender-specific party members, then “add[ing] extra dialogue that replaces the pronouns and splic[ing] voiceover files myself.”</p>
<p>To recruit both The Handmaiden and The Disciple at the same time, players can install the <a href="https://deadlystream.com/files/file/544-partyswap/" target="_blank">PartySwap mod by DarthTyren</a>. That mod was initially lacking the same-gender romance dialogue from Leilukens mod. But Leiluken has since added a compatibility installation option, letting the two mods now work together and fully opening up the same-gender romance options of your dreams.</p>
</blockquote>
<p>Read the full article on Ars Technica here:<br>
<a href="https://arstechnica.com/gaming/2019/12/the-modders-that-spent-15-years-fixing-knights-of-the-old-republic-2/" target="_blank">The modders who spent 15 years fixing <cite>Knights of the Old Republic 2</cite></a></p>
</article>
<!-- <aside class="right-sidebar">
Right sidebar content here
</aside> -->
</main>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -1,87 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr" id="page-top">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:url" content="https://leilukin.neocities.org/featured/lgbtq-booklet-interview-misi-bawang">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="Floating in a Sky Full of Pride: LGBTQ+ Booklet Artist Interview from MISI:Bawang">
<meta property="og:description" content="My submission for MISI:Bawang's booklet about LGBTQ+ Malaysians was accepted and published. Here is MISI:Bawang's interview with me regarding my work and my queer identity.">
<link rel="stylesheet" href="/css/style-main.css" type="text/css" media="all">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.1/css/all.css">
<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">
<script src="/js/main-components.js" defer></script>
<title>LGBTQ+ Booklet Artist Interview from MISI:Bawang | Featured | Leilukin's Hub</title>
</head>
<body>
<header class="main-header">
<noscript>
JavaScript is disabled in your browser. To get the best user experience on
this website, it is recommended that you enable it.
</noscript>
</header>
<nav class="navbar"></nav>
<main>
<!-- <aside class="left-sidebar">
Left sidebar content here
</aside> -->
<article>
<h1>Floating in a Sky Full of Pride: LGBTQ+ Booklet Artist Interview from MISI:Bawang</h1>
<p class="center-text">
(This article is also available on <a href="https://leilukinart.tumblr.com/post/676165415142031360/misibawang-a-malaysian-digital-booklet-project" target="_blank">my art blog on Tumblr</a>)
</p>
<p><a href="https://bawangqueerbooklet.msolidariti.org/" target="_blank">Floating in a Sky Full of Pride</a>, the LGBTQ+ booklet of <a href="https://misibawang.msolidariti.org/" target="_blank">MISI:Bawang</a>, a Malaysian digital booklet project, has been released on Valentines Day 2022. Since my submitted art piece, Life of a Bee with Pride, has been selected to be included in the booklet, I had received the honour of being interviewed by MISI:Bawang to share my personal experience with my LGBTQ+ identity, favourite queer art/media, and a ✨ special message to the Malaysian LGBTQ+ community. 🏳‍🌈</p>
<img src="./img/Bawang-Booklet-Interview-Leilukin-1.jpg" width="100%" height="auto" alt="First slide of MISI:Bawang's interview with me for their LGBTQ+ booklet"><br>
<img src="./img/Bawang-Booklet-Interview-Leilukin-2.jpg" width="100%" height="auto" alt="Second slide of MISI:Bawang's interview with me for their LGBTQ+ booklet"><br>
<img src="./img/Bawang-Booklet-Interview-Leilukin-3.jpg" width="100%" height="auto" alt="Third slide of MISI:Bawang's interview with me for their LGBTQ+ booklet"><br>
<p>MISI:Bawang has shared their interview with me and other Malaysian LGBTQ+ artists and authors who submitted their work to the booklet on Twitter and Instagram. Here are the <a href="https://twitter.com/misi_bawang/status/1470247663471763464" target="_blank">Twitter thread</a> and <a href="https://www.instagram.com/p/CXSlIbsJXsM/" target="_blank">Instagram post</a> that include my interview.</p>
<p>Text version of my interview below:</p>
<h4><strong>“What was your experience discovering your LGBTQ+ identity?”</strong></h4>
<blockquote>
<p>The first clear signs of my attraction to women I was aware of started from my secondary school days. However, due to lack of knowledge and awareness of same-gender attraction and identities, I brushed it off as a teenage phase.</p>
<p>However, that changed as I started becoming active on Tumblr since I was 19. At first, I joined Tumblr to connect with people who share my interest in Star Wars and BioWare games. This led me to get to know LGBTQ+ from different parts of the world, which is especially helped by the fact that BioWare games are known for LGBTQ+ representation, therefore LGBTQ+ people are visible in BioWare player communities. This started my journey of questioning my sexuality and gender.</p>
<p>As I continue to stay on Tumblr, my engagement with LGBTQ+ people on Tumblr had gone beyond shared interest in entertainment media. Through Tumblr, I discovered many LGBTQ+ resources that helped me figure out my identity. As a result, at the age of 22, I eventually realised that I am a non-binary lesbian.</p>
</blockquote>
<h4><strong>“Are there any LGBTQ+ related art (books, films, etc) that gives you comfort, inspiration, and strength? If so, tell us about them!”</strong></h4>
<blockquote>
<p><cite>A Summers End - Hong Kong 1986</cite> is the LGBTQ+ art that gives me comfort, inspiration and strength the most. It is an indie visual novel developed by the Asian Canadian studio Oracle and Bone. The story is about a lesbian romance that takes place in Hong Kong in the year of 1986.</p>
<p><cite>A Summers End</cite> is the LGBTQ+ art I relate to most because it strongly resonates with my identity as a Cantonese-speaking Chinese lesbian who has grown up with Hong Kong media. I relate to both the protagonists, Michelle and Sam, as their characters represent different parts of my life as a Chinese lesbian. I also relate to the storys theme of hoping for the future of our homeland despite the political uncertainties.</p>
</blockquote>
<h4><strong>“Do you have a message to LGBTQ+ community living in Malaysia?”</strong></h4>
<blockquote>
<p>First and foremost, you are not alone. LGBTQ+ Malaysians have a community that continues to survive despite the hardship we have to face due to societys bigotry and misunderstanding of LGBTQ+ people and identities.</p>
<p>I hope the LGBTQ+ community in Malaysia will continue to grow and thrive, and more LGBTQ+ Malaysians who are still questioning and feeling lonely could be reached out. Let us work towards a future where we could live freely.</p>
</blockquote>
</article>
<!-- <aside class="right-sidebar">
Right sidebar content here
</aside> -->
</main>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -1,135 +0,0 @@
<?xml version="1.0" encoding="utf-8"?>
<rss version="2.0">
<channel>
<generator>RSS Builder by B!Soft</generator>
<title>Leilukin's Hub</title>
<link>https://leilukin.neocities.org/</link>
<description>Leilukin's personal website.</description>
<language>en-gb</language>
<image>
<title>Leilukin's Hub</title>
<link>https://leilukin.neocities.org/</link>
<url>https://leilukin.neocities.org/assets/Leilukins-Hub-website-banner-black-bg.png</url>
<width>900</width>
<height>300</height>
</image>
<item>
<title>Changelog: 5 April 2024</title>
<pubDate>Fri, 5 Apr 2024 17:58:14 +0800</pubDate>
<description><![CDATA[
<ul>
<li>Add table of contents to my <a href="/mycreations/kotor1mods/"><cite>Star Wars: Knights of the Old Republic</cite></a> and <a href="/mycreations/kotor2mods/"><cite>Star Wars: Knights of the Old Republic II: The Sith Lords</cite> mods</a>.</li>
</ul>
]]></description>
</item>
<item>
<title>I Received a Lifetime Premium Membership on Nexus Mods for Free</title>
<pubDate>Thu, 7 Mar 2024 00:07:04 +0800</pubDate>
<link>https://leilukin.neocities.org/blog/posts/2024-03-06-I-Received-a-Lifetime-Premium-Membership-on-Nexus-Mods-for-Free.html</link>
<author>Leilukin</author>
<description><![CDATA[
<p>New blog post.</p>
<p>In light of my mods hosted on Nexus Mods reaching 30,000 unique downloads, I was rewarded a free lifetime Premium membership on Nexus Mods.</p>
]]></description>
</item>
<item>
<title>Changelog: 8 February 2024</title>
<pubDate>Thu, 8 Feb 2024 10:30:34 +0800</pubDate>
<description><![CDATA[
<ul>
<li><cite>Cassette Beasts</cite> <a href="/shrines/cassettebeasts/">shrine</a>: Added <a href="/shrines/cassettebeasts/resources.html">Resources</a> page.</li>
</ul>
]]></description>
</item>
<item>
<title>Changelog: 7 February 2024</title>
<pubDate>Wed, 7 Feb 2024 21:49:21 +0800</pubDate>
<description><![CDATA[
<ul>
<li><a href="/mycreations/">My Creations</a>: Added My Characters section.</li>
</ul>
]]></description>
</item>
<item>
<title>Changelog: 9 January 2024</title>
<pubDate>Tue, 9 Jan 2024 17:29:48 +0800</pubDate>
<description><![CDATA[
<ul>
<li><cite>Cassette Beasts</cite> <a href="/shrines/cassettebeasts/">shrine</a>: Added a new section: My Contributions to the <cite>Cassette Beasts</cite> community.</li>
</ul>
]]></description>
</item>
<item>
<title>Finally Beat A Bug's Life The Video Game — 24 Years Later</title>
<pubDate>Mon, 20 Nov 2023 20:13:18 +0800</pubDate>
<link>https://leilukin.neocities.org/blog/2023-11-20-Finally-Beat-A-Bugs-Life-Video-Game-24-Years-Later.html</link>
<author>Leilukin</author>
<description><![CDATA[
<p>New blog post.</p>
<p>My childhood goal of beating A Bug's Life video game was finally fulfilled.</p>
]]></description>
</item>
<item>
<title>I Can Finally Game on a Solid-State Drive</title>
<pubDate>Sun, 19 Nov 2023 17:10:18 +0800</pubDate>
<link>https://leilukin.neocities.org/blog/2023-11-19-I-Can-Finally-Game-on-a-Solid-State-Drive.html</link>
<author>Leilukin</author>
<description><![CDATA[
<p>New blog post.</p>
<p>I just got the solid-state drive (SSD) of my 5-year-old gaming laptop replaced with a new onw with a larger storage capacity, allowing me to install games on an SSD to enjoy the benefit of gaming on an SSD.</p>
]]></description>
</item>
<item>
<title>Changelog: 9 November 2023</title>
<pubDate>Thu, 9 Nov 2023 20:09:00 +0800</pubDate>
<description><![CDATA[
<ul>
<li>Added extra header elements to the main site and the shrines to be dynamically displayed on certain days to celebrate special events. (Credit to <a href="https://kotor.neocities.org/" target="_blank">KotOR Community Portal</a> for the inspiration)</li>
</ul>
]]></description>
</item>
<item>
<title>Support for My Steam Review of A Summer's End — Hong Kong 1986</title>
<pubDate>Mon, 30 Oct 2023 12:10:16 +0800</pubDate>
<link>https://leilukin.neocities.org/blog/2023-10-30-Support-for-My-Steam-Review-of-A-Summers-End</link>
<author>Leilukin</author>
<description><![CDATA[
<p>New blog post.</p>
<p>A thank you post for the people who have supported my Steam review of <cite>A Summer's End — Hong Kong 1986</cite>.</p>
]]></description>
</item>
<item>
<title>Changelog: 18 October 2923</title>
<pubDate>Wed, 18 Oct 2023 16:56:23 +0800</pubDate>
<description><![CDATA[
<ul>
<li><cite>Cassette Beasts</cite> <a href="https://leilukin.neocities.org/shrines/cassettebeasts/">shrine</a>: Added Developer Notes section to the <a href="https://leilukin.neocities.org/shrines/cassettebeasts/trivia.html">Trivia</a> page.</li>
</ul>
]]></description>
</item>
<item>
<title>My Cassette Beasts Pombomb Plushie Arrived!</title>
<pubDate>Fri, 13 Oct 2023 22:47:22 +0800</pubDate>
<link>https://leilukin.neocities.org/blog/posts/2023-10-13-My-Cassette-Beasts-Pombomb-Plushie-Arrived.html</link>
<author>Leilukin</author>
<description><![CDATA[
<p>New blog post.</p>
<p>The official Cassette Beasts Pombomb plushie I purchased finally arrived.</p>
]]></description>
</item>
<item>
<title>Changelog: 4 Ocrober 2023</title>
<pubDate>Wed, 4 Oct 2023 22:39:31 +0800</pubDate>
<description><![CDATA[
<ul>
<li><cite>Cassette Beasts</cite> <a href="https://leilukin.neocities.org/shrines/cassettebeasts/">shrine</a>: Updated the Development History section of the <a href="https://leilukin.neocities.org/shrines/cassettebeasts/trivia.html">Trivia</a> page with info about the release of Update 1.5 and "Pier of the Unknown" DLC.</li>
</ul>
]]></description>
</item>
</channel>
</rss>

View File

@ -1,121 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr" id="page-top">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:url" content="https://leilukin.neocities.org/home">
<meta property="og:type" content="website">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="Home | Leilukin's Hub">
<meta property="og:description" content="Home page of Leilukin's Hub">
<link rel="stylesheet" href="/css/style-main.css" type="text/css" media="all">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.1/css/all.css">
<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">
<script src="/js/main-components.js" defer></script>
<title>Home | Leilukin's Hub</title>
</head>
<body>
<header class="main-header">
<noscript>
JavaScript is disabled in your browser. To get the best user experience on
this website, it is recommended that you enable it.
</noscript>
</header>
<nav class="navbar"></nav>
<main>
<!-- <aside class="left-sidebar">
Left sidebar content here
</aside> -->
<div class="content-container">
<section class="content-section">
<h1>Welcome!</h1>
<p>Hello! You can call me Leilukin. Welcome to my website! This site is my own personal hub and corner on the internet.</p>
<p>Feel free to drop a message and say hi on <a href="https://leilukin.123guestbook.com/" target="_blank">my guestbook</a>!</p>
<p>You may use the <a href="sitemap.html">site map</a> to quickly navigate this website.</p>
<p>Enjoy your stay!</p>
</section>
<section class="content-section">
<h2>Link to My Website</h2>
<p>You can link to my website with this button:</p>
<div class="site-btn__container">
<div>
<a href="https://leilukin.neocities.org/" target="_blank"><img src="/assets/Leilukins-Hub-button.png" alt="Button of Leilukin's Hub" title="Leilukin's Hub"></a>
</div>
<textarea class="site-btn__textarea textarea-for-copy"><a href="https://leilukin.neocities.org/" target="_blank"><img src="https://leilukin.neocities.org/assets/Leilukins-Hub-button.png" alt="Button of Leilukin's Hub" title="Leilukin's Hub"></a></textarea>
<button class="copy-txt-btn">Copy HTML</button>
<script>
document.querySelector(".copy-txt-btn").onclick = () => {
document.querySelector(".textarea-for-copy").select();
document.execCommand('copy');
}
</script>
</div>
<p>Credit to <a href="https://github.com/hekate2" target="_blank">hekate2</a> for their <a href="https://hekate2.github.io/buttonmaker/" target="_blank">88x31 Web Button Maker</a>!</p>
</section>
<section class="content-section">
<h2>Updates</h2>
<div class="text-box">
<p class="date-style">5 April 2024:</p>
<ul>
<li>Add table of contents to my <a href="/mycreations/kotor1mods/"><cite>Star Wars: Knights of the Old Republic</cite></a> and <a href="/mycreations/kotor2mods/"><cite>Star Wars: Knights of the Old Republic II: The Sith Lords</cite> mods</a>.</li>
</ul>
<p><a href="/changelog">View all site changelog</a></p>
</div>
<p>You can subscribe to the <a href="feed.xml" target="blank">Leilukin's Hub RSS feed</a> or follow <a href="https://neocities.org/site/leilukin" target="_blank">my Neocities profile</a> to get notified of the updates on this website.</p>
<div class="web-btn-wrapper">
<a href="/feed.xml" target="blank" title="Leilukin's Hub RSS Feed">
<img src="/assets/rss-button.gif" alt="RSS feed button">
</a>
</div>
</section>
<section class="content-section">
<h2>Always Proud</h2>
<div class="web-btn-wrapper">
<img src="./buttons/progress.png" alt="A website button of the 2018 Progress Flag" title="2018 Progress Flag by Daniel Quasar (2018)">
<img src="./buttons/9_stripe.png" alt="A website button of the 9 stripe rainbow flag" title="Nine-Stripe Rainbow Flag by Gilbert Baker (2017)">
<img src="./buttons/lesbian.png" alt="A website button of the lesbian pride flag" title="I am a lesbian">
<img src="./buttons/nonbinary.png" alt="A website button of the non-binary pride flag" title="I am non-binary">
<img src="./buttons/demigirl.png" alt="A website button of the demigirl pride flag" title="I am a demiwoman">
<img src="./buttons/agender.png" alt="A website button of the agender pride flag" title="I am agender">
<img src="./buttons/bigender.png" alt="A website button of the bigender pride flag" title="I am bigender">
</div>
<p>Credit to <a href="https://rainy.gay/pride/pridebuttons" target="_blank">Dime</a> for these pride buttons!</p>
</section>
<section class="content-section">
<h2>Webrings</h2>
<div style="border: none; padding: 5px; display: inline-flex"><a href="https://isaacfish.neocities.org/webring/25.html" target="_blank"><img src="./links/webrings/queercoded-left.png" alt="left arrow"></a>&nbsp;<a href="https://isaacfish.neocities.org/webring/" target="_blank"><img src="./links/webrings/queercoded.png" alt="queer coded webring" title="The Queer Coded Webring"></a>&nbsp;<a href="https://isaacfish.neocities.org/webring/27.html" target="_blank"><img src="./links/webrings/queercoded-right.png" alt="right arrow"></a></div>
</section>
<section class="content-section">
<h2>Support Me</h2>
<p>If you enjoy my work, you can support me on Ko-Fi or Buy Me a Coffee:
<script type='text/javascript' src='https://storage.ko-fi.com/cdn/widget/Widget_2.js'></script><script type='text/javascript'>kofiwidget2.init('Support Me on Ko-fi', '#7A37A3', 'A1042UH4');kofiwidget2.draw();</script><br><br>
<script type="text/javascript" src="https://cdnjs.buymeacoffee.com/1.0.0/button.prod.min.js" data-name="bmc-button" data-slug="leilukin" data-color="#7a37a3" data-emoji="" data-font="Cookie" data-text="Buy me a coffee" data-outline-color="#ffffff" data-font-color="#ffffff" data-coffee-color="#FFDD00" ></script>
</p>
</section>
</div>
<!-- <aside class="right-sidebar">
Right sidebar content here
</aside> -->
</main>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -1,41 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta property="og:url" content="https://leilukin.neocities.org/">
<meta property="og:type" content="website">
<meta property="og:title" content="Leilukin's Hub">
<meta property="og:description" content="Welcome to Leilukin's personal website">
<link rel="stylesheet" href="/css/style-index.css" type="text/css" media="all">
<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">
<title>Leilukin's Hub</title>
</head>
<body>
<main>
<img src="/assets/Leilukins-Hub-website-banner.png" alt="Leilukin's Hub website banner">
<h1>Leilukin's Hub</h1>
<p>Hello! Welcome to my website!</p>
<section class="index__btn-wrapper">
<a href="/home.html" class="index__link">Home Page</a>
<a href="/sitemap.html" class="index__link">Site Map</a>
</section>
<footer>
<a href="/feed.xml" target="blank" title="Leilukin's Hub RSS Feed">
<img src="/assets/rss-button.gif" alt="RSS feed button">
</a>
</footer>
</main>
</body>
</html>

View File

@ -1,242 +0,0 @@
/* ------ MAIN HEADER COMPONENT ------ */
const header = document.querySelector(".main-header");
header.innerHTML = loadHeader();
function loadHeader() {
const headerTopBar = `<div class="main-header__top-bar"></div>`;
const headerImg = `
<div class="main-header__img">
<img src="/assets/Leilukins-Hub-website-banner.png" alt="">
</div>
`;
const todayEvent = getTodayEvent();
if (todayEvent == "No event") {
return headerImg;
} else {
return headerTopBar + headerImg;
};
}
const todayEvent = getTodayEvent();
const headerTopBarEl = document.querySelector(".main-header__top-bar");
const headerImgEl = document.querySelector(".main-header__img");
if (todayEvent != "No event") {
if (todayEvent == "Leilukin's Birthday" || todayEvent == "Leilukin's Hub Anniversary") {
headerTopBarEl.innerHTML = getBlurbHtml(todayEvent);
} else {
headerImgEl.classList.add(getBanner(todayEvent));
headerTopBarEl.innerHTML = getBlurbHtml(todayEvent);
}
};
function getTodayEvent() {
const date = new Date();
const month = date.getMonth() + 1;
const day = date.getDate();
if (month == 3 && day == 1)
return "Zero Discrimination Day";
else if (month == 3 && day == 31)
return "Trans Day of Visibility";
else if (month == 4 && day == 6)
return "International Asexuality Day";
else if (month == 4 && day == 26)
return "Lesbian Visibility Day";
else if (month == 5 && day == 17)
return "IDAHOBIT";
else if (month == 5 && day == 19)
return "Agender Pride Day";
else if (month == 5 && day == 25)
return "Pansexual and Panromantic Awareness & Visibility Day";
else if (month == 6)
return "Pride Month";
else if (month == 7 && day == 14)
return "Non-Binary People's Day";
else if (month == 7 && day == 28)
return "Leilukin's Birthday";
else if (month == 9 && day == 11)
return "Leilukin's Hub Anniversary";
else if (month == 9 && day == 23)
return "Bi Visibility Day";
else if (month == 10 && day == 8)
return "International Lesbian Day";
else if (month == 10 && day == 11)
return "National Coming Out Day";
else if (month == 10 && day == 26)
return "Intersex Awareness Day";
else
return "No event";
}
function getBanner(day) {
switch (day) {
case "Zero Discrimination Day":
return "flag-progress-intersex";
break;
case "Trans Day of Visibility":
return "flag-trans";
break;
case "International Asexuality Day":
return "flag-ace";
break;
case "Lesbian Visibility Day":
return "flag-lesbian";
break;
case "IDAHOBIT":
return "flag-progress";
break;
case "Agender Pride Day":
return "flag-agender";
break;
case "Pansexual and Panromantic Awareness & Visibility Day":
return "flag-pan";
break;
case "Pride Month":
return "flag-progress-intersex";
break;
case "Non-Binary People's Day":
return "flag-non-binary";
break;
case "Bi Visibility Day":
return "flag-bi";
break;
case "International Lesbian Day":
return "flag-lesbian";
break;
case "National Coming Out Day":
return "flag-rainbow";
break;
case "Intersex Awareness Day":
return "flag-intersex";
break;
default:
return "";
}
}
function getBlurbHtml(day) {
switch (day) {
case "Zero Discrimination Day":
return `
Today is <a href="https://www.unaids.org/en/zero-discrimination-day" target="_blank">Zero Discrimination Day</a>
`;
break;
case "Trans Day of Visibility":
return `
Today is <a href="https://www.manygendersonevoice.org/tdov.html" target="_blank">Trans Day of Visibility</a>
`;
break;
case "International Asexuality Day":
return `
Today is <a href="https://internationalasexualityday.org/en" target="_blank">International Asexuality Day</a>
`;
break;
case "Lesbian Visibility Day":
return `
Today is <a href="https://www.lesbianvisibilityweek.com" target="_blank">Lesbian Visibility Day</a>
`;
break;
case "IDAHOBIT":
return `
Today is <a href="https://may17.org" target="_blank">International Day Against Homophobia, Biphobia and Transphobia</a></span>
`;
break;
case "Agender Pride Day":
return `
Today is <a href="https://www.believeoutloud.com/voices/article/agender-pride-day/" target="_blank">Agender Pride Day</a></span>
`;
break;
case "Pansexual and Panromantic Awareness & Visibility Day":
return `
Today is <a href="https://genderedintelligence.co.uk/panvisibilityday" target="_blank">Pansexual and Panromantic Visibility Day</a>
`;
break;
case "Pride Month":
return `
Happy <a href="https://www.loc.gov/lgbt-pride-month/about/" target="_blank">Pride Month</a>!
`;
break;
case "Non-Binary People's Day":
return `
Today is <a href="https://www.manygendersonevoice.org/non-binary-peoples-day.html" target="_blank">Non-Binary People's Day</a>
`;
break;
case "Leilukin's Birthday":
return `
Today is Leilukin's birthday
`;
break;
case "Leilukin's Hub Anniversary":
return `
Today is the anniversary of the launch of Leilukin's Hub
`;
break;
case "Bi Visibility Day":
return `
Today is <a href="https://bivisibilityday.com/about" target="_blank">Bi Visibility Day</a>
`;
break;
case "International Lesbian Day":
return `
Today is <a href="https://www.lgbtiqhealth.org.au/international_lesbian_day2" target="_blank">International Lesbian Day</a>
`;
break;
case "National Coming Out Day":
return `
Today is <a href="https://www.hrc.org/resources/national-coming-out-day" target="_blank">National Coming Out Day</a>
`;
break;
case "Intersex Awareness Day":
return `
Today is <a href="https://interactadvocates.org/intersex-awareness-day" target="_blank">Intersex Awareness Day</a>
`;
break;
default:
return ``;
}
}
/* ------ MAIN NAVIGATION BAR COMPONENT ------ */
document.querySelector(".navbar").innerHTML = `
<ul class="nav__menu">
<li><a href="/home.html">Home</a></li>
<li><a href="/about/">About</a></li>
<li><a href="/blog/">Blog</a></li>
<li><a href="/articles/">Articles</a></li>
<li><a href="/mycreations/">My Creations</a></li>
<li><a href="/featured/">Featured</a></li>
<li><a href="/resources/">Resources</a></li>
<li><a href="/shrines/">Shrines</a></li>
<li><a href="/links/">Links</a></li>
<li><a href="https://leilukin.123guestbook.com/">Guestbook</a></li>
</ul>
`;
// Make the navigation bar sticky
const navbar = document.querySelector(".navbar");
window.addEventListener("scroll", e => {
const scrollPos = window.scrollY || document.documentElement.scrollTop;
const stickyLine = header.scrollHeight - navbar.scrollHeight;
if (scrollPos > stickyLine) {
navbar.classList.add("sticky-nav");
} else {
navbar.classList.remove("sticky-nav");
}
});
/* ------ MAIN FOOTER COMPONENT ------ */
document.querySelector(".main-footer").innerHTML = `
<p>Made with by Leilukin | <a href="/sitemap.html">Site Map</a></p>
<p>Site Launched: 11 September 2022 | <a href="/changelog">Website Changelog</a></p>
<p>
<a href="#page-top">
<i class="fa fa-arrow-up"></i> Back to top <i class="fa fa-arrow-up"></i>
</a>
</p>
`;

View File

@ -1,47 +0,0 @@
filterSelection("all")
function filterSelection(c) {
let x, i;
x = document.getElementsByClassName("filter-div");
if (c == "all") c = "";
// Add the "show-items" class (display:block) to the filtered elements, and remove the "show-items" class from the elements that are not selected
for (i = 0; i < x.length; i++) {
w3RemoveClass(x[i], "show-items");
if (x[i].className.indexOf(c) > -1) w3AddClass(x[i], "show-items");
}
}
// show-items filtered elements
function w3AddClass(element, name) {
let i, arr1, arr2;
arr1 = element.className.split(" ");
arr2 = name.split(" ");
for (i = 0; i < arr2.length; i++) {
if (arr1.indexOf(arr2[i]) == -1) {
element.className += " " + arr2[i];
}
}
}
// Hide elements that are not selected
function w3RemoveClass(element, name) {
let i, arr1, arr2;
arr1 = element.className.split(" ");
arr2 = name.split(" ");
for (i = 0; i < arr2.length; i++) {
while (arr1.indexOf(arr2[i]) > -1) {
arr1.splice(arr1.indexOf(arr2[i]), 1);
}
}
element.className = arr1.join(" ");
}
// Add active class to the current control button (highlight it)
let btnContainer = document.getElementById("myBtnContainer");
let btns = btnContainer.getElementsByClassName("filter-btn");
for (let i = 0; i < btns.length; i++) {
btns[i].addEventListener("click", function() {
let current = document.getElementsByClassName("active");
current[0].className = current[0].className.replace(" active", "");
this.className += " active";
});
}

View File

@ -1,76 +0,0 @@
// Auto generate table of contents
// Code based on https://techindetail.com/table-of-contents-javascript/
window.addEventListener('DOMContentLoaded', (event) => {
const article = document.querySelector("article");
const headings = article.querySelectorAll("h2, h3");
const toc = document.querySelector(".toc");
const tocSidebar = document.querySelector(".sidebar__toc");
const leftSidebar = document.querySelector('.left-sidebar');
const totalHeadings = headings.length;
let tocOl = document.createElement("ol");
let tocFragment = new DocumentFragment();
let mainLi = null;
let subUl = null;
let subLi = null;
let isSibling = false;
if (totalHeadings > 1) {
for (let element of headings) {
let anchor = document.createElement("a");
let anchorText = element.innerText;
anchor.innerText = anchorText;
let elementId = anchorText.replaceAll(" ", "-").toLowerCase();
anchor.href = "#" + elementId;
element.id = elementId;
let level = element.nodeName;
if ("H3" === level) {
if (mainLi) {
subLi = document.createElement("li");
subLi.appendChild(anchor);
if (isSibling === false) {
subUl = document.createElement("ul");
}
subUl.appendChild(subLi);
mainLi.appendChild(subUl);
isSibling = true;
}
} else {
mainLi = document.createElement("li");
mainLi.appendChild(anchor);
tocFragment.appendChild(mainLi);
isSibling = false;
subUl = null;
}
}
tocOl.append(tocFragment);
toc.append(tocOl);
const tocClone = tocOl.cloneNode(true);
if (tocSidebar) {
tocSidebar.appendChild(tocClone);
}
} else {
toc.classList.add('hidden');
leftSidebar.classList.add('hidden');
}
// Close article ToC accordion and the left sidebar for small screen sizes
if (window.innerWidth < 480) {
toc.removeAttribute("open");
leftSidebar.classList.add("hidden");
} else {
toc.setAttribute("open", true);
}
// Remove the stickiness of the sidebar ToC if it is larger than screen height
function preventSidebarOverflow() {
if (document.documentElement.clientHeight < tocSidebar.offsetHeight + 50) {
tocSidebar.style.marginTop = "0";
tocSidebar.style.position = "static";
}
}
preventSidebarOverflow();
});

Binary file not shown.

Before

Width:  |  Height:  |  Size: 6.7 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 10 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 18 KiB

View File

@ -1,92 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr" id="page-top">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:url" content="https://leilukin.neocities.org/links">
<meta property="og:type" content="website">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="Links">
<meta property="og:description" content="A collection of links.">
<link rel="stylesheet" href="/css/style-main.css" type="text/css" media="all">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.1/css/all.css">
<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">
<script src="/js/main-components.js" defer></script>
<title>Links | Leilukin's Hub</title>
</head>
<body>
<header class="main-header">
<noscript>
JavaScript is disabled in your browser. To get the best user experience on
this website, it is recommended that you enable it.
</noscript>
</header>
<nav class="navbar"></nav>
<main>
<!-- <aside class="left-sidebar">
Left sidebar content here
</aside> -->
<div class="content-container">
<section class="content-section">
<h1>Links</h1>
<p>Networks between webmasters or people who share similar interests.</p>
</section>
<section class="content-section">
<h2>Link to My Website</h2>
<p>You can link to my website with this button:</p>
<div class="site-btn__container">
<div>
<a href="https://leilukin.neocities.org/" target="_blank"><img src="/assets/Leilukins-Hub-button.png" alt="Button of Leilukin's Hub" title="Leilukin's Hub"></a>
</div>
<textarea class="site-btn__textarea textarea-for-copy"><a href="https://leilukin.neocities.org/" target="_blank"><img src="https://leilukin.neocities.org/assets/Leilukins-Hub-button.png" alt="Button of Leilukin's Hub" title="Leilukin's Hub"></a></textarea>
<button class="copy-txt-btn">Copy HTML</button>
<script>
document.querySelector(".copy-txt-btn").onclick = () => {
document.querySelector(".textarea-for-copy").select();
document.execCommand('copy');
}
</script>
</div>
<p>Credit to <a href="https://github.com/hekate2" target="_blank">hekate2</a> for their <a href="https://hekate2.github.io/buttonmaker/" target="_blank">88x31 Web Button Maker</a>!</p>
</section>
<section class="content-section">
<h2>Webrings I Have Joined</h2>
<div style="border: none; padding: 5px; display: inline-flex"><a href="https://isaacfish.neocities.org/webring/25.html" target="_blank"><img src="./webrings/queercoded-left.png" alt="left arrow"></a>&nbsp;<a href="https://isaacfish.neocities.org/webring/" target="_blank"><img src="./webrings/queercoded.png" alt="queer coded webring" title="The Queer Coded Webring"></a>&nbsp;<a href="https://isaacfish.neocities.org/webring/27.html" target="_blank"><img src="./webrings/queercoded-right.png" alt="right arrow"></a></div>
</section>
<section class="content-section">
<h2>Fanlistings I Have Joined</h2>
<div class="web-btn-wrapper">
<a href="https://glitterskies.org/kotor/" target="_blank"><img src="./fanlistings/kotor-100x50.png" alt="A website button of a Star Wars: Knights of the Old Republic fanlisting" title="Erased Identity - Star Wars: Knights of the Old Republic fanlisting"></a>
<a href="https://glitterskies.org/kotor2/" target="_blank"><img src="./fanlistings/kotor2-100x50.jpg" alt="A website button of a Star Wars: Knights of the Old Republic 2 fanlisting" title="Mysteries of Malachor - Star Wars: Knights of the Old Republic 2: The Sith Lords fanlisting"></a>
<a href="https://inspirationally.net/jedi/" target="_blank"><img src="./fanlistings/jedi-100x50.png" alt="A website button of a Jedi fanlisting" title="Keepers of the Peace // the Star Wars: [+] Jedi fanlisting"></a>
</div>
</section>
</div>
<!-- <aside class="right-sidebar">
Right sidebar content here
</aside> -->
</main>
<footer class="main-footer"></footer>
</body>
</html>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 360 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 360 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 754 B

View File

@ -1,86 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr" id="page-top">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:url" content="https://leilukin.neocities.org/mycreations">
<meta property="og:type" content="website">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="My Creations | Leilukin's Hub">
<meta property="og:description" content="Links to my works not are not featured on this website.">
<link rel="stylesheet" href="/css/style-main.css" type="text/css" media="all">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.1/css/all.css">
<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">
<script src="/js/main-components.js" defer></script>
<title>My Creations | Leilukin's Hub</title>
</head>
<body>
<header class="main-header">
<noscript>
JavaScript is disabled in your browser. To get the best user experience on
this website, it is recommended that you enable it.
</noscript>
</header>
<nav class="navbar"></nav>
<main>
<!-- <aside class="left-sidebar">
Left sidebar content here
</aside> -->
<div class="content-container">
<section class="content-section">
<h1>My Creations</h1>
<p>Here is a list of things I have created.</p>
</section>
<section class="content-section">
<h2>My Drawings</h2>
<p>My drawings can be found on my art blog on Tumblr:</p>
<a class="link-btn" href="https://leilukinart.tumblr.com/" target="_blank">🎨 Leilukin's Art Blog</a>
</section>
<section class="content-section">
<h2>My Video Game Mods</h2>
<a href="./kotor1mods">
<img src="./my-kotor1-mods-header.png" alt="Banner of Leilukin's mods for Star Wars: Knights of the Old Republic">
</a>
<p class="center-text"><a href="./kotor1mods" class="index-link">Star Wars: Knights of the Old Republic</a></p>
<a href="./kotor2mods">
<img src="./my-kotor2-mods-header.png" alt="Banner of Leilukin's mods for Star Wars: Knights of the Old Republic II: The Sith Lords">
</a>
<p class="center-text"><a href="./kotor2mods" class="index-link">Star Wars: Knights of the Old Republic II: The Sith Lords</a></p>
</section>
<section class="content-section">
<h2>My Playlists</h2>
<p>You can check out the playlists I have made on <a href="./playlists/">my dedicated page</a>.</p>
</section>
<section class="content-section">
<h2>My Characters</h2>
<p>I have created my own characters for various pieces of media. <a href="https://www.notion.so/leilukin/Leilukin-s-Characters-b377e277f01b4474945e85cf4cb15ada?pvs=4" target="blank">You can check out my characters here</a>.</p>
</section>
</div>
<!-- <aside class="right-sidebar">
Right sidebar content here
</aside> -->
</main>
<footer class="main-footer"></footer>
</body>
</html>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 224 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 254 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 148 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 153 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 209 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 213 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 186 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 273 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 292 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 257 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 273 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 316 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 280 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 275 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 223 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 257 KiB

View File

@ -1,214 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr" id="page-top">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:url" content="https://leilukin.neocities.org/mymods/kotor1mods">
<meta property="og:type" content="website">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="My Mods for Star Wars: Knights of the Old Republic">
<meta property="og:description" content="List of video game mods I have made for Star Wars: Knights of the Old Republic.">
<link rel="stylesheet" href="/css/style-main.css" type="text/css" media="all">
<link rel="stylesheet" href="/css/style-toc.css">
<link rel="stylesheet" href="/css/style-mymods.css" type="text/css" media="all">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.1/css/all.css">
<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">
<script src="/js/main-components.js" defer></script>
<script src="/js/toc.js" defer></script>
<script src="/js/mod-filter.js" defer></script>
<title>My KotOR 1 Mods | Leilukin's Hub</title>
</head>
<body>
<header class="main-header">
<noscript>
JavaScript is disabled in your browser. To get the best user experience on
this website, it is recommended that you enable it.
</noscript>
</header>
<nav class="navbar"></nav>
<main>
<!-- <aside class="left-sidebar">
Left sidebar content here
</aside> -->
<article class="divided-article">
<section class="content-section">
<h1>My Mods for <cite>Star Wars: Knights of the Old Republic</cite></h1>
<details class="toc" role=”doc-toc” style="margin-bottom: 1em;">
<summary class="toc-heading">
Table Of Contents
</summary>
</details>
<p>Filter by Categories:</p>
<div id="myBtnContainer">
<button class="filter-btn active" onclick="filterSelection('all')">All</button>
<button class="filter-btn" onclick="filterSelection('pc-party-members')">Player & Party Members</button>
<button class="filter-btn" onclick="filterSelection('npcs')">NPCs</button>
<button class="filter-btn" onclick="filterSelection('gameplay')">Gameplay</button>
<button class="filter-btn" onclick="filterSelection('music')">Music</button>
</div>
</section>
<section class="content-section filter-div pc-party-members">
<h2>Player & Party Members</h2>
<div class="mod-entry">
<h3>Juhani Dialogue Restoration</h3>
<img src="./img/Juhani-Dialogue-Restoration.png" alt="Banner of Juhani Dialogue Restoration mod">
<p>Restores Juhani's conversations with the player that are unused or easy to miss in vanilla KotOR.</p>
<a class="link-btn" href="https://deadlystream.com/files/file/2173-juhani-dialogue-restoration/" target="_blank">Deadly Stream</a>
<a class="link-btn" href="https://www.nexusmods.com/kotor/mods/1501" target="_blank">Nexus Mods</a>
</div>
<div class="mod-entry">
<h3>Carth Onasi and Male PC Romance</h3>
<img src="./img/Carth-Onasi-and-Male-PC-Romance.png" alt="Banner of Carth Onasi and Male PC Romance mod">
<p>Makes Carth Onasi's romance subplot available for male player characters. Please read the <a href="/shrines/starwarskotor/articles/faq-same-gender-romance-mods.html" target="_blank">FAQ article</a> before asking questions about my same-gender romance mods for the <cite>KotOR</cite> series!</p>
<a class="link-btn" href="https://deadlystream.com/files/file/2140-carth-onasi-and-male-pc-romance/" target="_blank">Deadly Stream</a>
<a class="link-btn" href="https://www.nexusmods.com/kotor/mods/1493" target="_blank">Nexus Mods</a>
</div>
<div class="mod-entry">
<h3>Bastila and Carth Romance Removal</h3>
<img src="./img/Bastila-and-Carth-Romance-Removal.png" alt="Banner of Bastila and Carth Romance Removal mod">
<p>Removes Bastila and Carth's romance by removing all romance-related dialogue from their conversations.</p>
<a class="link-btn" href="https://deadlystream.com/files/file/2209-bastila-and-carth-romance-removal/" target="_blank">Deadly Stream</a>
<a class="link-btn" href="https://www.nexusmods.com/kotor/mods/1519" target="_blank">Nexus Mods</a>
</div>
<div class="mod-entry">
<h3>Leilukin's Juhani's Outfit Reskin Pack</h3>
<img src="./img/Leilukins-Juhanis-Outfit-Reskin-Pack.png" alt="Banner of Leilukin's Juhani's Outfit Reskin Pack mod">
<p>Reskins Juhani's outfit by changing the outfit's color scheme, with multiple versions of reskin provided.</p>
<a class="link-btn" href="https://deadlystream.com/files/file/2275-leilukins-juhanis-outfit-reskin-pack/" target="_blank">Deadly Stream</a>
<a class="link-btn" href="https://www.nexusmods.com/kotor/mods/1543" target="_blank">Nexus Mods</a>
</div>
<div class="mod-entry">
<h3>Jolee in Unique Outfit Introduction</h3>
<img src="./img/Jolee-in-Unique-Outfit-Introduction.png" alt="Banner of Jolee in Unique Outfit Introduction mod">
<p>Makes Jolee Bindo wear his signature robe when you meet him on Kashyyyk, before he joins your party.</p>
<a class="link-btn" href="https://deadlystream.com/files/file/1298-jolee-in-unique-outfit-introduction/" target="_blank">Deadly Stream</a>
<a class="link-btn" href="https://www.nexusmods.com/kotor/mods/1221" target="_blank">Nexus Mods</a>
</div>
<div class="mod-entry">
<h3>KotOR 1 Improved Party Outfits</h3>
<img src="./img/KotOR-1-Improved-Party-Outfits.png" alt="Banner of KotOR 1 Improved Party Outfits mod">
<p>Adds new items to improve the properties of the default outfits of the human and humanoid party members of TSL, namely Bastila, Canderous, Carth, Jolee, Juhani and Mission.</p>
<a class="link-btn" href="https://deadlystream.com/files/file/2134-kotor-1-improved-party-outfits/" target="_blank">Deadly Stream</a>
<a class="link-btn" href="https://www.nexusmods.com/kotor/mods/1491" target="_blank">Nexus Mods</a>
</div>
<div class="mod-entry">
<h3>Darth Revan Texture for Star Forge Robes</h3>
<img src="./img/Darth-Revan-Texture-for-Star-Forge-Robes.png" alt="Banner of Darth Revan Texture for Star Forge Robes mod">
<p>Makes the Star Forge Robes to have the same texture and inventory icon as Darth Revan's Robes.</p>
<a class="link-btn" href="https://deadlystream.com/files/file/1076-darth-revan-texture-for-star-forge-robes/" target="_blank">Deadly Stream</a>
<a class="link-btn" href="https://www.nexusmods.com/kotor/mods/1143" target="_blank">Nexus Mods</a>
</div>
</section>
<section class="content-section filter-div npcs">
<h2>Non-Playable Characters</h2>
<div class="mod-entry">
<h3>KotOR 1 Twi'lek Male NPC Diversity</h3>
<img src="./img/K1-Twilek-Male-NPC-Diversity.png" alt="Banner of KotOR 1 Twi'lek Male NPC Diversity mod">
<p>Diversifies the appearances of Twi'lek male NPCs in KotOR 1 by giving the named Twi'lek male NPCs different looks instead of the generic NPC looks. </p>
<a class="link-btn" href="https://deadlystream.com/files/file/2228-kotor-1-twilek-male-npc-diversity/" target="_blank">Deadly Stream</a>
<a class="link-btn" href="https://www.nexusmods.com/kotor/mods/1530" target="_blank">Nexus Mods</a>
</div>
<div class="mod-entry">
<h3>KotOR 1 Twi'lek Female NPC Diversity</h3>
<img src="./img/K1-Twilek-Female-NPC-Diversity.png" alt="Banner of KotOR 1 Twi'lek Female NPC Diversity mod">
<p>Diversifies the appearances of Twi'lek female NPCs by giving the named Twi'lek female NPCs different looks instead of the generic NPC looks. </p>
<a class="link-btn" href="https://deadlystream.com/files/file/2179-kotor-1-twilek-female-npc-diversity/" target="_blank">Deadly Stream</a>
<a class="link-btn" href="https://www.nexusmods.com/kotor/mods/1504" target="_blank">Nexus Mods</a>
</div>
<div class="mod-entry">
<h3>Belaya's Unique Look</h3>
<img src="./img/Belaya-Unique-Look.png" alt="Banner of Belaya's Unique Look mod">
<p>Gives the NPC Belaya a unique look instead of a generic NPC look.</p>
<a class="link-btn" href="https://deadlystream.com/files/file/2146-belayas-unique-look/" target="_blank">Deadly Stream</a>
<a class="link-btn" href="https://www.nexusmods.com/kotor/mods/1494" target="_blank">Nexus Mods</a>
</div>
<div class="mod-entry">
<h3>Human Xor Restoration</h3>
<img src="./img/Human-Xor-Restoration.png" alt="Banner of Human Xor Restoration mod">
<p>Restores the original appearance of the NPC Xor in the Xbox version of KotOR, by changing his species from a Twi'lek to a human.</p>
<a class="link-btn" href="https://deadlystream.com/files/file/1091-human-xor-restoration/" target="_blank">Deadly Stream</a>
<a class="link-btn" href="https://www.nexusmods.com/kotor/mods/1155" target="_blank">Nexus Mods</a>
</div>
<div class="mod-entry">
<h3>Human Xor Unique Look</h3>
<img src="./img/Human-Xor-Unique-Look.png" alt="Banner of Human Xor Unique Look mod">
<p>Changes the NPC Xor's appearance by making him a human with a unique look to make him different from other human NPCs.</p>
<a class="link-btn" href="https://deadlystream.com/files/file/2147-human-xor-unique-look/" target="_blank">Deadly Stream</a>
<a class="link-btn" href="https://www.nexusmods.com/kotor/mods/1495" target="_blank">Nexus Mods</a>
</div>
<div class="mod-entry">
<h3>KotOR 1 No Gendered Dialogue from Male NPCs</h3>
<img src="./img/K1-No-Gendered-Dialogue-Male-NPCs.png" alt="Banner of KotOR 1 No Gendered Dialogue from Male NPCs mod">
<p>Removes male NPC dialogues that involve them flirting with female player characters or remarking on the female PC's gender or appearance.</p>
<a class="link-btn" href="https://deadlystream.com/files/file/2176-kotor-1-no-gendered-dialogue-from-male-npcs/" target="_blank">Deadly Stream</a>
<a class="link-btn" href="https://www.nexusmods.com/kotor/mods/1502" target="_blank">Nexus Mods</a>
</div>
<div class="mod-entry">
<h3>PC Dialogue with Davik's Slaves Change</h3>
<img src="./img/PC-Dialogue-with-Daviks-Slaves-Change.png" alt="Banner of No Flirting with Davik's Slaves mod">
<p>Removes the option for the player character to flirt with Davik Kang's slaves, or give the player Dark Side options for requesting a massage from the slaves. Threatening the slaves also gives the player Dark Side points.</p>
<a class="link-btn" href="https://deadlystream.com/files/file/2214-pc-dialogue-with-daviks-slaves-change/" target="_blank">Deadly Stream</a>
<a class="link-btn" href="https://www.nexusmods.com/kotor/mods/1523" target="_blank">Nexus Mods</a>
</div>
</section>
<section class="content-section filter-div gameplay">
<h2>Gameplay</h2>
<div class="mod-entry">
<h3>Trask Ulgo Without Tutorials</h3>
<img src="./img/Trask-Ulgo-Without-Tutorials.png" alt="Banner of Trask Ulgo Without Tutorials mod">
<p>Removes the tutorial elements from the game, while keeps Trask Ulgo as a party member in the first area of the Endar Spire.</p>
<a class="link-btn" href="https://deadlystream.com/files/file/2184-trask-ulgo-without-tutorials/" target="_blank" >Deadly Stream</a>
<a class="link-btn" href="https://www.nexusmods.com/kotor/mods/1508" target="_blank">Nexus Mods</a>
</div>
</section>
<section class="content-section filter-div music">
<h2>Music</h2>
<div class="mod-entry">
<h3>Mysterious Box Music for Unknown World</h3>
<img src="./img/Mysterious-Box-Music-for-Unknown-World.png" alt="Banner of Mysterious Box Music for Unknown World mod">
<p>This mod will make the Mysterious Box's ambient music played in some areas of the Unknown World.</p>
<a class="link-btn" href="https://deadlystream.com/files/file/1322-mysterious-box-music-for-unknown-world/" target="_blank" >Deadly Stream</a>
<a class="link-btn" href="https://www.nexusmods.com/kotor/mods/1226" target="_blank">Nexus Mods</a>
</div>
</section>
</article>
<!-- <aside class="right-sidebar">
Right sidebar content here
</aside> -->
</main>
<footer class="main-footer"></footer>
</body>
</html>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 226 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 269 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 222 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 226 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 253 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 250 KiB

Some files were not shown because too many files have changed in this diff Show More