scripts/bakeimgs

@@ -4,9 +4,8 @@
 
 # ===== Configuration ===== #
 IMGS_DIR="imgs"
-BAKE_DIR="www/baked"
+BAKE_DIR="bake"
 # ========================= #
 
 mkdir -p "$BAKE_DIR"
 magick -background '#000000' -size 100x100 "$IMGS_DIR/mirror-icon.svg" "$BAKE_DIR/mirror-icon.png"
-magick "$IMGS_DIR/c00L_y2k_g1rL.png" -resize 50% "$BAKE_DIR/avatar.png"

www/audio/README.md

@@ -1,3 +0,0 @@
-# Credit
-1. [me and my UNREGISTERED FIREARM](https://www.youtube.com/watch?v=5NWH-UmwWeM) by **@oranjate**
-2. [UNDO UNDO](https://www.youtube.com/watch?v=lCaun_EiJZQ) by **@Rolobi**

www/css/ppty.css

@@ -3,6 +3,15 @@
 /* =========================================================== */
 
 .ppty {
+  background-color: var(--theme-bg);
+  border: 0.5ch solid var(--theme-tty-border);
+  
+  margin: auto auto;
+  padding: 20px;
+
+  position: relative;
+  height: auto;
+  
   /* display: block; */
   /* flex-direction: column; */
   /* justify-content: start; */
@@ -10,9 +19,6 @@
   /* align-items: start; */
 
   overflow: hidden;
-
-  font-family: monospace;
-  font-weight: bold;
 }
 
 .ppty-block {

www/css/style.css

@@ -2,11 +2,6 @@ body {
   background-color: var(--theme-bg);
 }
 
-main {
-  visibility: hidden;
-  opacity: 0;
-}
-
 #bg-canvas {
   display:block;
   position: fixed;
@@ -17,7 +12,7 @@ main {
   z-index: -1;
 }
 
-.centered-container {
+.centered {
   position: absolute;
   inset: 0 0 0 0;
   margin: auto;
@@ -25,22 +20,8 @@ main {
   display: flex;
 }
 
-.centered {
+.heading {
-  margin: auto auto;
-  position: relative;
-}
-
-/* like iframes but . . . wait what are iframes again? */
-.cryframe {
-  border: 0.5ch solid var(--theme-tty-border);
-  padding: 20px;
-
-  width: auto;
-  height: auto;
-  
-  background-color: var(--theme-bg);
-  color: var(--theme-text);
-
   font-family: monospace;
-  font-size: 1.5em
+  font-size: 2em;
+  font-weight: bold;
 }

www/index.html

@@ -20,8 +20,8 @@
     <canvas id="bg-canvas"></canvas>
 
     <!-- Psuedo-Pseudo-Terminal -->
-    <div class="centered-container">
+    <div class="centered heading">
-      <div class="ppty centered cryframe" id="boot-ppty">
+      <div class="ppty" id="boot-ppty">
     
         <div class="ppty-block">
           <div class="ppty-prompt">
@@ -63,20 +63,5 @@
       </div>
     </div>
 
-    <main>
-      <audio autoplay>
-        <!-- <source src="audio/UNREGISTERED_FIREARM.mpeg" type="audio/mpeg"> -->
-        <source src="audio/UNDO_UNDO.mpeg" type="audio/mpeg">
-        Your browser does not support the audio element.
-      </audio>
-    
-      <div class="centered-container">
-        <div class="centered cryframe" style="display: flex; flex-direction: row; gap: 20px;">
-          <img src="baked/avatar.png" loading="eager" height="150">
-          <p>hi!! i'm cry (they/them)</p>
-        </div>
-      </div>
-    </main>
-
   </body>
 </html>

www/js/main.js

@@ -24,21 +24,7 @@ function endBoot(root) {
     }
   );
 
-  fade.onfinish = () => {
+  fade.onfinish = () => root.remove();
-    root.remove();
-    document
-      .querySelector("main")
-      .animate(
-        [
-          { visibility: "visible" },
-          { visibility: "visible", opacity: 1 }
-        ],
-        {
-          duration: 400,
-          fill: "forwards",
-        }
-      );
-  }
 }
 
 function main() {