added comments for general idea

apu52 · Dec 27, 2024 · 095413f · 095413f
1 parent 23888c2
commit 095413f
Showing 1 changed file with 4 additions and 3 deletions.
diff --git a/404.html b/404.html
@@ -50,6 +50,7 @@
     }
 
     @media screen and (max-width: 768px) {
+      /* for width smaller than 768px */
       body {
         background-color: #023c7f;
       }
@@ -73,16 +74,16 @@
 </head>
 <body>
   <div class="container">
-<!--     <h1>404</h1>
-    <p>Oops! The page you're looking for doesn't exist.</p>
-    <p>Let's get you back <a href="https://apu52.github.io/METAVERSE">home</a>.</p> -->
+    <!-- spline component background, hidden on mobile screens -->
     <div class="background">
       <script type="module" src="https://unpkg.com/@splinetool/[email protected]/build/spline-viewer.js"></script>
       <spline-viewer url="https://prod.spline.design/FF4zUicpD61VIS7e/scene.splinecode"></spline-viewer>
     </div>
+    <!-- mobile screen background with 404 svg, hidden on desktop screens -->
     <div class="mobile-background">
       <img src="./assets/svgs/pageNotFound.svg" alt="page not found 404 error image">
     </div>
+    <!-- overlay box with not found message, back home link and credit to 3D model creator on (desktop only) -->
     <div class="box">
       <p>Oops! The page you're looking for doesn't exist.</p>
       <p>Let's get you back <a id="back_Home_btn" href="https://apu52.github.io/METAVERSE">Home 🏠</a>.</p>