404 page for domain

aakashdinkarh · Nov 20, 2024 · 0d50f29 · 0d50f29
1 parent da9595d
commit 0d50f29
Show file tree

Hide file tree

Showing 3 changed files with 83 additions and 3 deletions.
diff --git a/404.html b/404.html
@@ -2,7 +2,51 @@
 <!DOCTYPE html>
 <html>
   <head>
-    <meta charset="utf-8" />
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">
+    <meta name="theme-color" content="#ffffff" />
+    <meta http-equiv="Content-Language" content="en" />
+    <meta name="author" content="Aakash Dinkar" />
+    <meta name="description" content="The page you are looking for does not exist." />
+    <meta name="keywords" content="Aakash Dinkar, Not Found, does not exist" />
+
+    <!-- Favicon for browsers -->
+    <link rel="icon" href="https://aakashdinkarh.github.io/static_assets/images/portfolio/site-icon/site-icon.ico" type="image/x-icon">
+    <!-- Favicon for standard desktop browsers (16x16, 32x32) -->
+    <link rel="icon" href="https://aakashdinkarh.github.io/static_assets/images/portfolio/site-icon/site-icon-32.png" sizes="32x32" type="image/png">
+    <link rel="icon" href="https://aakashdinkarh.github.io/static_assets/images/portfolio/site-icon/site-icon-16.png" sizes="16x16" type="image/png">
+    <!-- Favicon for high-resolution desktop displays (64x64) -->
+    <link rel="icon" href="https://aakashdinkarh.github.io/static_assets/images/portfolio/site-icon/site-icon-64.png" sizes="64x64" type="image/png">
+    <!-- Apple Touch Icons for iOS -->
+    <link rel="apple-touch-icon" href="https://aakashdinkarh.github.io/static_assets/images/portfolio/site-icon/site-icon-180.png">
+    <link rel="apple-touch-icon" href="https://aakashdinkarh.github.io/static_assets/images/portfolio/site-icon/site-icon-152.png">
+    <link rel="apple-touch-icon" href="https://aakashdinkarh.github.io/static_assets/images/portfolio/site-icon/site-icon-120.png">
+    <link rel="apple-touch-icon" href="https://aakashdinkarh.github.io/static_assets/images/portfolio/site-icon/site-icon-76.png">
+    <link rel="apple-touch-icon" href="https://aakashdinkarh.github.io/static_assets/images/portfolio/site-icon/site-icon.ico">
+    <!-- Favicon for Android devices -->
+    <link rel="icon" href="https://aakashdinkarh.github.io/static_assets/images/portfolio/site-icon/site-icon-192.png" sizes="192x192" type="image/png">
+    <!-- Favicon for Windows tiles (optional) -->
+    <meta name="msapplication-TileImage" content="https://aakashdinkarh.github.io/static_assets/images/portfolio/site-icon/site-icon-144.png">
+
+    <!-- Shortcut icon for backward compatibility with older browsers -->
+    <link rel="shortcut icon" href="https://aakashdinkarh.github.io/static_assets/images/portfolio/site-icon/site-icon.ico" type="image/x-icon">
+    <!-- Mask icon for Safari Pinned Tab (can be in SVG format, for better scaling) -->
+    <link rel="mask-icon" href="https://aakashdinkarh.github.io/static_assets/images/portfolio/site-icon/site-icon-32.png">
+
+    <meta property="og:title" content="404 Not Found" />
+    <meta property="og:description" content="The page you are looking for does not exist." />
+    <meta property="og:url" content="https://aakashdinkar.in/" />
+    <meta property="og:image" content="https://aakashdinkarh.github.io/static_assets/images/portfolio/avif-images/meta-og-image.avif" />
+    <meta property="og:image" content="https://aakashdinkarh.github.io/static_assets/images/portfolio/webp-images/meta-og-image.webp" />
+    <meta property="og:image" content="https://aakashdinkarh.github.io/static_assets/images/portfolio/original-images/meta-og-image.jpeg" />
+    <meta property="og:type" content="website" />
+
+    <meta name="twitter:title" content="404 Not Found" />
+    <meta name="twitter:description" content="The page you are looking for does not exist." />
+    <meta name="twitter:image" content="https://aakashdinkarh.github.io/static_assets/images/portfolio/avif-images/meta-og-image.avif" />
+    <meta name="twitter:image" content="https://aakashdinkarh.github.io/static_assets/images/portfolio/webp-images/meta-og-image.webp" />
+    <meta name="twitter:image" content="https://aakashdinkarh.github.io/static_assets/images/portfolio/original-images/meta-og-image.jpeg" />
+
 		<title>404 Not Found</title>
 		<script type="text/javascript">
       var reactProjectsWithRouter = ['the-movie-db', 'music-player-project', 'Tic-Tac-Toe-Game', 'todo-react-app'];
@@ -29,9 +73,45 @@
         );
       }
 		</script>
+
+    <style>
+      body {
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        align-items: center;
+        height: 100vh;
+        margin: 0;
+        background-color: rgb(22 24 29);
+        color: #ffffff;
+        font-family: Arial, sans-serif;
+        text-align: center;
+      }
+      h1 {
+        font-size: 3em;
+        color: rgb(246 139 33);
+      }
+      p {
+        font-size: 1.2em;
+        color: #dcdcdc;
+      }
+      a {
+        margin-top: 20px;
+        padding: 10px 20px;
+        background-color: rgb(246 139 33);
+        color: #000;
+        text-decoration: none;
+        border-radius: 5px;
+      }
+      a:hover {
+        background-color: rgb(196, 111, 25);
+      }
+    </style>
 	</head>
 	<body>
     <h1>404 Not Found</h1>
     <p>The page you are looking for doesn't exist.</p>
+    <a href="https://aakashdinkar.in">Go back to Homepage</a>
+
   </body>
 </html>
diff --git a/index.html b/index.html
@@ -2,7 +2,7 @@
 <html lang="en">
 <head>
 	<meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">
+	<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">
 	<meta name="theme-color" content="#ffffff" />
 	<meta http-equiv="Content-Language" content="en" />
 	<meta name="author" content="Aakash Dinkar" />

diff --git a/styles/style.css b/styles/style.css
@@ -1,5 +1,5 @@
 :root {
-    --scrollbar-width: 8px;
+	--scrollbar-width: 8px;
 
 	--primary-bg: 22 24 29;
 	--primary-bg-color: rgb(var(--primary-bg));