Leilukin
/
leilukin-site
mirror of https://github.com/helenclx/leilukin-site.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Added Cassette Beasts shrine

This commit is contained in:
Helen Chong 2023-08-03 16:31:06 +08:00
parent 512e91eaa5
commit 08c37e2c7f
13 changed files with 190 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
.gitignore vendored
View File

@ -1,3 +1,2 @@
.DS_Store
**/__Source
**/shrines/cassettebeasts
**/__Source

5
changelog/index.html
View File

@ -39,6 +39,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 3, 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">July 28, 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>

5
home.html
View File

@ -64,10 +64,9 @@
<section class="content-section">
<h2>Updates</h2>
<div class="text-box">
<p class="date-style">July 28, 2023:</p>
<p class="date-style">August 3, 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>
<li>Launched new <a href="/shrines/">shrine</a>: <a href="/shrines/cassettebeasts/"><cite>Cassette Beasts</cite></a>.</li>
</ul>
</div>
<a href="/changelog">View all site changelog</a>

49
shrines/cassettebeasts/cassettebeasts.css Normal file
View File

@ -0,0 +1,49 @@
@import url(/css/style-main.css);
:root {
--clr-body-bg: #1f0033;
--img-body-bg: url(/shrines/cassettebeasts/img/cassettebeasts-bg.jpg);
--clr-body-txt: #000000;
--clr-content-bg: #ffffff;
--clr-main-heading: #000000;
--clr-sub-heading: #000000;
--clr-title-border: #797979;
--clr-bold-txt: #F2814C;
--clr-link: #AB75E8;
--clr-link-hover: #6914cb;
--clr-quote-bg: #dddddd;
--clr-quote-border: #777777;
--clr-code-bg: #dddddd;
--clr-code-border: #777777;
--clr-dates: rgb(58, 150, 255);
--clr-link-btn-bg: #873eb5;
--clr-link-btn-txt: white;
--clr-link-btn-hover: #241445;
--clr-header-bg: #AB75E8;
--clr-nav-bg: #AB75E8;
--clr-nav-link: white;
--clr-footer-bg: #AB75E8;
}
header {
max-height: 20rem;
}
header img {
object-fit: cover;
object-position: top;
height: 100%;
}
footer {
color: var(--clr-nav-link);
}
footer a {
color: var(--clr-nav-link);
}

BIN
shrines/cassettebeasts/img/cassettebeasts-bg.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 41 KiB

BIN
shrines/cassettebeasts/img/cassettebeasts-header.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.0 MiB

BIN
shrines/cassettebeasts/img/cb-icon.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 38 KiB

71
shrines/cassettebeasts/index.html Normal file
View File

@ -0,0 +1,71 @@
<!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/shrines/cassettebeasts">
<meta property="og:type" content="website">
<meta property="og:site_name" content="Leilukin's Hub">
<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="https://use.fontawesome.com/releases/v5.15.1/css/all.css">
<link rel="apple-touch-icon" sizes="180x180" href="./img/cb-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="./img/cb-icon.png">
<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>
<title>Cassette Beasts Shrine | Leilukin's Hub</title>
</head>
<body>
<header></header>
<nav></nav>
<main>
<!-- <aside class="left-sidebar">
Left sidebar content here
</aside> -->
<div class="content-container">
<section class="content-section">
<h1>Welcome to Leilukin's <cite>Cassette Beasts</cite> Shrine!</h1>
<img src="./img/cassettebeasts_header.png" alt="Promotional image of Cassette Beasts">
<p><cite>Cassette Beasts</cite> is a 2D/3D hybrid creature collector open-world role-playing game developed by Bytten Studio, an indie team based in Brighton, United Kingdom, co-founded by Jay Baylis and Tom Coxon, and published by Raw Fury.</p>
<p>First released on Steam and Windows on April 26, 2023, later on console on May 25, 2023, <cite>Casette Beasts</cite> is available on Windows, Linux, Steam, Xbox Series X|S, Xbox One, Gamepass and Nintendo Switch.</p>
<p><cite>A Summer’s End</cite> is available on <a href="https://store.steampowered.com/app/1111370/A_Summers_End__Hong_Kong_1986/" target="_blank">Steam</a> and <a href="https://oracleandbone.itch.io/a-summers-end" target="_blank">itch.io</a>. It also has an <a href="https://www.cassettebeasts.com/" target="_blank">official website</a>.</p>
</section>
<section class="content-section">
<h2>How I Got into <cite>Cassette Beasts</cite></h2>
<p>On June 30, 2023, when the Steam Summer Sale 2023 just started, I received <cite>Cassette Beasts</cite> as a Steam gift from a generous friend, who knew that I had been looking for independant monster-collecting games, since I mostly play indie games instead of AAA games nowadays.</p>
<p>I started my first playthrough of <cite>Cassette Beasts</cite> on July 18, 2023, and I was immediately hooked. I could already feel that this game has like everything I could ask for in an indie alternative to <cite>Pokémon</cite>.</p>
<p>I ended up spending around 34 hours to beat the main campaign, and that was because I made the deliberate decision to max out the companion characters' relationship level before advancing to the final level of the main story, because this game has more focus on human characters and relationships than what you may expect in a monster-collecting game.</p>
</section>
<section class="content-section">
<h2>Why You Should Play <cite>Cassette Beasts</cite></h2>
<p><cite>Cassette Beasts</cite> is a masterpiece of a monster collector game, rivalling if not even surpassing <cite>Pokémon</cite> at its best, because while it is obvious that Cassette Beasts is inspired by <cite>Pokémon</cite>, it utilises various aspects of <cite>Pokémon</cite> games with its own unique takes that are sometimes even better than <cite>Pokémon</cite>, from monster collecting mechanic, battle system, elemental type match ups, story, characters, lore, world building, map design, etc, with an amazing soundtrack that goes along with the game. As a result, <cite>Cassette Beasts</cite> is perfectly capable of standing on its own.</p>
<p>I cannot recommend <cite>Cassette Beasts</cite> enough if you like monster-collecting games, including, if not especially, if you like <cite>Pokémon</cite> but want an indie alternative, or something different after finding <cite>Pokémon</cite> games getting stale or becoming jaded by the direction of the <cite>Pokémon</cite> games.</p>
</section>
</div>
<aside class="right-sidebar"></aside>
</main>
<footer></footer>
</body>
</html>

