Add default site and error 404 site layout and design

ZoeyVid · Jun 4, 2024 · efcd6ee · efcd6ee
1 parent e258b72
commit efcd6ee
Show file tree

Hide file tree

Showing 2 changed files with 172 additions and 2 deletions.
diff --git a/rootfs/app/404/index.html b/rootfs/app/404/index.html
@@ -1 +1,84 @@
-todo
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8">
+    <title>404 Not Found</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  </head>
+  <body>
+    <style>
+        @media (prefers-color-scheme: dark) {
+            body {
+                background-color: rgb(17 24 39);
+                color: white;
+            }
+
+            #box {
+                background-color: rgb(31 41 55);
+            }
+        }
+
+        @media (prefers-color-scheme: light) {
+            body {
+                background-color: white;
+                color: black;
+            }
+
+            #box {
+                background-color: rgb(229 231 235);
+            }
+        }
+
+        body {
+            font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
+            text-align: center;
+        }
+
+        #box {
+            border-radius: 2rem;
+            position: absolute;
+            padding: 1rem;
+            padding-right: 5rem;
+            padding-left: 5rem;
+            top: 50%;
+            left: 50%;
+            transform: translate(-50%, -50%);
+        }
+
+        h1 {
+            font-size: 64px;
+        }
+
+        p {
+            font-size: 24px;
+        }
+
+        #notice {
+            font-size: 12px;
+            position: fixed;
+            bottom: 0; 
+            left: 50%;
+            transform: translateX(-50%);
+        }
+
+        @media (max-width: 600px) {
+            h1 {
+                font-size: 32px;
+            }
+
+            p {
+                font-size: 16px;
+            }
+
+            #box {
+                padding-right: 2rem;
+                padding-left: 2rem;
+            }
+        }
+    </style>
+    <div id="box">
+        <h1>404 Not Found</h1>
+    </div>
+    <p id="notice">Powered by <a href="https://github.com/ZoeyVid/NPMplus">NPMplus</a></p>
+  </body>
+</html>
diff --git a/rootfs/app/default/index.html b/rootfs/app/default/index.html
@@ -1 +1,88 @@
-todo
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8">
+    <title>Default Site</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  </head>
+  <body>
+    <style>
+        @media (prefers-color-scheme: dark) {
+            body {
+                background-color: rgb(17 24 39);
+                color: white;
+            }
+
+            #box {
+                background-color: rgb(31 41 55);
+            }
+        }
+
+        @media (prefers-color-scheme: light) {
+            body {
+                background-color: white;
+                color: black;
+            }
+
+            #box {
+                background-color: rgb(229 231 235);
+            }
+        }
+
+        body {
+            font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
+            text-align: center;
+        }
+
+        #box {
+            border-radius: 2rem;
+            position: absolute;
+            padding: 1rem;
+            padding-right: 5rem;
+            padding-left: 5rem;
+            top: 50%;
+            left: 50%;
+            transform: translate(-50%, -50%);
+        }
+
+        h1 {
+            font-size: 64px;
+        }
+
+        p {
+            font-size: 24px;
+        }
+
+        #notice {
+            font-size: 12px;
+            position: fixed;
+            bottom: 0; 
+            left: 50%;
+            transform: translateX(-50%);
+        }
+
+
+        @media (max-width: 600px) {
+            h1 {
+                font-size: 32px;
+            }
+
+            p {
+                font-size: 16px;
+            }
+
+            #box {
+                padding-right: 2rem;
+                padding-left: 2rem;
+            }
+        }
+    </style>
+    <div id="box">
+        <h1>Congratulations!</h1>
+        <p>You've successfully started NPMplus.</p>
+        <p>If you're seeing this site then you're trying to access a host that isn't set up yet.</p>
+        <p>Log in to the Admin panel to get started.</p>
+    </div>
+    <p id="notice">Powered by <a href="https://github.com/ZoeyVid/NPMplus">NPMplus</a></p>
+  </body>
+</html>