Added current source code
|
After Width: | Height: | Size: 10 KiB |
|
After Width: | Height: | Size: 3.0 KiB |
|
After Width: | Height: | Size: 570 B |
|
After Width: | Height: | Size: 3.4 KiB |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 3.3 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 456 B |
|
After Width: | Height: | Size: 696 B |
|
After Width: | Height: | Size: 10 KiB |
|
After Width: | Height: | Size: 245 KiB |
|
After Width: | Height: | Size: 904 B |
|
After Width: | Height: | Size: 4.0 KiB |
|
After Width: | Height: | Size: 606 B |
|
After Width: | Height: | Size: 471 B |
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" width="115" height="48"><path fill="#17191E" d="M7.77 36.35C6.4 35.11 6 32.51 6.57 30.62c.99 1.2 2.35 1.57 3.75 1.78 2.18.33 4.31.2 6.33-.78.23-.12.44-.27.7-.42.18.55.23 1.1.17 1.67a4.56 4.56 0 0 1-1.94 3.23c-.43.32-.9.61-1.34.91-1.38.94-1.76 2.03-1.24 3.62l.05.17a3.63 3.63 0 0 1-1.6-1.38 3.87 3.87 0 0 1-.63-2.1c0-.37 0-.74-.05-1.1-.13-.9-.55-1.3-1.33-1.32a1.56 1.56 0 0 0-1.63 1.26c0 .06-.03.12-.05.2Z"/><path fill="url(#a)" d="M7.77 36.35C6.4 35.11 6 32.51 6.57 30.62c.99 1.2 2.35 1.57 3.75 1.78 2.18.33 4.31.2 6.33-.78.23-.12.44-.27.7-.42.18.55.23 1.1.17 1.67a4.56 4.56 0 0 1-1.94 3.23c-.43.32-.9.61-1.34.91-1.38.94-1.76 2.03-1.24 3.62l.05.17a3.63 3.63 0 0 1-1.6-1.38 3.87 3.87 0 0 1-.63-2.1c0-.37 0-.74-.05-1.1-.13-.9-.55-1.3-1.33-1.32a1.56 1.56 0 0 0-1.63 1.26c0 .06-.03.12-.05.2Z"/><path fill="#17191E" d="M.02 30.31s4.02-1.95 8.05-1.95l3.04-9.4c.11-.45.44-.76.82-.76.37 0 .7.31.82.76l3.04 9.4c4.77 0 8.05 1.95 8.05 1.95L17 11.71c-.2-.56-.53-.91-.98-.91H7.83c-.44 0-.76.35-.97.9L.02 30.31Zm42.37-5.97c0 1.64-2.05 2.62-4.88 2.62-1.85 0-2.5-.45-2.5-1.41 0-1 .8-1.49 2.65-1.49 1.67 0 3.09.03 4.73.23v.05Zm.03-2.04a21.37 21.37 0 0 0-4.37-.36c-5.32 0-7.82 1.25-7.82 4.18 0 3.04 1.71 4.2 5.68 4.2 3.35 0 5.63-.84 6.46-2.92h.14c-.03.5-.05 1-.05 1.4 0 1.07.18 1.16 1.06 1.16h4.15a16.9 16.9 0 0 1-.36-4c0-1.67.06-2.93.06-4.62 0-3.45-2.07-5.64-8.56-5.64-2.8 0-5.9.48-8.26 1.19.22.93.54 2.83.7 4.06 2.04-.96 4.95-1.37 7.2-1.37 3.11 0 3.97.71 3.97 2.15v.57Zm11.37 3c-.56.07-1.33.07-2.12.07-.83 0-1.6-.03-2.12-.1l-.02.58c0 2.85 1.87 4.52 8.45 4.52 6.2 0 8.2-1.64 8.2-4.55 0-2.74-1.33-4.09-7.2-4.39-4.58-.2-4.99-.7-4.99-1.28 0-.66.59-1 3.65-1 3.18 0 4.03.43 4.03 1.35v.2a46.13 46.13 0 0 1 4.24.03l.02-.55c0-3.36-2.8-4.46-8.2-4.46-6.08 0-8.13 1.49-8.13 4.39 0 2.6 1.64 4.23 7.48 4.48 4.3.14 4.77.62 4.77 1.28 0 .7-.7 1.03-3.71 1.03-3.47 0-4.35-.48-4.35-1.47v-.13Zm19.82-12.05a17.5 17.5 0 0 1-6.24 3.48c.03.84.03 2.4.03 3.24l1.5.02c-.02 1.63-.04 3.6-.04 4.9 0 3.04 1.6 5.32 6.58 5.32 2.1 0 3.5-.23 5.23-.6a43.77 43.77 0 0 1-.46-4.13c-1.03.34-2.34.53-3.78.53-2 0-2.82-.55-2.82-2.13 0-1.37 0-2.65.03-3.84 2.57.02 5.13.07 6.64.11-.02-1.18.03-2.9.1-4.04-2.2.04-4.65.07-6.68.07l.07-2.93h-.16Zm13.46 6.04a767.33 767.33 0 0 1 .07-3.18H82.6c.07 1.96.07 3.98.07 6.92 0 2.95-.03 4.99-.07 6.93h5.18c-.09-1.37-.11-3.68-.11-5.65 0-3.1 1.26-4 4.12-4 1.33 0 2.28.16 3.1.46.03-1.16.26-3.43.4-4.43-.86-.25-1.81-.41-2.96-.41-2.46-.03-4.26.98-5.1 3.38l-.17-.02Zm22.55 3.65c0 2.5-1.8 3.66-4.64 3.66-2.81 0-4.61-1.1-4.61-3.66s1.82-3.52 4.61-3.52c2.82 0 4.64 1.03 4.64 3.52Zm4.71-.11c0-4.96-3.87-7.18-9.35-7.18-5.5 0-9.23 2.22-9.23 7.18 0 4.94 3.49 7.59 9.21 7.59 5.77 0 9.37-2.65 9.37-7.6Z"/><defs><linearGradient id="a" x1="6.33" x2="19.43" y1="40.8" y2="34.6" gradientUnits="userSpaceOnUse"><stop stop-color="#D83333"/><stop offset="1" stop-color="#F041FF"/></linearGradient></defs></svg>
|
||||
|
After Width: | Height: | Size: 2.8 KiB |
|
After Width: | Height: | Size: 340 KiB |
@@ -0,0 +1,8 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
|
||||
<svg width="800px" height="800px" viewBox="0 -28.5 256 256" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid">
|
||||
<g>
|
||||
<path d="M216.856339,16.5966031 C200.285002,8.84328665 182.566144,3.2084988 164.041564,0 C161.766523,4.11318106 159.108624,9.64549908 157.276099,14.0464379 C137.583995,11.0849896 118.072967,11.0849896 98.7430163,14.0464379 C96.9108417,9.64549908 94.1925838,4.11318106 91.8971895,0 C73.3526068,3.2084988 55.6133949,8.86399117 39.0420583,16.6376612 C5.61752293,67.146514 -3.4433191,116.400813 1.08711069,164.955721 C23.2560196,181.510915 44.7403634,191.567697 65.8621325,198.148576 C71.0772151,190.971126 75.7283628,183.341335 79.7352139,175.300261 C72.104019,172.400575 64.7949724,168.822202 57.8887866,164.667963 C59.7209612,163.310589 61.5131304,161.891452 63.2445898,160.431257 C105.36741,180.133187 151.134928,180.133187 192.754523,160.431257 C194.506336,161.891452 196.298154,163.310589 198.110326,164.667963 C191.183787,168.842556 183.854737,172.420929 176.223542,175.320965 C180.230393,183.341335 184.861538,190.991831 190.096624,198.16893 C211.238746,191.588051 232.743023,181.531619 254.911949,164.955721 C260.227747,108.668201 245.831087,59.8662432 216.856339,16.5966031 Z M85.4738752,135.09489 C72.8290281,135.09489 62.4592217,123.290155 62.4592217,108.914901 C62.4592217,94.5396472 72.607595,82.7145587 85.4738752,82.7145587 C98.3405064,82.7145587 108.709962,94.5189427 108.488529,108.914901 C108.508531,123.290155 98.3405064,135.09489 85.4738752,135.09489 Z M170.525237,135.09489 C157.88039,135.09489 147.510584,123.290155 147.510584,108.914901 C147.510584,94.5396472 157.658606,82.7145587 170.525237,82.7145587 C183.391518,82.7145587 193.761324,94.5189427 193.539891,108.914901 C193.539891,123.290155 183.391518,135.09489 170.525237,135.09489 Z" fill="#5865F2" fill-rule="nonzero">
|
||||
|
||||
</path>
|
||||
</g>
|
||||
|
After Width: | Height: | Size: 2.0 KiB |
@@ -0,0 +1 @@
|
||||
<svg fill="currentColor" xmlns="http://www.w3.org/2000/svg" id="mdi-email-outline" viewBox="0 0 24 24"><path d="M22 6C22 4.9 21.1 4 20 4H4C2.9 4 2 4.9 2 6V18C2 19.1 2.9 20 4 20H20C21.1 20 22 19.1 22 18V6M20 6L12 11L4 6H20M20 18H4V8L12 13L20 8V18Z" /></svg>
|
||||
|
After Width: | Height: | Size: 256 B |
@@ -0,0 +1 @@
|
||||
<svg fill="currentColor" xmlns="http://www.w3.org/2000/svg" id="mdi-twitter" viewBox="0 0 24 24"><path d="M22.46,6C21.69,6.35 20.86,6.58 20,6.69C20.88,6.16 21.56,5.32 21.88,4.31C21.05,4.81 20.13,5.16 19.16,5.36C18.37,4.5 17.26,4 16,4C13.65,4 11.73,5.92 11.73,8.29C11.73,8.63 11.77,8.96 11.84,9.27C8.28,9.09 5.11,7.38 3,4.79C2.63,5.42 2.42,6.16 2.42,6.94C2.42,8.43 3.17,9.75 4.33,10.5C3.62,10.5 2.96,10.3 2.38,10C2.38,10 2.38,10 2.38,10.03C2.38,12.11 3.86,13.85 5.82,14.24C5.46,14.34 5.08,14.39 4.69,14.39C4.42,14.39 4.15,14.36 3.89,14.31C4.43,16 6,17.26 7.89,17.29C6.43,18.45 4.58,19.13 2.56,19.13C2.22,19.13 1.88,19.11 1.54,19.07C3.44,20.29 5.7,21 8.12,21C16,21 20.33,14.46 20.33,8.79C20.33,8.6 20.33,8.42 20.32,8.23C21.16,7.63 21.88,6.87 22.46,6Z" /></svg>
|
||||
|
After Width: | Height: | Size: 758 B |
@@ -0,0 +1 @@
|
||||
<svg fill="currentColor" xmlns="http://www.w3.org/2000/svg" id="mdi-clock-outline" viewBox="0 0 24 24"><path d="M12,20A8,8 0 0,0 20,12A8,8 0 0,0 12,4A8,8 0 0,0 4,12A8,8 0 0,0 12,20M12,2A10,10 0 0,1 22,12A10,10 0 0,1 12,22C6.47,22 2,17.5 2,12A10,10 0 0,1 12,2M12.5,7V12.25L17,14.92L16.25,16.15L11,13V7H12.5Z" /></svg>
|
||||
|
After Width: | Height: | Size: 316 B |
@@ -0,0 +1 @@
|
||||
<svg fill="currentColor" xmlns="http://www.w3.org/2000/svg" id="mdi-help-circle-outline" viewBox="0 0 24 24"><path d="M11,18H13V16H11V18M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20,12C20,16.41 16.41,20 12,20M12,6A4,4 0 0,0 8,10H10A2,2 0 0,1 12,8A2,2 0 0,1 14,10C14,12 11,11.75 11,15H13C13,12.75 16,12.5 16,10A4,4 0 0,0 12,6Z" /></svg>
|
||||
|
After Width: | Height: | Size: 430 B |
@@ -0,0 +1 @@
|
||||
<svg fill="currentColor" xmlns="http://www.w3.org/2000/svg" id="mdi-sine-wave" viewBox="0 0 24 24"><path d="M16.5,21C13.5,21 12.31,16.76 11.05,12.28C10.14,9.04 9,5 7.5,5C4.11,5 4,11.93 4,12H2C2,11.63 2.06,3 7.5,3C10.5,3 11.71,7.25 12.97,11.74C13.83,14.8 15,19 16.5,19C19.94,19 20.03,12.07 20.03,12H22.03C22.03,12.37 21.97,21 16.5,21Z" /></svg>
|
||||
|
After Width: | Height: | Size: 343 B |
@@ -0,0 +1 @@
|
||||
<svg fill="currentColor" xmlns="http://www.w3.org/2000/svg" id="mdi-thermometer" viewBox="0 0 24 24"><path d="M15 13V5A3 3 0 0 0 9 5V13A5 5 0 1 0 15 13M12 4A1 1 0 0 1 13 5V8H11V5A1 1 0 0 1 12 4Z" /></svg>
|
||||
|
After Width: | Height: | Size: 204 B |
@@ -0,0 +1 @@
|
||||
<svg fill="currentColor" xmlns="http://www.w3.org/2000/svg" id="mdi-water-outline" viewBox="0 0 24 24"><path d="M12,3.77L11.25,4.61C11.25,4.61 9.97,6.06 8.68,7.94C7.39,9.82 6,12.07 6,14.23A6,6 0 0,0 12,20.23A6,6 0 0,0 18,14.23C18,12.07 16.61,9.82 15.32,7.94C14.03,6.06 12.75,4.61 12.75,4.61L12,3.77M12,6.9C12.44,7.42 12.84,7.85 13.68,9.07C14.89,10.83 16,13.07 16,14.23C16,16.45 14.22,18.23 12,18.23C9.78,18.23 8,16.45 8,14.23C8,13.07 9.11,10.83 10.32,9.07C11.16,7.85 11.56,7.42 12,6.9Z" /></svg>
|
||||
|
After Width: | Height: | Size: 495 B |
@@ -0,0 +1 @@
|
||||
<svg fill="currentColor" xmlns="http://www.w3.org/2000/svg" id="mdi-white-balance-sunny" viewBox="0 0 24 24"><path d="M3.55 19.09L4.96 20.5L6.76 18.71L5.34 17.29M12 6C8.69 6 6 8.69 6 12S8.69 18 12 18 18 15.31 18 12C18 8.68 15.31 6 12 6M20 13H23V11H20M17.24 18.71L19.04 20.5L20.45 19.09L18.66 17.29M20.45 5L19.04 3.6L17.24 5.39L18.66 6.81M13 1H11V4H13M6.76 5.39L4.96 3.6L3.55 5L5.34 6.81L6.76 5.39M1 13H4V11H1M13 20H11V23H13" /></svg>
|
||||
|
After Width: | Height: | Size: 433 B |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 9.2 KiB |
|
After Width: | Height: | Size: 6.7 MiB |
@@ -0,0 +1,248 @@
|
||||
// oneko.js: https://github.com/adryd325/oneko.js
|
||||
|
||||
(function oneko() {
|
||||
const isReducedMotion =
|
||||
window.matchMedia(`(prefers-reduced-motion: reduce)`) === true ||
|
||||
window.matchMedia(`(prefers-reduced-motion: reduce)`).matches === true;
|
||||
|
||||
if (isReducedMotion) return;
|
||||
|
||||
const nekoEl = document.createElement("div");
|
||||
|
||||
let nekoPosX = 32;
|
||||
let nekoPosY = 32;
|
||||
|
||||
let mousePosX = 0;
|
||||
let mousePosY = 0;
|
||||
|
||||
let frameCount = 0;
|
||||
let idleTime = 0;
|
||||
let idleAnimation = null;
|
||||
let idleAnimationFrame = 0;
|
||||
|
||||
const nekoSpeed = 10;
|
||||
const spriteSets = {
|
||||
idle: [[0, 0]],
|
||||
alert: [[0, 0]],
|
||||
scratchSelf: [
|
||||
[0, 0],
|
||||
[0, 0],
|
||||
[0, 0],
|
||||
],
|
||||
scratchWallN: [
|
||||
[0, 0],
|
||||
[0, 0],
|
||||
],
|
||||
scratchWallS: [
|
||||
[0, 0],
|
||||
[0, 0],
|
||||
],
|
||||
scratchWallE: [
|
||||
[0, 0],
|
||||
[0, 0],
|
||||
],
|
||||
scratchWallW: [
|
||||
[0, 0],
|
||||
[0, 0],
|
||||
],
|
||||
tired: [[0, 0]],
|
||||
sleeping: [
|
||||
[0, 0],
|
||||
[0, 0],
|
||||
],
|
||||
N: [
|
||||
[0, 0],
|
||||
[0, 0],
|
||||
],
|
||||
NE: [
|
||||
[0, 0],
|
||||
[0, 0],
|
||||
],
|
||||
E: [
|
||||
[0, 0],
|
||||
[0, 0],
|
||||
],
|
||||
SE: [
|
||||
[0, 0],
|
||||
[0, 0],
|
||||
],
|
||||
S: [
|
||||
[0, 0],
|
||||
[0, 0],
|
||||
],
|
||||
SW: [
|
||||
[0, 0],
|
||||
[0, 0],
|
||||
],
|
||||
W: [
|
||||
[0, 0],
|
||||
[0, 0],
|
||||
],
|
||||
NW: [
|
||||
[0, 0],
|
||||
[0, 0],
|
||||
],
|
||||
};
|
||||
|
||||
function init() {
|
||||
nekoEl.id = "oneko";
|
||||
nekoEl.ariaHidden = true;
|
||||
//nekoEl.style.width = "32px";
|
||||
//nekoEl.style.height = "32px";
|
||||
nekoEl.style.position = "fixed";
|
||||
nekoEl.style.pointerEvents = "none";
|
||||
nekoEl.style.imageRendering = "pixelated";
|
||||
//nekoEl.style.left = `${nekoPosX - 16}px`;
|
||||
//nekoEl.style.top = `${nekoPosY - 16}px`;
|
||||
nekoEl.style.zIndex = 2147483647;
|
||||
|
||||
nekoEl.style.width = "50px";
|
||||
nekoEl.style.height = "45px";
|
||||
nekoEl.style.left = `${nekoPosX - 16}px`;
|
||||
nekoEl.style.top = `${nekoPosY - 16}px`;
|
||||
//nekoEl.style.left = `0px`;
|
||||
//nekoEl.style.top = `0px`;
|
||||
|
||||
//let nekoFile = "/public/oneko.gif"
|
||||
let nekoFile = "/assets/lain-dance.gif"
|
||||
const curScript = document.currentScript
|
||||
if (curScript && curScript.dataset.cat) {
|
||||
nekoFile = curScript.dataset.cat
|
||||
}
|
||||
nekoEl.style.backgroundImage = `url(${nekoFile})`;
|
||||
|
||||
document.body.appendChild(nekoEl);
|
||||
|
||||
document.addEventListener("mousemove", function (event) {
|
||||
mousePosX = event.clientX;
|
||||
mousePosY = event.clientY;
|
||||
});
|
||||
|
||||
window.requestAnimationFrame(onAnimationFrame);
|
||||
}
|
||||
|
||||
let lastFrameTimestamp;
|
||||
|
||||
function onAnimationFrame(timestamp) {
|
||||
// Stops execution if the neko element is removed from DOM
|
||||
if (!nekoEl.isConnected) {
|
||||
return;
|
||||
}
|
||||
if (!lastFrameTimestamp) {
|
||||
lastFrameTimestamp = timestamp;
|
||||
}
|
||||
if (timestamp - lastFrameTimestamp > 100) {
|
||||
lastFrameTimestamp = timestamp
|
||||
frame()
|
||||
}
|
||||
window.requestAnimationFrame(onAnimationFrame);
|
||||
}
|
||||
|
||||
function setSprite(name, frame) {
|
||||
const sprite = spriteSets[name][frame % spriteSets[name].length];
|
||||
nekoEl.style.backgroundPosition = `${sprite[0] * 32}px ${sprite[1] * 32}px`;
|
||||
}
|
||||
|
||||
function resetIdleAnimation() {
|
||||
idleAnimation = null;
|
||||
idleAnimationFrame = 0;
|
||||
}
|
||||
|
||||
function idle() {
|
||||
idleTime += 1;
|
||||
|
||||
// every ~ 20 seconds
|
||||
if (
|
||||
idleTime > 10 &&
|
||||
Math.floor(Math.random() * 200) == 0 &&
|
||||
idleAnimation == null
|
||||
) {
|
||||
let avalibleIdleAnimations = ["sleeping", "scratchSelf"];
|
||||
if (nekoPosX < 32) {
|
||||
avalibleIdleAnimations.push("scratchWallW");
|
||||
}
|
||||
if (nekoPosY < 32) {
|
||||
avalibleIdleAnimations.push("scratchWallN");
|
||||
}
|
||||
if (nekoPosX > window.innerWidth - 32) {
|
||||
avalibleIdleAnimations.push("scratchWallE");
|
||||
}
|
||||
if (nekoPosY > window.innerHeight - 32) {
|
||||
avalibleIdleAnimations.push("scratchWallS");
|
||||
}
|
||||
idleAnimation =
|
||||
avalibleIdleAnimations[
|
||||
Math.floor(Math.random() * avalibleIdleAnimations.length)
|
||||
];
|
||||
}
|
||||
|
||||
switch (idleAnimation) {
|
||||
case "sleeping":
|
||||
if (idleAnimationFrame < 8) {
|
||||
setSprite("tired", 0);
|
||||
break;
|
||||
}
|
||||
setSprite("sleeping", Math.floor(idleAnimationFrame / 4));
|
||||
if (idleAnimationFrame > 192) {
|
||||
resetIdleAnimation();
|
||||
}
|
||||
break;
|
||||
case "scratchWallN":
|
||||
case "scratchWallS":
|
||||
case "scratchWallE":
|
||||
case "scratchWallW":
|
||||
case "scratchSelf":
|
||||
setSprite(idleAnimation, idleAnimationFrame);
|
||||
if (idleAnimationFrame > 9) {
|
||||
resetIdleAnimation();
|
||||
}
|
||||
break;
|
||||
default:
|
||||
setSprite("idle", 0);
|
||||
return;
|
||||
}
|
||||
idleAnimationFrame += 1;
|
||||
}
|
||||
|
||||
function frame() {
|
||||
frameCount += 1;
|
||||
const diffX = nekoPosX - mousePosX;
|
||||
const diffY = nekoPosY - mousePosY;
|
||||
const distance = Math.sqrt(diffX ** 2 + diffY ** 2);
|
||||
|
||||
if (distance < nekoSpeed || distance < 48) {
|
||||
idle();
|
||||
return;
|
||||
}
|
||||
|
||||
idleAnimation = null;
|
||||
idleAnimationFrame = 0;
|
||||
|
||||
if (idleTime > 1) {
|
||||
setSprite("alert", 0);
|
||||
// count down after being alerted before moving
|
||||
idleTime = Math.min(idleTime, 7);
|
||||
idleTime -= 1;
|
||||
return;
|
||||
}
|
||||
|
||||
let direction;
|
||||
direction = diffY / distance > 0.5 ? "N" : "";
|
||||
direction += diffY / distance < -0.5 ? "S" : "";
|
||||
direction += diffX / distance > 0.5 ? "W" : "";
|
||||
direction += diffX / distance < -0.5 ? "E" : "";
|
||||
setSprite(direction, frameCount);
|
||||
|
||||
nekoPosX -= (diffX / distance) * nekoSpeed;
|
||||
nekoPosY -= (diffY / distance) * nekoSpeed;
|
||||
|
||||
nekoPosX = Math.min(Math.max(16, nekoPosX), window.innerWidth - 16);
|
||||
nekoPosY = Math.min(Math.max(16, nekoPosY), window.innerHeight - 16);
|
||||
|
||||
nekoEl.style.left = `${nekoPosX - 16}px`;
|
||||
nekoEl.style.top = `${nekoPosY - 16}px`;
|
||||
}
|
||||
|
||||
init();
|
||||
})();
|
||||
|
||||
|
After Width: | Height: | Size: 10 KiB |
|
After Width: | Height: | Size: 9.2 KiB |
@@ -0,0 +1,4 @@
|
||||
/* styles.css */
|
||||
p {
|
||||
margin-bottom: 0; /* Remove default bottom margin from <p> elements */
|
||||
}
|
||||
|
After Width: | Height: | Size: 170 KiB |
|
After Width: | Height: | Size: 606 B |
|
After Width: | Height: | Size: 54 KiB |
|
After Width: | Height: | Size: 73 KiB |
|
After Width: | Height: | Size: 330 B |
@@ -0,0 +1,412 @@
|
||||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Hojuix</title>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"
|
||||
/>
|
||||
<link rel="stylesheet" href="/style.css" />
|
||||
<style>
|
||||
p {
|
||||
font-family: 'Courier New', monospace;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<!-- Oneko.js -->
|
||||
<script src="/assets/oneko.js"></script>
|
||||
|
||||
<div align="center">
|
||||
|
||||
<table class="mainBox" style="width: 95%">
|
||||
<tbody>
|
||||
|
||||
<!-- Left Sidebar -->
|
||||
<td class="sidebar">
|
||||
<div class="contentBox">
|
||||
<p align="center" style="padding-bottom: 5px; color: MediumSlateBlue; font-size: 18px;">
|
||||
<u>Navigation</u>
|
||||
</p>
|
||||
|
||||
<!-- Project links -->
|
||||
<p style="color: CornflowerBlue;">
|
||||
<u>Projects</u>
|
||||
</p>
|
||||
<ul style="margin: 0;">
|
||||
<li>
|
||||
<p>
|
||||
<a class="linknotvalid" href="/pages/project_ossp">OSSP</a>
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>
|
||||
<a class="linknotvalid" href="/pages/project_desk_clock">Desk Clock</a>
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>
|
||||
<a class="linknotvalid" href="/pages/project_hojuix_krnl">Hojuix Kernel</a>
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>
|
||||
<a href="/pages/project_seabios">SeaBIOS Fork</a>
|
||||
</p>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<!-- Recipes links -->
|
||||
<p style="color: CornflowerBlue;">
|
||||
<u>Recipes</u>
|
||||
</p>
|
||||
<ul style="margin: 0;">
|
||||
<li>
|
||||
<p>
|
||||
<a class="linknotvalid" href="/pages/recipe_moist_pancakes">Moist pancakes</a>
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>
|
||||
<a class="linknotvalid" href="/pages/scuffed_jjajangmyeon">Scuffed 짜장면</a>
|
||||
</p>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<!-- Photos links -->
|
||||
<p style="color: CornflowerBlue;">
|
||||
<u>Photos</u>
|
||||
</p>
|
||||
<ul style="margin: 0;">
|
||||
<li>
|
||||
<p>
|
||||
<a class="linknotvalid" href="/pages/photos_korea2024">Korea 2024</a>
|
||||
</p>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="contentBox">
|
||||
<p align="center" style="padding-bottom: 5px; color: MediumSlateBlue; font-size: 18px;">
|
||||
<u>My weather</u>
|
||||
</p>
|
||||
<div id="weatherInfo">
|
||||
<img style="width: 32px; height: 32px;" src="/assets/weather/sunny-4x.png" />
|
||||
<p id="weather_c"></p>
|
||||
<p id="weather_humidity"></p>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
|
||||
|
||||
<!-- Main Content -->
|
||||
<td class="innerBox" style="width: 65%">
|
||||
<div class="contentBox">
|
||||
<p style="font-size: 18px">
|
||||
welcome :3<br>
|
||||
Hello, i'm Goldenkrew3000, and welcome to my website!<br>
|
||||
Some facts about me:
|
||||
</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p style="font-size: 18px">
|
||||
I am 21
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p style="font-size: 18px">
|
||||
I live in Queensland, Australia (unfortunately)
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p style="font-size: 18px">
|
||||
My native language is English, and I know a little Korean
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p style="font-size: 18px">
|
||||
My primary programming language is C
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p style="font-size: 18px">
|
||||
I love cooking/baking, even if I don't do it too often
|
||||
</p>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<p style="font-size: 18px">
|
||||
If you want to contact me, you can at:
|
||||
</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p>Twitter</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Discord</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Telegram</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Signal</p>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<p style="font-size: 18px">
|
||||
On the projects panel, you can find multiple of my projects (Both completed
|
||||
and in-progress). If the link is red, it means that the page has not yet been
|
||||
created.<br>
|
||||
EDIT: I have not had much time lately, and the SeaBIOS Fork page is also incomplete. It's in the middle of rewriting so sections are duplicated. Don't bother at this time basically.
|
||||
</p>
|
||||
</div>
|
||||
</td>
|
||||
|
||||
<!-- Right Sidebar -->
|
||||
<td class="sidebar">
|
||||
<!-- Oomfies list :3 -->
|
||||
<div class="contentBox">
|
||||
<p align="center" style="padding-bottom: 5px; color: MediumSlateBlue; font-size: 18px;">
|
||||
<u>Oomfs</u>
|
||||
</p>
|
||||
|
||||
<ul style="margin: 0;">
|
||||
<li>
|
||||
<p>
|
||||
<a href="https://nsg650.github.io/">
|
||||
NSG650
|
||||
</a>
|
||||
</p>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<p>
|
||||
<a href="https://x.com/whatdahopper">
|
||||
whatdahopper
|
||||
</a>
|
||||
</p>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<p>
|
||||
<a href="https://mnux.xyz">
|
||||
mnux
|
||||
</a>
|
||||
</p>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<p>
|
||||
<a href="https://sarascafe.lenowo.org/">
|
||||
saraaa7447
|
||||
</a>
|
||||
</p>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<p>
|
||||
<a href="https://averageun1x.neocities.org/">
|
||||
averageun1x
|
||||
</a>
|
||||
</p>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="contentBox">
|
||||
<p align="center" style="padding-bottom: 5px; color: MediumSlateBlue; font-size: 18px;">
|
||||
<u>Music</u>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="contentBox">
|
||||
<p align="center" style="padding-bottom: 5px; color: MediumSlateBlue; font-size: 18px;">
|
||||
<u>Visitors</u>
|
||||
</p>
|
||||
</div>
|
||||
</td>
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<!-- 8831 Footer -->
|
||||
<div class="eeto-footer">
|
||||
<a href="https://diyhrt.wiki/">
|
||||
<img src="/assets/8831/e2v2-88x31.gif" />
|
||||
</a>
|
||||
|
||||
<a href="/taegukgi">
|
||||
<img src="/assets/8831/taegukgi-8831.png" />
|
||||
</a>
|
||||
|
||||
<a href="https://www.debian.org/">
|
||||
<img src="/assets/8831/powered-by-debian.gif" />
|
||||
</a>
|
||||
|
||||
<a href="https://www.noaa.gov/">
|
||||
<img src="/assets/8831/noaa.gif" />
|
||||
</a>
|
||||
|
||||
<a href="https://grapheneos.org/">
|
||||
<img src="/assets/8831/grapheneos.gif" />
|
||||
</a>
|
||||
|
||||
<a href="https://en.wikipedia.org/wiki/ISO_8601">
|
||||
<img src="/assets/8831/iso8601.jpg" />
|
||||
</a>
|
||||
|
||||
<a href="/assets/bnuuycake.png">
|
||||
<img src="/assets/8831/iamverygay.png" />
|
||||
</a>
|
||||
|
||||
<a href="https://sarascafe.lenowo.org/">
|
||||
<img src="/assets/8831/sarascafe.gif" />
|
||||
</a>
|
||||
|
||||
<a href="https://fauux.neocities.org/">
|
||||
<img src="/assets/8831/lain.gif" />
|
||||
</a>
|
||||
|
||||
<a href="https://maia.crimew.gay/">
|
||||
<img src="/assets/8831/maia.crimew.gay.png" />
|
||||
</a>
|
||||
|
||||
<a href="https://www.ccc.de/en/">
|
||||
<img src="/assets/8831/39C3_88x31.gif" />
|
||||
</a>
|
||||
|
||||
<a href="https://www.coreboot.org/">
|
||||
<img src="/assets/8831/coreboot.png" />
|
||||
</a>
|
||||
|
||||
<a href="https://kernel.org/">
|
||||
<img src="/assets/8831/madeonlinux.png" />
|
||||
</a>
|
||||
|
||||
<a href="https://www.youtube.com/watch?v=H2kdPzjbTkw">
|
||||
<img src="/assets/8831/gay.gif" />
|
||||
</a>
|
||||
|
||||
<a href="https://archlinux.org/">
|
||||
<img src="/assets/8831/arch.gif" />
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
|
||||
<style>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
.sns-section {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.sns-icon {
|
||||
filter: brightness(0) invert(100%);
|
||||
}
|
||||
|
||||
.sns-text {
|
||||
color: white;
|
||||
font-family: "DOS";
|
||||
font-size: 16px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.general-text {
|
||||
color: white;
|
||||
font-family: "DOS";
|
||||
font-size: 20px;
|
||||
}
|
||||
.title-text {
|
||||
color: mediumpurple;
|
||||
font-family: "DOS";
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
<script>
|
||||
let engMode = 1;
|
||||
|
||||
function getWeather() {
|
||||
var xhr = new XMLHttpRequest();
|
||||
xhr.open("GET", "https://api.hojuix.org/v1/weather/neighbor", true);
|
||||
xhr.responseType = 'json';
|
||||
xhr.onload = function() {
|
||||
if (xhr.status === 200) {
|
||||
let weatherJson = xhr.response;
|
||||
console.log(weatherJson);
|
||||
|
||||
// Format weather
|
||||
if (engMode == 1) {
|
||||
let temp_c = weatherJson["temp_c"] + " °C (" + weatherJson["temp_f"] + " °F)";
|
||||
let humidity = weatherJson["humidity"] + " %";
|
||||
let brightness = "Brightness: " + weatherJson["lux"] + " lx";
|
||||
let uv = "UV Index: " + weatherJson["uvi"] + " (UV: " + weatherJson["uv"] + ")";
|
||||
let last_updated = "Last updated: "
|
||||
document.getElementById("weather_c").innerHTML=temp_c;
|
||||
document.getElementById("weather_humidity").innerHTML=humidity;
|
||||
document.getElementById("weather_lux").innerHTML=brightness;
|
||||
document.getElementById("weather_uv").innerHTML=uv;
|
||||
} else {
|
||||
let temp_c = "섭씨: " + weatherJson["temp_c"] + " °C (" + weatherJson["temp_f"] + " °F)";
|
||||
let humidity = "습도: " + weatherJson["humidity"] + " %";
|
||||
let brightness = "밝기: " + weatherJson["lux"] + " lx";
|
||||
let uv = "UV Index: " + weatherJson["uvi"] + " (UV: " + weatherJson["uv"] + ")";
|
||||
let last_updated = "마지막 업데이트: ?"
|
||||
document.getElementById("weather_title").innerHTML="나의 날씨"
|
||||
document.getElementById("weather_lastupdated").innerHTML=last_updated;
|
||||
document.getElementById("weather_c").innerHTML=temp_c;
|
||||
document.getElementById("weather_humidity").innerHTML=humidity;
|
||||
document.getElementById("weather_lux").innerHTML=brightness;
|
||||
document.getElementById("weather_uv").innerHTML=uv;
|
||||
}
|
||||
}
|
||||
}
|
||||
xhr.send();
|
||||
}
|
||||
|
||||
function formatWeather() {
|
||||
//
|
||||
}
|
||||
|
||||
function weatherHelp() {
|
||||
alert("Thanks to my neighbor's (probable) non-knowledge of my actions, and with the help of rtl433, here is my current weather :)");
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
getWeather();
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,9 @@
|
||||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Hojuix</title>
|
||||
</head>
|
||||
<body>
|
||||
<a href="https://hojuix.org">Hojuix Homepage</a>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,4 @@
|
||||
<!doctype html>
|
||||
<html>
|
||||
/
|
||||
</html>
|
||||
@@ -0,0 +1,211 @@
|
||||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Hojuix</title>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"
|
||||
/>
|
||||
<link rel="stylesheet" href="/style.css" />
|
||||
<style>
|
||||
p {
|
||||
font-family: 'Courier New', monospace;
|
||||
}
|
||||
|
||||
.contentBox {
|
||||
/* Override padding to add more padding to the sides */
|
||||
/* Was too close for comfort, kinda felt claustrophobic */
|
||||
padding-left: 25px;
|
||||
padding-right: 25px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div align="center">
|
||||
|
||||
<table class="mainBox" style="width: 95%">
|
||||
<tbody>
|
||||
<td class="innerBox">
|
||||
<div class="contentBox">
|
||||
|
||||
<p align="center" style="font-size: 32px; color: CornflowerBlue;">
|
||||
<u>SeaBIOS Fork</u>
|
||||
</p><br>
|
||||
|
||||
<p style="font-size: 18px;">
|
||||
This is basically some notes on my personal fork of SeaBIOS, along with explanations
|
||||
on certain design choices I made.
|
||||
</p><br>
|
||||
|
||||
<p style="font-size: 20px; color: MediumSlateBlue;">
|
||||
<u>
|
||||
General information
|
||||
</u>
|
||||
</p>
|
||||
|
||||
<p style="padding-left: 20px; padding-bottom: 10px; font-size: 18px;">
|
||||
Please keep in mind that this is my personal fork of SeaBIOS, and is not intended
|
||||
for other people to use.<br>
|
||||
Although, if you so choose to, I am not going to stop you ;)<br>
|
||||
Also, this SeaBIOS fork is both intended to, and has only been tested in use as
|
||||
a payload for Coreboot (QEMU x86_64, Thinkpad T460s).<br>
|
||||
If you are interested in either using this, or just want to see the commits/code,
|
||||
it is located
|
||||
<a href="https://github.com/goldenkrew3000/SeaBIOS" style="color: MediumPurple;">
|
||||
here (clickable).
|
||||
</a><br>
|
||||
|
||||
</p>
|
||||
|
||||
<ul style="padding-left: 20px">
|
||||
<li style="color: MediumSlateBlue;"> <!-- Setting color here sets the point color -->
|
||||
<p style="font-size: 20px; color: MediumSlateBlue;">
|
||||
<u>
|
||||
Change 1 - Security through Obscurity
|
||||
</u>
|
||||
</p>
|
||||
</li>
|
||||
<p style="padding-left: 20px; font-size: 18px;">
|
||||
Now, before you even think it: Yes, I know security through obscurity is
|
||||
objectively a terrible method if done alone.<br>
|
||||
This change involves two subchanges, which are configurable rebranding
|
||||
and hiding the boot menu key respectively.<br>
|
||||
|
||||
<ul>
|
||||
<!-- list-style-type allows filled bullet while nested -->
|
||||
<li style="color: MediumSlateBlue; list-style-type: disc;">
|
||||
<p style="font-size: 18px; color: MediumSlateBlue;">
|
||||
<u>
|
||||
Configurable Rebranding
|
||||
</u>
|
||||
</p>
|
||||
</li>
|
||||
<p style="padding-left: 20px; font-size: 18px;">
|
||||
All SeaBIOS branding can be changed at compile time using the precompiler
|
||||
to use custom branding strings defined in the configuration as to hide
|
||||
what the actual bootloader is. Eventually, I want to have this change to
|
||||
the extent that a theoretical attacker could pull the binary, pull every
|
||||
string from it, and find nothing that is identifiable as SeaBIOS.
|
||||
</p>
|
||||
|
||||
<li style="color: MediumSlateBlue; list-style-type: disc;">
|
||||
<p style="font-size: 18px; color: MediumSlateBlue;">
|
||||
<u>
|
||||
Hiding the boot menu key
|
||||
</u>
|
||||
</p>
|
||||
</li>
|
||||
<p style="padding-left: 20px; font-size: 18px;">
|
||||
When SeaBIOS reaches to the boot menu, a message is displayed to press
|
||||
a key (By default, ESC) to enter the boot menu. This change allows
|
||||
changing both the boot key and boot menu message from the configuration
|
||||
at compile time. This is not extremely helpful in it's current state, as it
|
||||
does not greatly increase security as a theoretical attacker could just
|
||||
spam every key on the keyboard until success. Although this could be
|
||||
changed in the future to potentially require a key combination instead
|
||||
(or even a password), greatly increasing the difficulty of booting
|
||||
potentially malicious boot media.
|
||||
</p>
|
||||
</ul>
|
||||
</p>
|
||||
|
||||
<br>
|
||||
|
||||
<li style="color: MediumSlateBlue;">
|
||||
<p style="font-size: 20px; color: MediumSlateBlue;">
|
||||
<u>
|
||||
Change 2 - Configurable Pre-Delay and the removal of the native bootsplash
|
||||
implementation
|
||||
</u>
|
||||
</p>
|
||||
</li>
|
||||
<p style="padding-left: 20px; font-size: 18px;">
|
||||
First, I removed SeaBIOS's native implementation for displaying a bootsplash image,
|
||||
as I could not get it to function.<br>
|
||||
I also figured that the less code running, the better.<br>
|
||||
Although, I still wanted a bootsplash, which leads me into my second point.<br>
|
||||
I added a configurable pre-delay that delays SeaBIOS's clearing of the framebuffer
|
||||
by a predetermined amount of milliseconds.<br>
|
||||
This allows a set amount of time for Coreboot's bootsplash implementation to
|
||||
display a boot image before displaying the boot manager.
|
||||
|
||||
|
||||
So, I removed SeaBIOS's native implementation for displaying a bootsplash image,
|
||||
as I could not get it to function (Probably due to my inability to get the
|
||||
original configuration method to work, as talked about in Change 4). Although, I
|
||||
still wanted a bootsplash, and Coreboot's native implementation worked really well.
|
||||
I also removed SeaBIOS's implementation to remove the possibility that at some point
|
||||
on some random firmware revision that it would just start working, and I would
|
||||
end up with two bootsplash sequences.
|
||||
|
||||
|
||||
Now, this introduces an issue: SeaBIOS doesn't have any method to play nicely
|
||||
with Coreboot's bootsplash. So to solve this, I have added a pre-delay option
|
||||
into SeaBIOS's configuration to allow the user to set a variable delay in
|
||||
milliseconds just before SeaBIOS clears the framebuffer, allowing time for
|
||||
Coreboot's bootsplash to display.
|
||||
</p>
|
||||
|
||||
<br>
|
||||
|
||||
<li style="color: MediumSlateBlue;">
|
||||
<p style="font-size: 20px; color: MediumSlateBlue;">
|
||||
<u>
|
||||
Change 3 - TPM support removed
|
||||
</u>
|
||||
</p>
|
||||
</li>
|
||||
<p style="padding-left: 20px; font-size: 18px;">
|
||||
This might seem like a weird change, even more so considering that I live in
|
||||
a country that doesn't restrict the use of TPMs (Currently, anyway).
|
||||
Personally, I believe that all highly regarded secrets (Encryption keys, etc)
|
||||
should be held either solely in your brain, or physically written down in
|
||||
an encoded form. The TPM functionality in SeaBIOS contains a non-inconsequential
|
||||
amount of code, that while it probably doesn't contain exploits, I don't use
|
||||
it so I might as well remove it to lower the risk anyway.
|
||||
</p>
|
||||
|
||||
<br>
|
||||
|
||||
<li style="color: MediumSlateBlue;">
|
||||
<p style="font-size: 20px; color: MediumSlateBlue;">
|
||||
<u>
|
||||
Change 4 - New configuration scheme
|
||||
</u>
|
||||
</p>
|
||||
</li>
|
||||
<p style="padding-left: 20px; font-size: 18px;">
|
||||
This is by far the largest change in this fork.<br>
|
||||
Instead of SeaBIOS being configured through a file-based scheme from CBFS,
|
||||
it is now configured in a header file before compilation.<br>
|
||||
I did this because personally I found configuring SeaBIOS to be extremely
|
||||
confusing, and I couldn't even get it to work properly.<br>
|
||||
The new configuration file is in src/rf_config.h.<br>
|
||||
Now, you might ask, why rf_config.h. Well, it's name comes from the previous
|
||||
functions used to fetch configuration values, which were romfile_*().<br>
|
||||
</p>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
</td>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<!-- Add some information on the bottom left and right outside the box -->
|
||||
<div style="width: 95%">
|
||||
<p align="left" style="display: inline-block; width: 33%">
|
||||
Document version 1
|
||||
</p>
|
||||
<p align="center" style="display: inline-block; width: 33%">
|
||||
Copyright (C) Goldenkrew3000 2026
|
||||
</p>
|
||||
<p align="right" style="display: inline-block; width: 33%">
|
||||
Last edited 2026/02/21
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,9 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 128 128">
|
||||
<path d="M50.4 78.5a75.1 75.1 0 0 0-28.5 6.9l24.2-65.7c.7-2 1.9-3.2 3.4-3.2h29c1.5 0 2.7 1.2 3.4 3.2l24.2 65.7s-11.6-7-28.5-7L67 45.5c-.4-1.7-1.6-2.8-2.9-2.8-1.3 0-2.5 1.1-2.9 2.7L50.4 78.5Zm-1.1 28.2Zm-4.2-20.2c-2 6.6-.6 15.8 4.2 20.2a17.5 17.5 0 0 1 .2-.7 5.5 5.5 0 0 1 5.7-4.5c2.8.1 4.3 1.5 4.7 4.7.2 1.1.2 2.3.2 3.5v.4c0 2.7.7 5.2 2.2 7.4a13 13 0 0 0 5.7 4.9v-.3l-.2-.3c-1.8-5.6-.5-9.5 4.4-12.8l1.5-1a73 73 0 0 0 3.2-2.2 16 16 0 0 0 6.8-11.4c.3-2 .1-4-.6-6l-.8.6-1.6 1a37 37 0 0 1-22.4 2.7c-5-.7-9.7-2-13.2-6.2Z" />
|
||||
<style>
|
||||
path { fill: #000; }
|
||||
@media (prefers-color-scheme: dark) {
|
||||
path { fill: #FFF; }
|
||||
}
|
||||
</style>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 749 B |
|
After Width: | Height: | Size: 3.2 KiB |
@@ -0,0 +1,69 @@
|
||||
.mainBox {
|
||||
/*width: 1200px;*/
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.innerBox {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
width: 3000px;
|
||||
vertical-align: baseline; /* Align to top of box */
|
||||
}
|
||||
|
||||
.contentBox {
|
||||
vertical-align: baseline;
|
||||
padding: 10px; /* Internal padding */
|
||||
margin-bottom: 4px;
|
||||
border: 2px solid #828282;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.navbar {
|
||||
}
|
||||
|
||||
p, li {
|
||||
color: white;
|
||||
margin: 0; /* Not sure where the margining issue is coming from, and it only affects <p> */
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none; /* Hide underlines on <a href> */
|
||||
color: white;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* (E)ighty (E)ight (T)hirty (O)ne (88x31) footer */
|
||||
.eeto-footer {
|
||||
width: 800px;
|
||||
margin-top: 10px;
|
||||
image-rendering: pixelated;
|
||||
image-rendering: crisp-edges;
|
||||
}
|
||||
|
||||
/* Background */
|
||||
body {
|
||||
/* Not sure whether I like the repeating background or not */
|
||||
/* They both look so good ㅠㅠ */
|
||||
background-image: url("./assets/star_bg_25speed.gif");
|
||||
/* background-repeat: no-repeat; */
|
||||
/* background-size: cover; */
|
||||
/* background-position: center; */
|
||||
|
||||
/* Make background not blurry */
|
||||
image-rendering: pixelated;
|
||||
image-rendering: -webkit-optimize-contrast;
|
||||
image-rendering: crisp-edges;
|
||||
|
||||
/* Add contrast between the background and foreground to make text more legible */
|
||||
background-color: rgba(0, 0, 0, 0.7);
|
||||
background-blend-mode: darken;
|
||||
}
|
||||
|
||||
.linknotvalid {
|
||||
color: red;
|
||||
}
|
||||