Revert changes in 404.html (#90)

gomzyakov · web-flow · commit a92ab41144c0 · 2024-01-08T17:43:09.000+05:00
diff --git a/404.html b/404.html
@@ -5,7 +5,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
     <title>404</title>
     <style>
-          * {
+        * {
             margin: 0;
             padding: 0;
             font-family: system-ui, -apple-system, "Segoe UI", Roboto, Oxygen,
@@ -15,53 +15,42 @@
         body {
             background-color: #212529;
             color: #dee2e6;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            height: 100vh;
         }
 
         #wrapper {
             display: flex;
-            flex-direction: column;
             background-color: #212529 !important;
             border: none;
-            width: 60%;
-            padding: 20px;
-            border-radius: 15px;
-            box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
+            width: 80%;
+            height: 90vh;
+            margin: 5vh auto;
+            justify-content: center;
+            align-items: center;
+            vertical-align: middle;
+            border-radius: 25px;
         }
 
         #content {
             text-align: center;
         }
 
         h1 {
-            font-size: 10vw;
-            line-height: 1.2;
-            color: #f8f9fa; /* Lighter color for the heading */
+            font-size: 30vh;
+            line-height: 30vh;
         }
 
         h2 {
             margin: 2vh 0;
-            color: #adb5bd; /* Slightly lighter color for subheading */
         }
 
+        h2,
         p {
-            color: #ced4da; /* Lighter color for paragraph text */
-            margin-bottom: 20px;
+            color: #a1a8ae;
         }
 
         a {
             color: rgb(110, 168, 254);
-            text-decoration: none;
-            font-weight: bold;
-        }
-
-        a:hover {
-            text-decoration: underline; /* Underline on hover */
         }
-            
     </style>
 </head>
 <body>
@@ -72,31 +61,5 @@ <h2>Oops! Page not found</h2>
         <p>Sorry, the page you're looking for doesn't exist. Please, go to <a href="/">main page</a>.</p>
     </div>
 </div>
-    <script>
-    document.addEventListener('DOMContentLoaded', function () {
-        const heading = document.querySelector('h1');
-
-        if (heading) {
-            // Add a pulsating effect to the heading
-            let scale = 1;
-            let growing = true;
-
-            function updateScale() {
-                if (growing) {
-                    scale += 0.1;
-                    if (scale >= 1.5) growing = false;
-                } else {
-                    scale -= 0.1;
-                    if (scale <= 1) growing = true;
-                }
-
-                heading.style.transform = `scale(${scale})`;
-                requestAnimationFrame(updateScale);
-            }
-
-            updateScale();
-        }
-    });
-    </script>
 </body>
 </html>