5
shrines/cassettebeasts/js/footer.js Normal file
View File

@ -0,0 +1,5 @@
// 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>
`;

29
shrines/cassettebeasts/js/header.js Normal file
View File

@ -0,0 +1,29 @@
/* 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="./playlists.html">Playlists</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");
}
});

15
shrines/cassettebeasts/js/sidebar-content.js Normal file
View File

@ -0,0 +1,15 @@
// Sidebar content
document.querySelector(".right-sidebar").innerHTML = `
<div class="sidebar--sticky">
<h2>About</h2>
<p><cite>Cassette Beasts</cite> is an 80’s 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>
`;

11
shrines/index.html
View File

@ -39,20 +39,25 @@
</section>
<section class="content-section">
<h2><a href="./asummersend/" target="_blank"><em>A Summer’s End — Hong Kong 1986</em></a></h2>
<h2><a href="./asummersend/" target="_blank"><cite>A Summer’s End — Hong Kong 1986</cite></a></h2>
<a href="./asummersend/" target="_blank"><img src="./asummersend/img/ASE_Key_art_intro.png" alt="Header of A Summer’s End — Hong Kong 1986" width="100%"></a>
</section>
<section class="content-section">
<h2><a href="./starwarskotor/" target="_blank"><em>Star Wars: Knights of the Old Republic</em></a></h2>
<h2><a href="./starwarskotor/" target="_blank"><cite>Star Wars: Knights of the Old Republic</cite></a></h2>
<a href="./starwarskotor/" target="_blank"><img src="./starwarskotor/img/swkotor-header.jpg" alt="Header of the Star Wars: Knights of the Old Republic series" width="100%"></a>
</section>
<section class="content-section">
<h2><a href="./cassettebeasts/" target="_blank"><cite>Cassette Beasts</cite></a></h2>
<a href="./cassettebeasts/" target="_blank"><img src="./cassettebeasts/img/cassettebeasts-header.png" alt="Header of the Star Wars: Knights of the Old Republic series" width="100%"></a>
</section>
</div>
<!-- <aside class="right-sidebar">
Right sidebar content here
</aside> -->
</main>
<footer-component></footer-component>
<footer></footer>
</body>
</html>

9
sitemap.html
View File

@ -48,8 +48,8 @@
<li><a href="/mycreations/">My Creations</a></li>
<li><a href="/mymods/">My Mods</a></li>
<ul>
<li><a href="/mymods/kotor1mods/"><em>Star Wars: Knights of the Old Republic</em></a></li>
<li><a href="/mymods/kotor2mods/"><em>Star Wars: Knights of the Old Republic II: The Sith Lords</em></a></li>
<li><a href="/mymods/kotor1mods/"><cite>Star Wars: Knights of the Old Republic</cite></a></li>
<li><a href="/mymods/kotor2mods/"><cite>Star Wars: Knights of the Old Republic II: The Sith Lords</cite></a></li>
</ul>
<li><a href="/playlists/">Playlists</a></li>
<li><a href="/featured/">Featured</a></li>
@ -63,13 +63,13 @@
</ul>
<li><a href="/shrines/">Shrines</a></li>
<ul>
<li><a href="/shrines/asummersend/"><em>A Summer’s End — Hong Kong 1986</em></a></li>
<li><a href="/shrines/asummersend/"><cite>A Summer’s End — Hong Kong 1986</cite></a></li>
<ul>
<li><a href="/shrines/asummersend/playlists.html">Playlists</a></li>
<li><a href="/shrines/asummersend/trivia.html">Trivia</a></li>
<li><a href="/shrines/asummersend/gallery.html">Gallery</a></li>
</ul>
<li><a href="/shrines/starwarskotor/"><em>Star Wars: Knights of the Old Republic</em></a></li>
<li><a href="/shrines/starwarskotor/"><cite>Star Wars: Knights of the Old Republic</cite></a></li>
<ul>
<li><a href="/shrines/starwarskotor/articles/">Articles</a></li>
<ul>
@ -94,6 +94,7 @@
<li><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>
</ul>
</ul>
<li><a href="/shrines/cassettebeasts/"><cite>Cassette Beasts</cite></a></li>
</ul>
<li><a href="/links/">Links</a></li>
<li><a href="/changelog/">Changelog</a></li>