Add Code Guard image, Add mr subdomain
This commit is contained in:
parent
34e6e30f19
commit
8dc9ece2ac
BIN
img/code-guard.png
Normal file
BIN
img/code-guard.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 281 KiB |
255
mr/index.html
Normal file
255
mr/index.html
Normal file
@ -0,0 +1,255 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<title>Mr's space</title>
|
||||
<style>
|
||||
* {
|
||||
cursor: none;
|
||||
}
|
||||
|
||||
body {
|
||||
--bg1: rgb(0, 0, 0);
|
||||
--bg2: rgb(15, 15, 15);
|
||||
background-image: linear-gradient(to bottom, var(--bg1) 0px, var(--bg1) 2px, var(--bg2) 3px, var(--bg2) 6px);
|
||||
background-size: 100% 6px;
|
||||
background-repeat: repeat-y;
|
||||
color: lime;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: monospace;
|
||||
font-size: calc(var(--ch) * 2 / 3);
|
||||
line-height: var(--ch);
|
||||
|
||||
user-select: none;
|
||||
|
||||
/* animation-name: r;
|
||||
animation-duration: 1s;
|
||||
animation-timing-function: linear;
|
||||
animation-iteration-count: infinite; */
|
||||
}
|
||||
|
||||
#content {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, var(--cw));
|
||||
grid-template-rows: repeat(auto-fill, var(--ch));
|
||||
}
|
||||
|
||||
.glow {
|
||||
text-shadow: 0 0 0 lime, 0 0 0 lime;
|
||||
transition: text-shadow 0.5s ease;
|
||||
}
|
||||
|
||||
.glow:hover {
|
||||
text-shadow: 1px 1px 10px lime, -1px -1px 5px lime;
|
||||
transition: text-shadow 0.5s ease;
|
||||
}
|
||||
|
||||
.letter {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.letter:hover {
|
||||
color: black;
|
||||
}
|
||||
|
||||
.clickable:hover~#cursor {
|
||||
background-color: red;
|
||||
}
|
||||
|
||||
@keyframes r {
|
||||
0% {
|
||||
background-position-y: 0px;
|
||||
}
|
||||
|
||||
100% {
|
||||
background-position-y: -6px;
|
||||
}
|
||||
}
|
||||
|
||||
#cursor {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: var(--cw);
|
||||
height: var(--ch);
|
||||
background-color: lime;
|
||||
z-index: -1;
|
||||
}
|
||||
</style>
|
||||
<noscript>
|
||||
<style>
|
||||
* {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
body {
|
||||
--cw: 15px;
|
||||
--ch: 30px;
|
||||
}
|
||||
</style>
|
||||
</noscript>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<section id="content">
|
||||
<noscript>N</noscript>
|
||||
<noscript>O</noscript>
|
||||
<noscript>M</noscript>
|
||||
<noscript>E</noscript>
|
||||
<noscript>D</noscript>
|
||||
<noscript>I</noscript>
|
||||
<noscript>A</noscript>
|
||||
</section>
|
||||
<div id="cursor" style="display: none;"></div>
|
||||
<script>
|
||||
|
||||
const cursor = document.getElementById("cursor");
|
||||
const body = document.getElementById("content");
|
||||
|
||||
const colors = ["red", "green", "blue"];
|
||||
|
||||
let cW = 15;
|
||||
let cH = 2 * cW;
|
||||
let paintMode = false;
|
||||
let color = colors[0];
|
||||
|
||||
document.body.style.setProperty("--cw", cW + "px");
|
||||
document.body.style.setProperty("--ch", cH + "px");
|
||||
|
||||
function getBoxPos(x, y) {
|
||||
x -= x % cW;
|
||||
y -= y % cH;
|
||||
return [x, y];
|
||||
}
|
||||
|
||||
function getBoxIdx(x, y) {
|
||||
x = Math.floor(x / cW);
|
||||
y = Math.floor(y / cH);
|
||||
return [x, y];
|
||||
}
|
||||
|
||||
function setBoxColor(x, y, color) {
|
||||
const boxId = "box-" + x + "-" + y;
|
||||
let box = document.getElementById(boxId);
|
||||
if (!box) {
|
||||
box = document.createElement("a");
|
||||
box.id = boxId;
|
||||
box.style.zIndex = -1;
|
||||
box.style.position = "fixed";
|
||||
box.style.left = "calc(var(--cw) * " + x + ")";
|
||||
box.style.top = "calc(var(--ch) * " + y + ")";
|
||||
box.style.width = "var(--cw)";
|
||||
box.style.height = "var(--ch)";
|
||||
body.appendChild(box);
|
||||
}
|
||||
|
||||
box.style.backgroundColor = color;
|
||||
}
|
||||
|
||||
document.onmousemove = event => {
|
||||
let [x, y] = getBoxPos(event.x, event.y);
|
||||
|
||||
cursor.style.left = x + "px";
|
||||
cursor.style.top = y + "px";
|
||||
cursor.style.display = "block";
|
||||
|
||||
let [bx, by] = getBoxIdx(event.x, event.y);
|
||||
if (paintMode) setBoxColor(bx, by, color);
|
||||
};
|
||||
|
||||
document.onkeyup = event => {
|
||||
switch (event.key) {
|
||||
case "p":
|
||||
paintMode = !paintMode;
|
||||
break;
|
||||
case "c":
|
||||
color = colors[(colors.indexOf(color) + 1) % colors.length];
|
||||
break;
|
||||
case "n":
|
||||
cW--;
|
||||
cH = 2 * cW;
|
||||
document.body.style.setProperty("--cw", cW + "px");
|
||||
document.body.style.setProperty("--ch", cH + "px");
|
||||
break;
|
||||
case "m":
|
||||
cW++;
|
||||
cH = 2 * cW;
|
||||
document.body.style.setProperty("--cw", cW + "px");
|
||||
document.body.style.setProperty("--ch", cH + "px");
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
document.onmouseout = () => {
|
||||
cursor.style.display = "none";
|
||||
};
|
||||
|
||||
let content = [
|
||||
" ",
|
||||
" MrLetsplay's Secret Space",
|
||||
" Projects",
|
||||
[" - ", { text: "KekEngine", link: "https://git.cringe-studios.com/mr/KekEngine" }, " (+ ", { text: "Kekrooms", link: "https://github.com/MrLetsplay2003/Kekrooms" }, ")"],
|
||||
[" - ", { text: "ShittyAuthLauncher", link: "https://github.com/MrLetsplay2003/ShittyAuthLauncher" }, ", ", { text: "ShittyAuthServer", link: "https://github.com/MrLetsplay2003/ShittyAuthServer" }, ", ", { text: "ShittyAuthPatcher", link: "https://github.com/MrLetsplay2003/ShittyAuthPatcher" }],
|
||||
]
|
||||
|
||||
function appendStr(text, newLine, makeElement = () => document.createElement("a")) {
|
||||
let first = newLine;
|
||||
for (let l of text) {
|
||||
let b = makeElement();
|
||||
if (first) b.style.gridColumn = "1 / 2";
|
||||
b.classList.add("letter");
|
||||
b.innerText = l;
|
||||
body.appendChild(b);
|
||||
first = false;
|
||||
}
|
||||
}
|
||||
|
||||
for (let line of content) {
|
||||
if (typeof line == "string") {
|
||||
appendStr(line, true);
|
||||
} else {
|
||||
let first = true;
|
||||
for (let l of line) {
|
||||
if (typeof l == "string") {
|
||||
appendStr(l, first);
|
||||
} else {
|
||||
if (l.link) {
|
||||
l.onclick = () => window.location.href = l.link;
|
||||
}
|
||||
|
||||
let makeElement = () => {
|
||||
let b = document.createElement("a");
|
||||
if (l.onclick) {
|
||||
b.onmouseover = event => {
|
||||
cursor.style.backgroundColor = "red";
|
||||
};
|
||||
|
||||
b.onmouseout = event => {
|
||||
cursor.style.backgroundColor = null;
|
||||
}
|
||||
|
||||
b.classList.add("clickable");
|
||||
b.onclick = l.onclick;
|
||||
}
|
||||
return b;
|
||||
}
|
||||
|
||||
appendStr(l.text, first, makeElement);
|
||||
}
|
||||
first = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
Loading…
Reference in New Issue
Block a user