Streamlined JavaScript code for website components

This commit is contained in:
Helen Chong 2023-08-13 19:57:38 +08:00
parent 6423bcb7e8
commit cd009c53cb
63 changed files with 661 additions and 487 deletions

View File

@ -19,14 +19,18 @@
<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/header.js" defer></script>
<script src="/js/footer.js" defer></script>
<script src="/js/main-components.js" defer></script>
<title>About | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -103,6 +107,6 @@
Right sidebar content here
</aside> -->
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -19,14 +19,18 @@
<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/header.js" defer></script>
<script src="/js/footer.js" defer></script>
<script src="/js/main-components.js" defer></script>
<title>Articles | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -48,6 +52,6 @@
Right sidebar content here
</aside> -->
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -19,14 +19,18 @@
<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/header.js" defer></script>
<script src="/js/footer.js" defer></script>
<script src="/js/main-components.js" defer></script>
<title>Website Changelog Archive: 2022 | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -192,6 +196,6 @@
Right sidebar content here
</aside> -->
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -19,14 +19,18 @@
<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/header.js" defer></script>
<script src="/js/footer.js" defer></script>
<script src="/js/main-components.js" defer></script>
<title>Website Changelog | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -39,6 +43,11 @@
Archive: <span class="date-style">Latest</span> | <a href="./2022.html">2022</a> | <a href="./layouts.html">Website Layouts</a>
</p>
<p class="date-style">August 13, 2023:</p>
<ul>
<li>Streamlined JavaScript code for the website's components.</li>
</ul>
<p class="date-style">August 10, 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>
@ -256,6 +265,6 @@
Right sidebar content here
</aside> -->
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -19,14 +19,18 @@
<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/header.js" defer></script>
<script src="/js/footer.js" defer></script>
<script src="/js/main-components.js" defer></script>
<title>Website Layout Archive | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -54,6 +58,6 @@
Right sidebar content here
</aside> -->
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -19,14 +19,18 @@
<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/header.js" defer></script>
<script src="/js/footer.js" defer></script>
<script src="/js/main-components.js" defer></script>
<title>June 2023 Layout Rewrite | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -61,6 +65,6 @@
Right sidebar content here
</aside> -->
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -19,14 +19,18 @@
<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/header.js" defer></script>
<script src="/js/footer.js" defer></script>
<script src="/js/main-components.js" defer></script>
<title>Website Layout Archive | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -67,6 +71,6 @@
Right sidebar content here
</aside> -->
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -21,11 +21,11 @@
--clr-link-btn-txt: white;
--clr-link-btn-hover: #241445;
--clr-header-bg: black;
--clr-nav-bg: #222;
--clr-nav-link: white;
--clr-main-header-bg: black;
--clr-navbar-bg: #222;
--clr-navbar-link: white;
--clr-footer-bg: #13092D;
--clr-main-footer-bg: #13092D;
}
@font-face {
@ -196,11 +196,11 @@ summary {
cursor: pointer;
}
/* ELEMENT STYLES WITH CUSTOM CLASSES */
.bold-text {
font-weight: 700;
}
/* ELEMENT STYLES WITH CUSTOM CLASSES */
.center-el {
margin: 0 auto;
}
@ -215,30 +215,31 @@ summary {
}
/* HEADER COMPONENT */
header {
.main-header {
width: 100%;
max-height: 20rem;
background-color: var(--clr-header-bg);
background-color: var(--clr-main-header-bg);
display: flex;
flex-direction: column;
justify-content: center;
text-align: center;
}
header img {
.main-header img {
object-fit: contain;
height: 100%;
}
/* NAVIGATION BAR COMPONENT */
nav {
background: var(--clr-nav-bg);
background: var(--clr-navbar-bg);
padding: 0 0.6rem;
width: 100%;
z-index: 999;
}
nav a {
color: var(--clr-nav-link);
color: var(--clr-navbar-link);
text-decoration: none;
cursor: pointer;
}
@ -509,13 +510,13 @@ article, .content-container {
}
/* FOOTER COMPONENT */
footer {
background-color: var(--clr-footer-bg);
.main-footer {
background-color: var(--clr-main-footer-bg);
width: 100%;
padding: 0.5rem;
text-align: center;
}
footer p {
.main-footer p {
padding: 0;
}

View File

@ -19,14 +19,18 @@
<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/header.js" defer></script>
<script src="/js/footer.js" defer></script>
<script src="/js/main-components.js" defer></script>
<title>Featured | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -48,6 +52,6 @@
Right sidebar content here
</aside> -->
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -19,14 +19,18 @@
<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/header.js" defer></script>
<script src="/js/footer.js" defer></script>
<script src="/js/main-components.js" defer></script>
<title>KotOR 2 Modders Interview on Ars Technica | Featured | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -59,6 +63,6 @@
Right sidebar content here
</aside> -->
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -20,14 +20,18 @@
<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/header.js" defer></script>
<script src="/js/footer.js" defer></script>
<script src="/js/main-components.js" defer></script>
<title>LGBTQ+ Booklet Artist Interview from MISI:Bawang | Featured | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -78,6 +82,6 @@
Right sidebar content here
</aside> -->
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -19,14 +19,18 @@
<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/header.js" defer></script>
<script src="/js/footer.js" defer></script>
<script src="/js/main-components.js" defer></script>
<title>Home | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -64,11 +68,9 @@
<section class="content-section">
<h2>Updates</h2>
<div class="text-box">
<p class="date-style">August 10, 2023:</p>
<p class="date-style">August 13, 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>Added <a href="/shrines/cassettebeasts/trivia.html">Trivia</a> page to the <a href="/shrines/cassettebeasts/"><cite>Cassette Beasts</cite> shrine</a>.</li>
<li>Streamlined JavaScript code for the website's components.</li>
</ul>
</div>
<a href="/changelog">View all site changelog</a>
@ -106,6 +108,6 @@
Right sidebar content here
</aside> -->
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -1,6 +0,0 @@
// Footer component content
document.querySelector("footer").innerHTML = `
<p>Made with by Leilukin | <a href="/sitemap.html">Site Map</a></p>
<p>Site Launched: September 11, 2022 | <a href="/changelog">Website Changelog</a></p>
<p><a href="#page-top"> Back to top </a></p>
`;

View File

@ -1,11 +1,11 @@
/* Header component content */
document.querySelector("header").innerHTML = `
/* ------ MAIN HEADER COMPONENT ------ */
document.querySelector(".main-header").innerHTML = `
<img src="/assets/Leilukins-Hub-website-banner.png" alt="">
`;
/* Navigation component content */
document.querySelector("nav").innerHTML = `
/* ------ 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>
@ -22,10 +22,9 @@ document.querySelector("nav").innerHTML = `
</ul>
`;
/* MAKE THE NAVBAR STICKY */
const header = document.querySelector("header");
const navbar = document.querySelector("nav");
// Make the navigation bar sticky
const header = document.querySelector(".main-header");
const navbar = document.querySelector(".navbar");
window.addEventListener("scroll", e => {
const scrollPos = window.scrollY || document.documentElement.scrollTop;
@ -35,4 +34,12 @@ window.addEventListener("scroll", e => {
} 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: September 11, 2022 | <a href="/changelog">Website Changelog</a></p>
<p><a href="#page-top"> Back to top </a></p>
`;

View File

@ -19,14 +19,18 @@
<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/header.js" defer></script>
<script src="/js/footer.js" defer></script>
<script src="/js/main-components.js" defer></script>
<title>Links | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -83,6 +87,6 @@
Right sidebar content here
</aside> -->
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -19,14 +19,18 @@
<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/header.js" defer></script>
<script src="/js/footer.js" defer></script>
<script src="/js/main-components.js" defer></script>
<title>My Creations | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -46,6 +50,6 @@
Right sidebar content here
</aside> -->
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -19,14 +19,18 @@
<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/header.js" defer></script>
<script src="/js/footer.js" defer></script>
<script src="/js/main-components.js" defer></script>
<title>My Video Game Mods | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -53,6 +57,6 @@
Right sidebar content here
</aside> -->
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -20,15 +20,19 @@
<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/header.js" defer></script>
<script src="/js/footer.js" defer></script>
<script src="/js/main-components.js" defer></script>
<script src="/js/mod-filter.js" defer></script>
<title>My KotOR 1 Mods | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -197,6 +201,6 @@
Right sidebar content here
</aside> -->
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</h

View File

@ -20,15 +20,19 @@
<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/header.js" defer></script>
<script src="/js/footer.js" defer></script>
<script src="/js/main-components.js" defer></script>
<script src="/js/mod-filter.js" defer></script>
<title>My KotOR 2 Mods | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -248,6 +252,6 @@
Right sidebar content here
</aside> -->
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</h

View File

@ -19,14 +19,18 @@
<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/header.js" defer></script>
<script src="/js/footer.js" defer></script>
<script src="/js/main-components.js" defer></script>
<title>Playlists | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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">
<div class="sidebar__toc">
@ -67,6 +71,6 @@
Right sidebar content here
</aside> -->
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -19,14 +19,18 @@
<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/header.js" defer></script>
<script src="/js/footer.js" defer></script>
<script src="/js/main-components.js" defer></script>
<title>Anti-Harry Potter and Anti-J. K. Rowling Masterlist | Resources | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -81,6 +85,6 @@
Right sidebar content here
</aside> -->
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -19,14 +19,18 @@
<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/header.js" defer></script>
<script src="/js/footer.js" defer></script>
<script src="/js/main-components.js" defer></script>
<title>Resources | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -62,6 +66,6 @@
Right sidebar content here
</aside> -->
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -19,14 +19,20 @@
<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/header.js" defer></script>
<script src="/js/footer.js" defer></script>
<script src="/js/main-components.js" defer></script>
<title>Web Building Resources | Resources | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<script src="/js/main-components.js" defer></script>
<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
@ -122,6 +128,6 @@
Right sidebar content here
</aside> -->
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -23,18 +23,18 @@
--clr-link-btn-txt: white;
--clr-link-btn-hover: #241445;
--clr-header-bg: black;
--clr-nav-bg: #101010;
--clr-nav-link: white;
--clr-main-header-bg: black;
--clr-navbar-bg: #101010;
--clr-navbar-link: white;
--clr-footer-bg: #101010;
--clr-main-footer-bg: #101010;
}
header {
.main-header {
max-height: 20rem;
}
header img {
.main-header img {
object-fit: cover;
object-position: center;
height: 100%;

View File

@ -11,7 +11,7 @@
<meta property="og:title" content="Gallery | A Summers End — Hong Kong 1986 Shrine">
<meta property="og:description" content="Gallery on my A Summers End — Hong Kong 1986 shrine">
<link rel="stylesheet" href="asummersend.css" type="text/css" media="all">
<link rel="stylesheet" href="/shrines/asummersend/css/style-asummersend.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="./img/ase-icon.png">
@ -19,15 +19,18 @@
<link rel="icon" type="image/png" sizes="16x16" href="./img/ase-icon.png">
<link rel="manifest" href="/assets/favicon/site.webmanifest">
<script src="js/header.js" defer></script>
<script src="js/sidebar-content.js" defer></script>
<script src="js/footer.js" defer></script>
<script src="/shrines/asummersend/js/ase-components.js" defer></script>
<title>Gallery | A Summers End — Hong Kong 1986 Shrine | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -57,6 +60,6 @@
<aside class="right-sidebar"></aside>
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -11,7 +11,7 @@
<meta property="og:title" content="A Summers End — Hong Kong 1986 Shrine">
<meta property="og:description" content="My shrine for A Summers End — Hong Kong 1986">
<link rel="stylesheet" href="asummersend.css" type="text/css" media="all">
<link rel="stylesheet" href="/shrines/asummersend/css/style-asummersend.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="./img/ase-icon.png">
@ -19,15 +19,18 @@
<link rel="icon" type="image/png" sizes="16x16" href="./img/ase-icon.png">
<link rel="manifest" href="/assets/favicon/site.webmanifest">
<script src="js/header.js" defer></script>
<script src="js/sidebar-content.js" defer></script>
<script src="js/footer.js" defer></script>
<script src="/shrines/asummersend/js/ase-components.js" defer></script>
<title>A Summers End — Hong Kong 1986 Shrine | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -70,6 +73,6 @@
<aside class="right-sidebar"></aside>
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -0,0 +1,53 @@
/* ------ A SUMMER'S END SHRINE HEADER COMPONENT ------ */
document.querySelector(".main-header").innerHTML = `
<img src="./img/asummersend_header.png" alt="">
`;
/* ------ A SUMMER'S END SHRINE NAVIGATION BAR COMPONENT ------ */
document.querySelector(".navbar").innerHTML = `
<ul class="nav__menu">
<li><a href="/shrines/asummersend/">Shrine Home</a></li>
<li><a href="./playlists.html">Playlists</a></li>
<li><a href="./trivia.html">Trivia</a></li>
<li><a href="./gallery.html">Gallery</a></li>
<li><a href="/home.html">Main Site</a></li>
</ul>
`;
// Make the navigation bar sticky
const header = document.querySelector(".main-header");
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");
}
});
/* ------ A SUMMER'S END SHRINE SIDEBAR COMPONENT ------ */
document.querySelector(".right-sidebar").innerHTML = `
<div class="sidebar--sticky">
<h2>About</h2>
<p><cite>A Summers End Hong Kong 1986</cite> is a visual novel set in 1980s Hong Kong. It tells of a love story between two women. Lush and vibrant visuals, the game features over 400 unique hand-drawn artwork inspired by Asian cinema and 1980s anime.</p>
<h3>Links</h3>
<ul>
<li><a href="https://www.asummersend.com/" target="_blank">Official Website</a>
</li>
<li><a href="https://store.steampowered.com/app/1111370/A_Summers_End__Hong_Kong_1986/" target="_blank">Steam</a></li>
<li><a href="https://oracleandbone.itch.io/a-summers-end" target="_blank">itch.io</a></li>
</ul>
</div>
`;
/* ------ A SUMMER'S END SHRINE FOOTER COMPONENT ------ */
document.querySelector(".main-footer").innerHTML = `
<p>Made with by Leilukin | Shrine Launched: February 16, 2023</p>
<p><a href="#page-top">Back to top</a></p>
`;

View File

@ -1,5 +0,0 @@
// Footer component content
document.querySelector("footer").innerHTML = `
<p>Made with by Leilukin | Shrine Launched: February 16, 2023</p>
<p><a href="#page-top">Back to top</a></p>
`;

View File

@ -1,31 +0,0 @@
/* Header component content */
document.querySelector("header").innerHTML = `
<img src="./img/asummersend_header.png" alt="">
`;
/* Navigation component content */
document.querySelector("nav").innerHTML = `
<ul class="nav__menu">
<li><a href="/shrines/asummersend/">Shrine Home</a></li>
<li><a href="./playlists.html">Playlists</a></li>
<li><a href="./trivia.html">Trivia</a></li>
<li><a href="./gallery.html">Gallery</a></li>
<li><a href="/home.html">Main Site</a></li>
</ul>
`;
/* MAKE THE NAVBAR STICKY */
const header = document.querySelector("header");
const navbar = document.querySelector("nav");
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");
}
});

View File

@ -1,14 +0,0 @@
// Sidebar content
document.querySelector(".right-sidebar").innerHTML = `
<div class="sidebar--sticky">
<h2>About</h2>
<p><cite>A Summers End Hong Kong 1986</cite> is a visual novel set in 1980s Hong Kong. It tells of a love story between two women. Lush and vibrant visuals, the game features over 400 unique hand-drawn artwork inspired by Asian cinema and 1980s anime.</p>
<h3>Links</h3>
<ul>
<li><a href="https://www.asummersend.com/" target="_blank">Official Website</a>
</li>
<li><a href="https://store.steampowered.com/app/1111370/A_Summers_End__Hong_Kong_1986/" target="_blank">Steam</a></li>
<li><a href="https://oracleandbone.itch.io/a-summers-end" target="_blank">itch.io</a></li>
</ul>
</div>
`;

View File

@ -11,7 +11,7 @@
<meta property="og:title" content="Playlists | A Summers End — Hong Kong 1986 Shrine">
<meta property="og:description" content="List of A Summers End — Hong Kong 1986 playlists">
<link rel="stylesheet" href="asummersend.css" type="text/css" media="all">
<link rel="stylesheet" href="/shrines/asummersend/css/style-asummersend.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="./img/ase-icon.png">
@ -19,15 +19,20 @@
<link rel="icon" type="image/png" sizes="16x16" href="./img/ase-icon.png">
<link rel="manifest" href="/assets/favicon/site.webmanifest">
<script src="js/header.js" defer></script>
<script src="js/sidebar-content.js" defer></script>
<script src="js/footer.js" defer></script>
<script src="/shrines/asummersend/js/ase-components.js" defer></script>
<title>Playlists | A Summers End — Hong Kong 1986 Shrine | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<script src="/shrines/asummersend/js/ase-components.js" defer></script>
<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">
<div class="sidebar__toc">
@ -88,6 +93,6 @@
<aside class="right-sidebar"></aside>
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -9,9 +9,9 @@
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="Trivia | A Summers End — Hong Kong 1986 Shrine">
<meta property="og:description" content="Collection of trivia about A Summers End — Hong Kong 1986 shrine">
<meta property="og:description" content="A collection of trivia about A Summers End — Hong Kong 1986 shrine">
<link rel="stylesheet" href="asummersend.css" type="text/css" media="all">
<link rel="stylesheet" href="/shrines/asummersend/css/style-asummersend.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="./img/ase-icon.png">
@ -19,15 +19,18 @@
<link rel="icon" type="image/png" sizes="16x16" href="./img/ase-icon.png">
<link rel="manifest" href="/assets/favicon/site.webmanifest">
<script src="js/header.js" defer></script>
<script src="js/sidebar-content.js" defer></script>
<script src="js/footer.js" defer></script>
<script src="/shrines/asummersend/js/ase-components.js" defer></script>
<title>Trivia | A Summers End — Hong Kong 1986 Shrine | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -121,6 +124,6 @@
<aside class="right-sidebar"></aside>
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -23,27 +23,27 @@
--clr-link-btn-txt: white;
--clr-link-btn-hover: #241445;
--clr-header-bg: #AB75E8;
--clr-nav-bg: #AB75E8;
--clr-nav-link: white;
--clr-main-header-bg: #AB75E8;
--clr-navbar-bg: #AB75E8;
--clr-navbar-link: white;
--clr-footer-bg: #AB75E8;
--clr-main-footer-bg: #AB75E8;
}
header {
.main-header {
max-height: 20rem;
}
header img {
.main-header img {
object-fit: cover;
object-position: top;
height: 100%;
}
footer {
color: var(--clr-nav-link);
.main-footer {
color: var(--clr-navbar-link);
}
footer a {
color: var(--clr-nav-link);
.main-footer a {
color: var(--clr-navbar-link);
}

View File

@ -11,7 +11,7 @@
<meta property="og:title" content="Featured | Cassette Beasts Shrine">
<meta property="og:description" content="A collection of reviews and essays from other people about Cassette Beasts.">
<link rel="stylesheet" href="cassettebeasts.css" type="text/css" media="all">
<link rel="stylesheet" href="/shrines/cassettebeasts/css/style-cassettebeasts.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="./img/cb-icon.png">
@ -19,15 +19,18 @@
<link rel="icon" type="image/png" sizes="16x16" href="./img/cb-icon.png">
<link rel="manifest" href="/assets/favicon/site.webmanifest">
<script src="js/header.js" defer></script>
<script src="js/sidebar-content.js" defer></script>
<script src="js/footer.js" defer></script>
<script src="/shrines/cassettebeasts/js/cb-components.js" defer></script>
<title>Featured | Cassette Beasts Shrine | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -68,6 +71,6 @@
<aside class="right-sidebar"></aside>
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -11,7 +11,7 @@
<meta property="og:title" content="Cassette Beasts Shrine">
<meta property="og:description" content="My shrine for Cassette Beasts">
<link rel="stylesheet" href="cassettebeasts.css" type="text/css" media="all">
<link rel="stylesheet" href="/shrines/cassettebeasts/css/style-cassettebeasts.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="./img/cb-icon.png">
@ -19,15 +19,18 @@
<link rel="icon" type="image/png" sizes="16x16" href="./img/cb-icon.png">
<link rel="manifest" href="/assets/favicon/site.webmanifest">
<script src="js/header.js" defer></script>
<script src="js/sidebar-content.js" defer></script>
<script src="js/footer.js" defer></script>
<script src="/shrines/cassettebeasts/js/cb-components.js" defer></script>
<title>Cassette Beasts Shrine | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -68,6 +71,6 @@
<aside class="right-sidebar"></aside>
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -0,0 +1,53 @@
/* ------ CASSETTE BEASTS SHRINE HEADER COMPONENT ------ */
document.querySelector(".main-header").innerHTML = `
<img src="./img/cassettebeasts-header.png" alt="">
`;
/* ------ CASSETTE BEASTS SHRINE NAVIGATION BAR COMPONENT ------ */
document.querySelector(".navbar").innerHTML = `
<ul class="nav__menu">
<li><a href="/shrines/cassettebeasts/">Shrine Home</a></li>
<li><a href="./featured.html">Featured</a></li>
<li><a href="./trivia.html">Trivia</a></li>
<li><a href="/home.html">Main Site</a></li>
</ul>
`;
// Make the navigation bar sticky
const header = document.querySelector(".main-header");
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");
}
});
/* ------ CASSETTE BEASTS SHRINE SIDEBAR COMPONENT ------ */
document.querySelector(".right-sidebar").innerHTML = `
<div class="sidebar--sticky">
<h2>About</h2>
<p><cite>Cassette Beasts</cite> is an 80s vibe Creature Collector turn-based RPG set in a vast and colourful open world. Record and collect awesome monster forms to use in turn-based battles, or for their abilities to traverse the world. Use the Fusion System to create unique and powerful by combining any two monsters.</p>
<h3>Links</h3>
<ul>
<li><a href="https://www.cassettebeasts.com/" target="_blank">Official Website</a>
</li>
<li><a href="https://wiki.cassettebeasts.com/" target="_blank">Official Wiki</a></li>
<li><a href="https://store.steampowered.com/app/1321440/Cassette_Beasts/" target="_blank">Steam</a></li>
<li><a href="https://bytten-studio.com/" target="_blank">Bytten Studio</a></li>
</ul>
</div>
`;
/* ------ CASSETTE BEASTS SHRINE FOOTER COMPONENT ------ */
document.querySelector(".main-footer").innerHTML = `
<p>Made with by Leilukin | Shrine Launched: August 3, 2023</p>
<p><a href="#page-top">Back to top</a></p>
`;

View File

@ -1,5 +0,0 @@
// Footer component content
document.querySelector("footer").innerHTML = `
<p>Made with by Leilukin | Shrine Launched: August 3, 2023</p>
<p><a href="#page-top">Back to top</a></p>
`;

View File

@ -1,30 +0,0 @@
/* Header component content */
document.querySelector("header").innerHTML = `
<img src="./img/cassettebeasts-header.png" alt="">
`;
/* Navigation component content */
document.querySelector("nav").innerHTML = `
<ul class="nav__menu">
<li><a href="/shrines/cassettebeasts/">Shrine Home</a></li>
<li><a href="./featured.html">Featured</a></li>
<li><a href="./trivia.html">Trivia</a></li>
<li><a href="/home.html">Main Site</a></li>
</ul>
`;
/* MAKE THE NAVBAR STICKY */
const header = document.querySelector("header");
const navbar = document.querySelector("nav");
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");
}
});

View File

@ -1,15 +0,0 @@
// Sidebar content
document.querySelector(".right-sidebar").innerHTML = `
<div class="sidebar--sticky">
<h2>About</h2>
<p><cite>Cassette Beasts</cite> is an 80s vibe Creature Collector turn-based RPG set in a vast and colourful open world. Record and collect awesome monster forms to use in turn-based battles, or for their abilities to traverse the world. Use the Fusion System to create unique and powerful by combining any two monsters.</p>
<h3>Links</h3>
<ul>
<li><a href="https://www.cassettebeasts.com/" target="_blank">Official Website</a>
</li>
<li><a href="https://wiki.cassettebeasts.com/" target="_blank">Official Wiki</a></li>
<li><a href="https://store.steampowered.com/app/1321440/Cassette_Beasts/" target="_blank">Steam</a></li>
<li><a href="https://bytten-studio.com/" target="_blank">Bytten Studio</a></li>
</ul>
</div>
`;

View File

@ -11,7 +11,7 @@
<meta property="og:title" content="Trivia | Cassette Beasts Shrine">
<meta property="og:description" content="Collection of trivia about Cassette Beasts.">
<link rel="stylesheet" href="cassettebeasts.css" type="text/css" media="all">
<link rel="stylesheet" href="/shrines/cassettebeasts/css/style-cassettebeasts.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="./img/cb-icon.png">
@ -19,15 +19,18 @@
<link rel="icon" type="image/png" sizes="16x16" href="./img/cb-icon.png">
<link rel="manifest" href="/assets/favicon/site.webmanifest">
<script src="js/header.js" defer></script>
<script src="js/sidebar-content.js" defer></script>
<script src="js/footer.js" defer></script>
<script src="/shrines/cassettebeasts/js/cb-components.js" defer></script>
<title>Trivia | Cassette Beasts Shrine | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -107,6 +110,6 @@
<aside class="right-sidebar"></aside>
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -5,13 +5,13 @@
<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/shrines/starwarskotor/articles/arren-kae-kreia-theory.html">
<meta property="og:url" content="https://leilukin.neocities.org/shrines/starwarskotor/articles/arren-kae-kreia-theory">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="Why I Personally Do Not Subscribe to the “Arren Kae is Kreia” Theory">
<meta property="og:description" content="The Star Wars: Knights of the Old Republic II: The Sith Lords theory that Arren Kae and Kreia are the same person is very popular among fans of the game. However, I personally do not subscribe to it or incorporate it into my KotOR 2 headcanons. Here is why.">
<link rel="stylesheet" href="/shrines/starwarskotor/starwarskotor.css" type="text/css" media="all">
<link rel="stylesheet" href="/shrines/starwarskotor/css/style-starwarskotor.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="/shrines/starwarskotor/img/kotor-icon.png">
@ -19,15 +19,18 @@
<link rel="icon" type="image/png" sizes="16x16" href="/shrines/starwarskotor/img/kotor-icon.png">
<link rel="manifest" href="/assets/favicon/site.webmanifest">
<script src="/shrines/starwarskotor/js/header.js" defer></script>
<script src="/shrines/starwarskotor/js/sidebar-content.js" defer></script>
<script src="/shrines/starwarskotor/js/footer.js" defer></script>
<script src="/shrines/starwarskotor/js/swkotor-components.js" defer></script>
<title>My Thoughts on the “Arren Kae is Kreia” Theory | Articles | Star Wars: Knights of the Old Republic Shrine | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -57,6 +60,6 @@
<aside class="right-sidebar"></aside>
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -11,7 +11,7 @@
<meta property="og:title" content="FAQ for My Star Wars: KotOR Same-Gender Romance Mods | Star Wars: Knights of the Old Republic Shrine">
<meta property="og:description" content="Frequently asked questions for my same-gender romance mods for Star Wars: Knights of the Old Republic series">
<link rel="stylesheet" href="/shrines/starwarskotor/starwarskotor.css" type="text/css" media="all">
<link rel="stylesheet" href="/shrines/starwarskotor/css/style-starwarskotor.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="/shrines/starwarskotor/img/kotor-icon.png">
@ -19,15 +19,18 @@
<link rel="icon" type="image/png" sizes="16x16" href="/shrines/starwarskotor/img/kotor-icon.png">
<link rel="manifest" href="/assets/favicon/site.webmanifest">
<script src="/shrines/starwarskotor/js/header.js" defer></script>
<script src="/shrines/starwarskotor/js/sidebar-content.js" defer></script>
<script src="/shrines/starwarskotor/js/footer.js" defer></script>
<script src="/shrines/starwarskotor/js/swkotor-components.js" defer></script>
<title>FAQ for My Star Wars: KotOR Same-Gender Romance Mods | Guides | Star Wars: Knights of the Old Republic Shrine | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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">
<div class="sidebar__toc">
@ -318,4 +321,6 @@
<aside class="right-sidebar"></aside>
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -5,13 +5,13 @@
<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/shrines/starwarskotor/articles/handmaiden-sisters-mother.html">
<meta property="og:url" content="https://leilukin.neocities.org/shrines/starwarskotor/articles/handmaiden-sisters-mother">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="Where is the Mother of the Handmaidens Sisters?">
<meta property="og:description" content="The mother of the Handmaiden Sister is a mystery in Star Wars: Knights of the Old Republic II: The Sith Lords that the game strangely never explores, despite how important family is to the Handmaiden's story.">
<link rel="stylesheet" href="/shrines/starwarskotor/starwarskotor.css" type="text/css" media="all">
<link rel="stylesheet" href="/shrines/starwarskotor/css/style-starwarskotor.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="/shrines/starwarskotor/img/kotor-icon.png">
@ -19,15 +19,18 @@
<link rel="icon" type="image/png" sizes="16x16" href="/shrines/starwarskotor/img/kotor-icon.png">
<link rel="manifest" href="/assets/favicon/site.webmanifest">
<script src="/shrines/starwarskotor/js/header.js" defer></script>
<script src="/shrines/starwarskotor/js/sidebar-content.js" defer></script>
<script src="/shrines/starwarskotor/js/footer.js" defer></script>
<script src="/shrines/starwarskotor/js/swkotor-components.js" defer></script>
<title>Where is the Mother of Handmaidens Sisters? | Articles | Star Wars: Knights of the Old Republic Shrine | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -60,6 +63,6 @@
<aside class="right-sidebar"></aside>
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -11,7 +11,7 @@
<meta property="og:title" content="Articles | Star Wars: Knights of the Old Republic Shrine">
<meta property="og:description" content="List of my articles and articles I recommend for the Star Wars: Knights of the Old Republic series">
<link rel="stylesheet" href="/shrines/starwarskotor/starwarskotor.css" type="text/css" media="all">
<link rel="stylesheet" href="/shrines/starwarskotor/css/style-starwarskotor.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="/shrines/starwarskotor/img/kotor-icon.png">
@ -19,15 +19,18 @@
<link rel="icon" type="image/png" sizes="16x16" href="/shrines/starwarskotor/img/kotor-icon.png">
<link rel="manifest" href="/assets/favicon/site.webmanifest">
<script src="/shrines/starwarskotor/js/header.js" defer></script>
<script src="/shrines/starwarskotor/js/sidebar-content.js" defer></script>
<script src="/shrines/starwarskotor/js/footer.js" defer></script>
<script src="/shrines/starwarskotor/js/swkotor-components.js" defer></script>
<title>Articles | Star Wars: Knights of the Old Republic Shrine | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -75,6 +78,6 @@
<aside class="right-sidebar"></aside>
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -5,13 +5,13 @@
<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/shrines/starwarskotor/articles/juhani-lesbian-evidence.html">
<meta property="og:url" content="https://leilukin.neocities.org/shrines/starwarskotor/articles/juhani-hostility-towards-canderous">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="How to Access Juhani's Conversaion about Canderous without Restoration Mods">
<meta property="og:description" content="If you follow the modding scene of Star Wars: Knights of the Old Republic, you might be aware of a conversation with Juhani where the player asks her why she is hostile towards Canderous. It is a commonly assumed that it is cut content, but the truth is that it is possible to access the conversation without mods, though it is extremely easy to miss.">
<link rel="stylesheet" href="/shrines/starwarskotor/starwarskotor.css" type="text/css" media="all">
<link rel="stylesheet" href="/shrines/starwarskotor/css/style-starwarskotor.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="/shrines/starwarskotor/img/kotor-icon.png">
@ -19,15 +19,18 @@
<link rel="icon" type="image/png" sizes="16x16" href="/shrines/starwarskotor/img/kotor-icon.png">
<link rel="manifest" href="/assets/favicon/site.webmanifest">
<script src="/shrines/starwarskotor/js/header.js" defer></script>
<script src="/shrines/starwarskotor/js/sidebar-content.js" defer></script>
<script src="/shrines/starwarskotor/js/footer.js" defer></script>
<script src="/shrines/starwarskotor/js/swkotor-components.js" defer></script>
<title>Access Juhani's Conversaion about Canderous without Restoration Mods | Articles | Star Wars: Knights of the Old Republic Shrine | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -67,6 +70,6 @@
<aside class="right-sidebar"></aside>
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -5,13 +5,13 @@
<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/shrines/starwarskotor/articles/juhani-lesbian-evidence.html">
<meta property="og:url" content="https://leilukin.neocities.org/shrines/starwarskotor/articles/juhani-lesbian-evidence">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="Evidence of Juhani being a Lesbian from Star Wars: Knights of the Old Republic's Game Files">
<meta property="og:description" content="Juhani is a canon lesbian character and she has always been intended as such by the developers of Knights of the Old Republic. Here I am presenting evidence from the game files to prove it.">
<link rel="stylesheet" href="/shrines/starwarskotor/starwarskotor.css" type="text/css" media="all">
<link rel="stylesheet" href="/shrines/starwarskotor/css/style-starwarskotor.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="/shrines/starwarskotor/img/kotor-icon.png">
@ -19,15 +19,18 @@
<link rel="icon" type="image/png" sizes="16x16" href="/shrines/starwarskotor/img/kotor-icon.png">
<link rel="manifest" href="/assets/favicon/site.webmanifest">
<script src="/shrines/starwarskotor/js/header.js" defer></script>
<script src="/shrines/starwarskotor/js/sidebar-content.js" defer></script>
<script src="/shrines/starwarskotor/js/footer.js" defer></script>
<script src="/shrines/starwarskotor/js/swkotor-components.js" defer></script>
<title>Evidence of Juhani being a Lesbian from Star Wars: KotOR's Game Files | Articles | Star Wars: Knights of the Old Republic Shrine | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -86,6 +89,6 @@
<aside class="right-sidebar"></aside>
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -11,7 +11,7 @@
<meta property="og:title" content="Keep Juhani a Lesbian and Keep Juhani's Romance Exclusive to Female Characters">
<meta property="og:description" content="A statement about my stance that Juhani should remain a lesbian, her romance should remain exclusive to female chracters, and she should not be a romance option for male characters under any circumstances, and why.">
<link rel="stylesheet" href="/shrines/starwarskotor/starwarskotor.css" type="text/css" media="all">
<link rel="stylesheet" href="/shrines/starwarskotor/css/style-starwarskotor.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="/shrines/starwarskotor/img/kotor-icon.png">
@ -19,15 +19,18 @@
<link rel="icon" type="image/png" sizes="16x16" href="/shrines/starwarskotor/img/kotor-icon.png">
<link rel="manifest" href="/assets/favicon/site.webmanifest">
<script src="/shrines/starwarskotor/js/header.js" defer></script>
<script src="/shrines/starwarskotor/js/sidebar-content.js" defer></script>
<script src="/shrines/starwarskotor/js/footer.js" defer></script>
<script src="/shrines/starwarskotor/js/swkotor-components.js" defer></script>
<title>Keep Juhani a Lesbian | Articles | Star Wars: Knights of the Old Republic Shrine | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -66,6 +69,6 @@
<aside class="right-sidebar"></aside>
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -11,7 +11,7 @@
<meta property="og:title" content="On Me Taking Over the Management and Development of DarthTyren's PartySwap Mod">
<meta property="og:description" content="Official announcement about me taking over the management and development of DarthTyren's PartySwap mod for Star Wars: Knights of the Old Republic II.">
<link rel="stylesheet" href="/shrines/starwarskotor/starwarskotor.css" type="text/css" media="all">
<link rel="stylesheet" href="/shrines/starwarskotor/css/style-starwarskotor.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="/shrines/starwarskotor/img/kotor-icon.png">
@ -19,15 +19,18 @@
<link rel="icon" type="image/png" sizes="16x16" href="/shrines/starwarskotor/img/kotor-icon.png">
<link rel="manifest" href="/assets/favicon/site.webmanifest">
<script src="/shrines/starwarskotor/js/header.js" defer></script>
<script src="/shrines/starwarskotor/js/sidebar-content.js" defer></script>
<script src="/shrines/starwarskotor/js/footer.js" defer></script>
<script src="/shrines/starwarskotor/js/swkotor-components.js" defer></script>
<title>PartySwap Mod Management and Development Takeover | Articles | Star Wars: Knights of the Old Republic Shrine | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -80,6 +83,6 @@
<aside class="right-sidebar"></aside>
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -23,11 +23,11 @@
--clr-link-btn-txt: white;
--clr-link-btn-hover: #241445;
--clr-header-bg: black;
--clr-nav-bg: #171717;
--clr-nav-link: white;
--clr-main-header-bg: black;
--clr-navbar-bg: #171717;
--clr-navbar-link: white;
--clr-footer-bg: #171717;
--clr-main-footer-bg: #171717;
}
header img {

View File

@ -11,7 +11,7 @@
<meta property="og:title" content="Guides | Star Wars: Knights of the Old Republic Shrine">
<meta property="og:description" content="List of guides for the Star Wars: Knights of the Old Republic series I have written or found useful. This page also includes lists of cheats.">
<link rel="stylesheet" href="/shrines/starwarskotor/starwarskotor.css" type="text/css" media="all">
<link rel="stylesheet" href="/shrines/starwarskotor/css/style-starwarskotor.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="/shrines/starwarskotor/img/kotor-icon.png">
@ -19,15 +19,18 @@
<link rel="icon" type="image/png" sizes="16x16" href="/shrines/starwarskotor/img/kotor-icon.png">
<link rel="manifest" href="/assets/favicon/site.webmanifest">
<script src="/shrines/starwarskotor/js/header.js" defer></script>
<script src="/shrines/starwarskotor/js/sidebar-content.js" defer></script>
<script src="/shrines/starwarskotor/js/footer.js" defer></script>
<script src="/shrines/starwarskotor/js/swkotor-components.js" defer></script>
<title>Guides | Star Wars: Knights of the Old Republic Shrine | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -61,6 +64,6 @@
<aside class="right-sidebar"></aside>
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -5,13 +5,13 @@
<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/shrines/starwarskotor/resources/kotor-sandral-matale-feud-guide.html">
<meta property="og:url" content="https://leilukin.neocities.org/shrines/starwarskotor/guides/kotor-juhani-romance-guide">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="Juhani Romance Guide | Star Wars: Knights of the Old Republic Shrine">
<meta property="og:description" content="Walkthrough of how to successfully romance Juhani in Star Wars: Knights of the Old Republic">
<link rel="stylesheet" href="/shrines/starwarskotor/starwarskotor.css" type="text/css" media="all">
<link rel="stylesheet" href="/shrines/starwarskotor/css/style-starwarskotor.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="/shrines/starwarskotor/img/kotor-icon.png">
@ -19,15 +19,18 @@
<link rel="icon" type="image/png" sizes="16x16" href="/shrines/starwarskotor/img/kotor-icon.png">
<link rel="manifest" href="/assets/favicon/site.webmanifest">
<script src="/shrines/starwarskotor/js/header.js" defer></script>
<script src="/shrines/starwarskotor/js/sidebar-content.js" defer></script>
<script src="/shrines/starwarskotor/js/footer.js" defer></script>
<script src="/shrines/starwarskotor/js/swkotor-components.js" defer></script>
<title>Juhani Romance Guide | Guides | Star Wars: Knights of the Old Republic Shrine | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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">
<div class="sidebar__toc">
@ -187,6 +190,6 @@
<aside class="right-sidebar"></aside>
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -5,13 +5,13 @@
<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/shrines/starwarskotor/resources/kotor-sandral-matale-feud-guide.html">
<meta property="og:url" content="https://leilukin.neocities.org/shrines/starwarskotor/guides/kotor-redeeming-bastila-guide">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="Redeeming Bastila Guide | Star Wars: Knights of the Old Republic Shrine">
<meta property="og:description" content="Walkthrough of how to redeem Bastila in the light side ending of Star Wars: Knights of the Old Republic">
<link rel="stylesheet" href="/shrines/starwarskotor/starwarskotor.css" type="text/css" media="all">
<link rel="stylesheet" href="/shrines/starwarskotor/css/style-starwarskotor.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="/shrines/starwarskotor/img/kotor-icon.png">
@ -19,15 +19,18 @@
<link rel="icon" type="image/png" sizes="16x16" href="/shrines/starwarskotor/img/kotor-icon.png">
<link rel="manifest" href="/assets/favicon/site.webmanifest">
<script src="/shrines/starwarskotor/js/header.js" defer></script>
<script src="/shrines/starwarskotor/js/sidebar-content.js" defer></script>
<script src="/shrines/starwarskotor/js/footer.js" defer></script>
<script src="/shrines/starwarskotor/js/swkotor-components.js" defer></script>
<title>Redeeming Bastila Guide | Guides | Star Wars: Knights of the Old Republic Shrine | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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">
<div class="sidebar__toc">
@ -153,6 +156,6 @@
<aside class="right-sidebar"></aside>
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -5,13 +5,13 @@
<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/shrines/starwarskotor/resources/kotor-sandral-matale-feud-guide.html">
<meta property="og:url" content="https://leilukin.neocities.org/shrines/starwarskotor/guides/kotor-sandral-matale-feud-guide">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="Sandral-Matale Feud Ending Guide | Star Wars: Knights of the Old Republic Shrine">
<meta property="og:description" content="Walkthrogh of the different ways to resolve the Sandral-Matale Feud quest in Star Wars: Knights of the Old Republic">
<link rel="stylesheet" href="/shrines/starwarskotor/starwarskotor.css" type="text/css" media="all">
<link rel="stylesheet" href="/shrines/starwarskotor/css/style-starwarskotor.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="/shrines/starwarskotor/img/kotor-icon.png">
@ -19,15 +19,18 @@
<link rel="icon" type="image/png" sizes="16x16" href="/shrines/starwarskotor/img/kotor-icon.png">
<link rel="manifest" href="/assets/favicon/site.webmanifest">
<script src="/shrines/starwarskotor/js/header.js" defer></script>
<script src="/shrines/starwarskotor/js/sidebar-content.js" defer></script>
<script src="/shrines/starwarskotor/js/footer.js" defer></script>
<script src="/shrines/starwarskotor/js/swkotor-components.js" defer></script>
<title>Sandral-Matale Feud Ending Guide | Guides | Star Wars: Knights of the Old Republic Shrine | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -109,10 +112,10 @@
<p>After Nurik kills Shen, choose either <strong>"Are you going to let that one pass?"</strong> or <strong>"Wipe them all out."</strong> for more Dark Side points. After the fathers and their children are dead, you will fight the fathers' droids.</p>
</section>
</article>
</article>
<aside class="right-sidebar"></aside>
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -11,7 +11,7 @@
<meta property="og:title" content="Star Wars: Knights of the Old Republic Shrine">
<meta property="og:description" content="My shrine for Star Wars: Knights of the Old Republic">
<link rel="stylesheet" href="/shrines/starwarskotor/starwarskotor.css" type="text/css" media="all">
<link rel="stylesheet" href="/shrines/starwarskotor/css/style-starwarskotor.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="/shrines/starwarskotor/img/kotor-icon.png">
@ -19,15 +19,18 @@
<link rel="icon" type="image/png" sizes="16x16" href="/shrines/starwarskotor/img/kotor-icon.png">
<link rel="manifest" href="/assets/favicon/site.webmanifest">
<script src="/shrines/starwarskotor/js/header.js" defer></script>
<script src="/shrines/starwarskotor/js/sidebar-content.js" defer></script>
<script src="/shrines/starwarskotor/js/footer.js" defer></script>
<script src="/shrines/starwarskotor/js/swkotor-components.js" defer></script>
<title>Star Wars: Knights of the Old Republic Shrine | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -67,6 +70,6 @@
<aside class="right-sidebar"></aside>
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -1,5 +0,0 @@
// Footer component content
document.querySelector("footer").innerHTML = `
<p>Made with and the Force by Leilukin | Shrine Launched: February 17, 2023</p>
<p><a href="#page-top">Back to top</a></p>
`;

View File

@ -1,30 +0,0 @@
/* Header component content */
document.querySelector("header").innerHTML = `
<img src="/shrines/starwarskotor/img/swkotor-header.jpg" alt="">
`;
/* Navigation component content */
document.querySelector("nav").innerHTML = `
<ul class="nav__menu">
<li><a href="/shrines/starwarskotor/">Home</a></li>
<li><a href="/shrines/starwarskotor/articles/">Articles</a></li>
<li><a href="/shrines/starwarskotor/guides/">Guides</a></li>
<li><a href="/shrines/starwarskotor/resources/">Resources</a></li>
<li><a href="/home.html">Main Site</a></li>
</ul>
`;
/* MAKE THE NAVBAR STICKY */
const header = document.querySelector("header");
const navbar = document.querySelector("nav");
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");
}
});

View File

@ -1,12 +0,0 @@
// Sidebar content
document.querySelector(".right-sidebar").innerHTML = `
<div class="sidebar--sticky">
<h2>About</h2>
<p><cite>Star Wars: Knights of the Old Republic</cite> is a space opera role-playing video game series that takes place in the <cite>Star Wars</cite> universe. The story takes place approximately 4,000 years before the rise of the Galactic Empire.</p>
<h2>Fan Listings</h2>
<p>I have joined these fan listings for the <cite>KotOR</cite> games:</p>
<a href="https://glitterskies.org/kotor/" target="_blank"><img src="/links/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="/links/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>
</div>
`;

View File

@ -0,0 +1,50 @@
/* ------ STAR WARS KOTOR SHRINE HEADER COMPONENT ------ */
document.querySelector(".main-header").innerHTML = `
<img src="/shrines/starwarskotor/img/swkotor-header.jpg" alt="">
`;
/* Navigation component content */
document.querySelector(".navbar").innerHTML = `
<ul class="nav__menu">
<li><a href="/shrines/starwarskotor/">Home</a></li>
<li><a href="/shrines/starwarskotor/articles/">Articles</a></li>
<li><a href="/shrines/starwarskotor/guides/">Guides</a></li>
<li><a href="/shrines/starwarskotor/resources/">Resources</a></li>
<li><a href="/home.html">Main Site</a></li>
</ul>
`;
// Make the navigation bar sticky
const header = document.querySelector(".main-header");
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");
}
});
/* ------ STAR WARS KOTOR SHRINE SIDEBAR COMPONENT ------ */
document.querySelector(".right-sidebar").innerHTML = `
<div class="sidebar--sticky">
<h2>About</h2>
<p><cite>Star Wars: Knights of the Old Republic</cite> is a space opera role-playing video game series that takes place in the <cite>Star Wars</cite> universe. The story takes place approximately 4,000 years before the rise of the Galactic Empire.</p>
<h2>Fan Listings</h2>
<p>I have joined these fan listings for the <cite>KotOR</cite> games:</p>
<a href="https://glitterskies.org/kotor/" target="_blank"><img src="/links/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="/links/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>
</div>
`;
/* ------ STAR WARS KOTOR SHRINE FOOTER COMPONENT ------ */
document.querySelector(".main-footer").innerHTML = `
<p>Made with and the Force by Leilukin | Shrine Launched: February 17, 2023</p>
<p><a href="#page-top">Back to top</a></p>
`;

View File

@ -11,7 +11,7 @@
<meta property="og:title" content="Resources | Star Wars: Knights of the Old Republic Shrine">
<meta property="og:description" content="List of Star Wars: Knights of the Old Republic resources I have compiled myself.">
<link rel="stylesheet" href="/shrines/starwarskotor/starwarskotor.css" type="text/css" media="all">
<link rel="stylesheet" href="/shrines/starwarskotor/css/style-starwarskotor.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="/shrines/starwarskotor/img/kotor-icon.png">
@ -19,15 +19,18 @@
<link rel="icon" type="image/png" sizes="16x16" href="/shrines/starwarskotor/img/kotor-icon.png">
<link rel="manifest" href="/assets/favicon/site.webmanifest">
<script src="/shrines/starwarskotor/js/header.js" defer></script>
<script src="/shrines/starwarskotor/js/sidebar-content.js" defer></script>
<script src="/shrines/starwarskotor/js/footer.js" defer></script>
<script src="/shrines/starwarskotor/js/swkotor-components.js" defer></script>
<title>Resources | Star Wars: Knights of the Old Republic Shrine | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -86,10 +89,10 @@
<li><a href="https://docs.google.com/document/d/15HbD-k-D8WHrp10IjIryAguhq7k2W94pkuGys7Z7xNM/edit" target="_blank">Star Wars: Knights of the Old Republic II: The Sith Lords</a></li>
</ul>
</section>
</div>
</div>
<aside class="right-sidebar"></aside>
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -5,13 +5,13 @@
<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/shrines/starwarskotor/resources/kotor-same-gender-romance-mods.html">
<meta property="og:url" content="https://leilukin.neocities.org/shrines/starwarskotor/resources/kotor-same-gender-romance-mods">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="List of Same-Gender Romance Mods for Star Wars: Knights of the Old Republic Series">
<meta property="og:description" content="Throughout the years, modders have created same-gender romance mods for the Knights of the Old Republic series. Want to make your KotOR games more gay? This list is for you!">
<link rel="stylesheet" href="/shrines/starwarskotor/starwarskotor.css" type="text/css" media="all">
<link rel="stylesheet" href="/shrines/starwarskotor/css/style-starwarskotor.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="/shrines/starwarskotor/img/kotor-icon.png">
@ -19,15 +19,18 @@
<link rel="icon" type="image/png" sizes="16x16" href="/shrines/starwarskotor/img/kotor-icon.png">
<link rel="manifest" href="/assets/favicon/site.webmanifest">
<script src="/shrines/starwarskotor/js/header.js" defer></script>
<script src="/shrines/starwarskotor/js/sidebar-content.js" defer></script>
<script src="/shrines/starwarskotor/js/footer.js" defer></script>
<script src="/shrines/starwarskotor/js/swkotor-components.js" defer></script>
<title>Same-Gender Romance Mods for KotOR Series | Resources | Star Wars: Knights of the Old Republic Shrine | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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">
<div class="sidebar__toc">
@ -207,6 +210,4 @@
<aside class="right-sidebar"></aside>
</main>
<footer></footer>
</body>
</html>
<footer class="main-footer"></footer>

View File

@ -5,13 +5,13 @@
<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/shrines/starwarskotor/resources/kotor2-female-exile-recruit-handmaiden-mods.html">
<meta property="og:url" content="https://leilukin.neocities.org/shrines/starwarskotor/resources/kotor2-female-exile-recruit-handmaiden-mods">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="List of Star Wars: Knights of the Old Republic II Mods that Allow Female Exiles to Recruit the Handmaiden as a Party Member">
<meta property="og:description" content="Disappointed that female Jedi Exiles cannot recruit the Handmaiden as a party member? Good news! That is what these mods are for!">
<link rel="stylesheet" href="/shrines/starwarskotor/starwarskotor.css" type="text/css" media="all">
<link rel="stylesheet" href="/shrines/starwarskotor/css/style-starwarskotor.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="/shrines/starwarskotor/img/kotor-icon.png">
@ -19,15 +19,18 @@
<link rel="icon" type="image/png" sizes="16x16" href="/shrines/starwarskotor/img/kotor-icon.png">
<link rel="manifest" href="/assets/favicon/site.webmanifest">
<script src="/shrines/starwarskotor/js/header.js" defer></script>
<script src="/shrines/starwarskotor/js/sidebar-content.js" defer></script>
<script src="/shrines/starwarskotor/js/footer.js" defer></script>
<script src="/shrines/starwarskotor/js/swkotor-components.js" defer></script>
<title>List of KotOR 2 Mods that Allow Female Exiles to Recruit the Handmaiden as a Party Member | Resources | Star Wars: Knights of the Old Republic Shrine | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -68,6 +71,6 @@
<aside class="right-sidebar"></aside>
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -5,13 +5,13 @@
<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/shrines/starwarskotor/resources/tslrcm-m478ep-modules-music.html">
<meta property="og:url" content="https://leilukin.neocities.org/shrines/starwarskotor/resources/tslrcm-m478ep-modules-music">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Leilukin's Hub">
<meta property="og:title" content="The Sith Lords Restored Content Mod + M4-78 Enhancement Project Modules, Warp Codes & Music Overview">
<meta property="og:description" content="A list of all the modules and their music used by The Sith Lords Restored Content Mod and the M4-78 Enhancement Project, including codes for the warp cheat.">
<link rel="stylesheet" href="/shrines/starwarskotor/starwarskotor.css" type="text/css" media="all">
<link rel="stylesheet" href="/shrines/starwarskotor/css/style-starwarskotor.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="/shrines/starwarskotor/img/kotor-icon.png">
@ -19,15 +19,18 @@
<link rel="icon" type="image/png" sizes="16x16" href="/shrines/starwarskotor/img/kotor-icon.png">
<link rel="manifest" href="/assets/favicon/site.webmanifest">
<script src="/shrines/starwarskotor/js/header.js" defer></script>
<script src="/shrines/starwarskotor/js/sidebar-content.js" defer></script>
<script src="/shrines/starwarskotor/js/footer.js" defer></script>
<script src="/shrines/starwarskotor/js/swkotor-components.js" defer></script>
<title>List of KotOR 2 Mods that Allow Female Exiles to Recruit the Handmaiden as a Party Member | Resources | Star Wars: Knights of the Old Republic Shrine | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -56,6 +59,6 @@
<aside class="right-sidebar"></aside>
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>

View File

@ -19,14 +19,18 @@
<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/header.js" defer></script>
<script src="/js/footer.js" defer></script>
<script src="/js/main-components.js" defer></script>
<title>Site Map | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<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
@ -119,6 +123,6 @@
Right sidebar content here
</aside> -->
</main>
<footer></footer>
<footer class="main-footer"></footer>
</body>
</html>