diff --git a/css/MiiverseSymbols-Regular.eot b/css/MiiverseSymbols-Regular.eot
new file mode 100644
index 0000000..f0e6c54
Binary files /dev/null and b/css/MiiverseSymbols-Regular.eot differ
diff --git a/css/MiiverseSymbols-Regular.ttf b/css/MiiverseSymbols-Regular.ttf
new file mode 100644
index 0000000..b821e9b
Binary files /dev/null and b/css/MiiverseSymbols-Regular.ttf differ
diff --git a/css/MiiverseSymbols-Regular.woff b/css/MiiverseSymbols-Regular.woff
new file mode 100644
index 0000000..3635857
Binary files /dev/null and b/css/MiiverseSymbols-Regular.woff differ
diff --git a/css/comic.ttf b/css/comic.ttf
new file mode 100644
index 0000000..9edb03a
Binary files /dev/null and b/css/comic.ttf differ
diff --git a/css/cursor.gif b/css/cursor.gif
new file mode 100644
index 0000000..f1247cf
Binary files /dev/null and b/css/cursor.gif differ
diff --git a/css/main.css b/css/main.css
index b81c375..8e67332 100644
--- a/css/main.css
+++ b/css/main.css
@@ -1,9 +1,22 @@
+@font-face {
+ font-family: 'Comic';
+ src: url('/css/comic.ttf') format('truetype');
+ font-display: swap;
+}
+
+.trail {
+ position: absolute;
+ z-index: 9999;
+ pointer-events: none;
+}
+
body {
- font-family: "Comic Sans", "Comic Sans MS", "Chalkboard",
- "ChalkboardSE-Regular", "Marker Felt", "Purisa", "URW Chancery L", cursive,
- sans-serif;
+ font-family: 'Comic';
color: yellow;
font-size: 20px;
+ margin: 0;
+ padding: 0;
+ overflow-x: hidden;
}
#overview {
min-width: min-content;
@@ -21,16 +34,12 @@ body {
width: 100%;
}
#mainBod {
- background: url(/index_files/Apex_3D_Logo_2_.png) repeat;
- border: 70px solid;
- content: "";
- opacity: 0.75;
- top: 0;
- left: 0;
- bottom: 0;
- right: 0;
- position: absolute;
- z-index: -1;
+ background-image: url(/index_files/Apex_3D_Logo_2_.png);
+ background-repeat: repeat;
+ background-color: #a25300;
+ border: 70px solid;
+ min-height: 100vh;
+ box-sizing: border-box;
border-image: url(/index_files/dollarspindownd.gif) 50 / 6 / 0 stretch;
}
#linhead {
@@ -134,3 +143,87 @@ li {
line-height: 20px;
list-style: none;
}
+
+html.dither>body>div{
+ background: url("data:image/webp;base64,UklGRjAAAABXRUJQVlA4TCQAAAAvA8AAAIVS27ahb3uzOUmSJoqqrOq6P47of8DQdcprYdP8/VY=");
+ filter: contrast(2000);
+ image-rendering: crisp-edges;
+}
+html.dither>body>div>div{
+ filter: initial;
+ mix-blend-mode: soft-light;
+ isolation: isolate;
+ image-rendering: initial;
+}
+
+#eyes {
+ display: inline-block;
+}
+
+#eyes>summary {
+ cursor: pointer;
+ font-size: 0;
+}
+
+#eyes[open]>div {
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ background-color: black;
+ z-index: 9999;
+ pointer-events: none;
+}
+
+@font-face {
+ font-family: "MiiverseSymbols";
+ src: url('MiiverseSymbols-Regular.ttf');
+ src: url('MiiverseSymbols-Regular.eot') format('embedded-opentype'), url('MiiverseSymbols-Regular.woff') format('woff'), url('MiiverseSymbols-Regular.ttf') format('truetype');
+ font-weight: normal;
+ font-style: normal;
+}
+
+#yeah, #yeah div {
+ vertical-align: top;
+}
+#yeah-toggle:checked+label>#yeah-off {
+ display: none;
+}
+#yeah-toggle:not(:checked)+label>#yeah-on {
+ display: none;
+}
+#yeah div {
+ font-family: 'Helvetica', 'Arial', sans-serif;
+ cursor: pointer;
+ display: inline-block;
+ margin: 0 auto;
+ padding: 3px 5px 2px;
+ border: 1px solid #ddd;
+ border-bottom-color: #ccc;
+ background: #FFF;
+ font-size: 12px;
+ color: #323232;
+ text-align: center;
+ -webkit-border-radius: 5px;
+ -moz-border-radius: 5px;
+ -ms-border-radius: 5px;
+ -o-border-radius: 5px;
+ border-radius: 5px;
+ -webkit-box-shadow: inset 0 1px 0 #fff;
+ -moz-box-shadow: inset 0 1px 0 #fff;
+ -ms-box-shadow: inset 0 1px 0 #fff;
+ -o-box-shadow: inset 0 1px 0 #fff;
+ box-shadow: inset 0 1px 0 #fff;
+}
+#yeah div::before {
+ font-family: "MiiverseSymbols", sans-serif !important;
+ font-weight: normal !important;
+ content: "E";
+ font-size: 16px;
+ color: #969696;
+ margin-right: 2px;
+ margin-top: -3px;
+ display: inline-block;
+ vertical-align: middle;
+}
diff --git a/index.html b/index.html
index 150353c..2eda64d 100644
--- a/index.html
+++ b/index.html
@@ -1,5 +1,5 @@
<!DOCTYPE html>
-<html style="background-color: #a25300">
+<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<meta charset="utf-8" />
@@ -15,9 +15,8 @@
<link rel="stylesheet" href="./css/main.css" />
</head>
- <body
- id="mainBod"
- >
+ <body>
+ <div><div><div id="mainBod">
<div id="content">
<div class="container">
<div id="overview">
@@ -98,19 +97,79 @@
<img src="index_files/buttons/moist.gif" />
<img src="index_files/buttons/netscapenow40.gif" />
<a href="./arch.html">
- <img src="index_files/buttons/gnu-linux.gif" />
+ <img src="index_files/buttons/archlinux.gif" />
</a>
+ <img src="index_files/buttons/gnu-linux.gif" />
<img src="index_files/buttons/mswin98_89.gif" />
<img src="index_files/buttons/macmade-blkwtbrdrspin.gif" />
<img src="index_files/buttons/hatemac_b.gif"/>
<img src="index_files/buttons/vim.vialle.love.anim.gif" />
<img src="index_files/buttons/madewithamiga2.gif" />
<img src="index_files/buttons/shockwave.gif" />
+ <img src="index_files/buttons/graphicdesign.gif" />
<img src="index_files/buttons/nedscape_now.gif" />
<img src="index_files/buttons/netscape5.gif" />
+ <details id="eyes">
+ <summary>
+ <img src="index_files/buttons/best_viewed_with_eyes.gif" />
+ </summary>
+ <div id="no_eyes"></div>
+ </details>
+ <img src="index_files/buttons/bestviewed16bit.gif" style="cursor: pointer;" onclick="document.documentElement.classList.toggle('dither')" />
<img src="index_files/buttons/wow.gif" />
+ <a href="https://validator.w3.org/nu/?doc=https%3A%2F%2Frochesterapex.com">
+ <img src="index_files/buttons/valid-bad.gif" />
+ </a>
<a href="https://rochesterapex.com/source">
<img src="index_files/buttons/gethtmlnow.gif"/>
</a>
+ <input type="checkbox" id="yeah-toggle" style="display: none;">
+ <label for="yeah-toggle" id="yeah">
+ <div id="yeah-off">Yeah!</div>
+ <div id="yeah-on">Unyeah</div>
+ </label>
+ </div></div></div>
+ <script>
+ var trailLength = 12;
+ var path = [];
+ var delay = 100;
+ var lastX = 0;
+ var lastY = 0;
+
+ function createMouseTrail() {
+ for (var i = 0; i < trailLength; i++) {
+ var div = document.createElement('div');
+ div.setAttribute('class', 'trail');
+ div.style.top = '-200px';
+ div.style.left = '-200px';
+ div.style.backgroundImage = 'url(/css/cursor.gif)';
+ div.style.backgroundSize = 'cover';
+ div.style.width = '11px';
+ div.style.height = '19px';
+ document.body.appendChild(div);
+ path.push(div);
+ }
+ }
+
+ var lastX = 0;
+ var lastY = 0;
+
+ function moveTrail(e) {
+ if (lastX !== e.pageX || lastY !== e.pageY) {
+ for (let i = 0; i < path.length; i++) {
+ setTimeout(function() {
+ path[i].style.top = (e.pageY) + 'px';
+ path[i].style.left = (e.pageX) + 'px';
+ }, i * delay);
+ }
+ }
+
+ lastX = e.pageX;
+ lastY = e.pageY;
+ }
+
+ document.addEventListener('mousemove', moveTrail);
+ createMouseTrail();
+ </script>
</body>
</html>
diff --git a/index_files/buttons/archlinux.gif b/index_files/buttons/archlinux.gif
new file mode 100644
index 0000000..6fcc440
Binary files /dev/null and b/index_files/buttons/archlinux.gif differ
diff --git a/index_files/buttons/best_viewed_with_eyes.gif b/index_files/buttons/best_viewed_with_eyes.gif
new file mode 100644
index 0000000..6dfeb64
Binary files /dev/null and b/index_files/buttons/best_viewed_with_eyes.gif differ
diff --git a/index_files/buttons/bestviewed16bit.gif b/index_files/buttons/bestviewed16bit.gif
new file mode 100644
index 0000000..e8f8acd
Binary files /dev/null and b/index_files/buttons/bestviewed16bit.gif differ
diff --git a/index_files/buttons/graphicdesign.gif b/index_files/buttons/graphicdesign.gif
new file mode 100644
index 0000000..876d8fe
Binary files /dev/null and b/index_files/buttons/graphicdesign.gif differ
diff --git a/index_files/buttons/valid-bad.gif b/index_files/buttons/valid-bad.gif
new file mode 100644
index 0000000..8ff4129
Binary files /dev/null and b/index_files/buttons/valid-bad.gif differ
