New pages and stuff, with @CloudburstSys

24 files changed, 629 insertions, 16 deletions

diff --git a/data/projects.json b/data/projects.json
new file mode 100644
index 0000000..c2b895d
--- /dev/null
+++ b/data/projects.json
@@ -0,0 +1,51 @@
+[
+  {
+    "id": "00001",
+    "name": "Test C# project",
+    "language": "csharp",
+    "description": "This is a description!",
+    "url": "https://example.com/"
+  },
+  {
+    "id": "00002",
+    "name": "Test HTML project",
+    "language": "html",
+    "description": "This is a description!",
+    "url": "https://example.com/"
+  },
+  {
+    "id": "00003",
+    "name": "Test JavaScript project",
+    "language": "javascript",
+    "description": "This is a description!",
+    "url": "https://example.com/"
+  },
+  {
+    "id": "00004",
+    "name": "Test Kotlin project",
+    "language": "kotlin",
+    "description": "This is a description!",
+    "url": "https://example.com/"
+  },
+  {
+    "id": "00005",
+    "name": "Test PHP project",
+    "language": "php",
+    "description": "This is a description!",
+    "url": "https://example.com/"
+  },
+  {
+    "id": "00006",
+    "name": "Test Python project",
+    "language": "python",
+    "description": "This is a description!",
+    "url": "https://example.com/"
+  },
+  {
+    "id": "00006",
+    "name": "Test TypeScript project",
+    "language": "typescript",
+    "description": "This is a description!",
+    "url": "https://example.com/"
+  }
+]
\ No newline at end of file
diff --git a/index.js b/index.js
index 73a35c3..bd66ffb 100644
--- a/index.js
+++ b/index.js
@@ -31,7 +31,23 @@ const fs = require('fs');
 const app = express();
 
 // Get version and build numbers
-const version = (fs.existsSync("./.git/refs/heads/mane") ? fs.readFileSync("./.git/refs/heads/mane").toString().trim().substring(0, 8) : (fs.existsSync("../.git/refs/heads/mane") ? fs.readFileSync("../.git/refs/heads/mane").toString().trim().substring(0, 8) : (fs.existsSync("./version.txt") ? fs.readFileSync("./version.txt").toString().trim() : (fs.existsSync("../version.txt") ? fs.readFileSync("../version.txt").toString().trim().substring(0, 8) : "live"))));
+const version = (fs.existsSync("./.git/refs/heads/mane")
+    ?
+    fs.readFileSync("./.git/refs/heads/mane").toString().trim().substring(0, 8)
+    :
+    (fs.existsSync("../.git/refs/heads/mane")
+    ?
+        fs.readFileSync("../.git/refs/heads/mane").toString().trim().substring(0, 8)
+        :
+        (fs.existsSync("./version.txt")
+            ?
+            fs.readFileSync("./version.txt").toString().trim().substring(0, 8)
+            :
+            (fs.existsSync("../version.txt")
+                ?
+                fs.readFileSync("../version.txt").toString().trim().substring(0, 8)
+                :
+                "live"))));
 const build = (fs.existsSync("./build.txt") ? fs.readFileSync("./build.txt").toString().trim() : (fs.existsSync("../build.txt") ? fs.readFileSync("../build.txt").toString().trim() : "dev"));
 
 // Restart manager
@@ -53,6 +69,10 @@ app.get('/servers', (req, res) => {
     res.render("servers", { serverCache, version, build });
 });
 
+app.get('/broken', (req, res) => {
+    res.render("broken", { serverCache, version, build });
+});
+
 app.get("/plurality", (req, res) => {
     res.render("plurality", { pluralCache, version, build });
 });
@@ -62,12 +82,13 @@ app.get("/about", (req, res) => {
 });
 
 app.get("/projects", (req, res) => {
-    res.render("projects", { version, build });
+    res.render("projects", { projectCache, version, build });
 });
 
 // API
 let serverCache = {};
 let pluralCache = {};
+let projectCache = JSON.parse(fs.readFileSync(__dirname + "/data/projects.json").toString());
 
 app.get("/api/servers", (req, res) => {
     res.json(serverCache);
@@ -77,6 +98,10 @@ app.get("/api/plural", (req, res) => {
     res.json(pluralCache);
 });
 
+app.get("/api/projects", (req, res) => {
+   res.json(projectCache);
+});
+
 // Refresh handling
 const refresh = require('./refresh/servers');
 const pkRefresh = require('./refresh/pluralkit');
@@ -84,6 +109,7 @@ setInterval(cacheReload, 300000);
 
 function cacheReload() {
     console.log("Running refresh...");
+    projectCache = JSON.parse(fs.readFileSync(__dirname + "/data/projects.json").toString());
     refresh().then(data => {
         console.log("Refresh halfway done!");
         serverCache = data;
@@ -104,4 +130,15 @@ const server = app.listen(8099, function () {
 
     console.log("Vapor Trail server listening at http://%s:%s", host, port)
     cacheReload();
-})
\ No newline at end of file
+})
+
+// Error handling
+app.use((req, res) => {
+    res.status(404);
+    res.render("error", { code: '404', message: 'What are you even looking for?', version, build, process, req, UAParser: require('ua-parser-js') });
+})
+
+app.use(function(err, req, res, next) {
+    res.status(500);
+    res.render("error", { err, code: '500', message: 'Things went pretty downhill.', version, build, process, req, UAParser: require('ua-parser-js') });
+});
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index 9655bca..bb782c8 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -14,7 +14,8 @@
         "ejs": "^3.1.8",
         "express": "^4.18.1",
         "multer": "^1.4.4",
-        "superagent": "^7.1.3"
+        "superagent": "^7.1.3",
+        "ua-parser-js": "^1.0.2"
       }
     },
     "node_modules/accepts": {
@@ -1118,6 +1119,24 @@
       "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
       "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c="
     },
+    "node_modules/ua-parser-js": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-1.0.2.tgz",
+      "integrity": "sha512-00y/AXhx0/SsnI51fTc0rLRmafiGOM4/O+ny10Ps7f+j/b8p/ZY11ytMgznXkOVo4GQ+KwQG5UQLkLGirsACRg==",
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/ua-parser-js"
+        },
+        {
+          "type": "paypal",
+          "url": "https://paypal.me/faisalman"
+        }
+      ],
+      "engines": {
+        "node": "*"
+      }
+    },
     "node_modules/unpipe": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz",
@@ -2019,6 +2038,11 @@
       "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
       "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c="
     },
+    "ua-parser-js": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-1.0.2.tgz",
+      "integrity": "sha512-00y/AXhx0/SsnI51fTc0rLRmafiGOM4/O+ny10Ps7f+j/b8p/ZY11ytMgznXkOVo4GQ+KwQG5UQLkLGirsACRg=="
+    },
     "unpipe": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz",
diff --git a/package.json b/package.json
index bc1968f..d94f580 100644
--- a/package.json
+++ b/package.json
@@ -18,6 +18,7 @@
     "ejs": "^3.1.8",
     "express": "^4.18.1",
     "multer": "^1.4.4",
-    "superagent": "^7.1.3"
+    "superagent": "^7.1.3",
+    "ua-parser-js": "^1.0.2"
   }
 }
diff --git a/public/assets/.DS_Store b/public/assets/.DS_Store
index 593c8ec..eec69f5 100644
--- a/public/assets/.DS_Store
+++ b/public/assets/.DS_Store
diff --git a/public/assets/about.css b/public/assets/about.css
new file mode 100644
index 0000000..ea26034
--- /dev/null
+++ b/public/assets/about.css
@@ -0,0 +1,44 @@
+/*
+ * MIT License
+ *
+ * Copyright (c) 2022- Equestria.dev Developers
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ *
+ */
+
+.section {
+    display: block;
+    background-color: #353535;
+    border: 1px solid #353535;
+    border-radius: 10px;
+    padding: 10px;
+    margin-bottom: 10px;
+}
+
+.section .section-title {
+    color: white !important;
+    text-decoration: none;
+    font-size: 1.17em;
+    font-weight: bold;
+}
+
+.section .section-content {
+    margin-bottom: 0;
+}
\ No newline at end of file
diff --git a/public/assets/custom.css b/public/assets/custom.css
index 487bd25..64f9903 100644
--- a/public/assets/custom.css
+++ b/public/assets/custom.css
@@ -107,7 +107,7 @@ html, body {
     margin-top: 56px;
 }
 
-.server, .plural-member {
+.server, .plural-member, .project {
     border-style: solid;
     border-color: #303030;
     border-radius: 10px;
@@ -116,13 +116,13 @@ html, body {
     margin: 5px;
 }
 
-.server .name {
+.server .name, .project .project-name {
     border-style: none none solid none;
     border-color: #303030;
     padding: 5px;
 }
 
-.server p {
+.server p, .project .project-description {
     margin-left: 5px;
 }
 
diff --git a/public/assets/favicon.png b/public/assets/favicon.png
new file mode 100644
index 0000000..b6b087b
--- /dev/null
+++ b/public/assets/favicon.png
diff --git a/public/assets/languages/csharp.svg b/public/assets/languages/csharp.svg
new file mode 100644
index 0000000..8e43620
--- /dev/null
+++ b/public/assets/languages/csharp.svg
@@ -0,0 +1 @@
+<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><defs><style>.cls-1{fill:#05930c;}.cls-2,.cls-3{fill:#fff;}.cls-2{opacity:0.1;}</style></defs><title>logo_Csharp</title><circle class="cls-1" cx="32" cy="32" r="32"/><path class="cls-2" d="M9.82,9A32,32,0,1,0,55,54.18Z"/><path class="cls-3" d="M30.43,43.55a14.78,14.78,0,0,1-7,1.48,11.23,11.23,0,0,1-8.61-3.46,12.78,12.78,0,0,1-3.23-9.09,13.39,13.39,0,0,1,3.64-9.77A12.35,12.35,0,0,1,24.49,19a14.8,14.8,0,0,1,5.94,1v3.15a12,12,0,0,0-6-1.51,9.17,9.17,0,0,0-7,2.9,10.93,10.93,0,0,0-2.7,7.75,10.4,10.4,0,0,0,2.52,7.34,8.58,8.58,0,0,0,6.62,2.73,12.42,12.42,0,0,0,6.57-1.69Z"/><path class="cls-3" d="M52.76,26.46l-.4,1.86H47.76L46.66,33.6H51.6l-.47,1.86H46.29l-1.55,7H42.53l1.51-7H39.64l-1.48,7H36l1.48-7H32.84l.35-1.86h4.66l1.07-5.27H34.05l.37-1.86h4.87l1.48-7.07H43l-1.48,7.07h4.43l1.51-7.07h2.16l-1.48,7.07Zm-7.17,1.86H41.15L40,33.6h4.46Z"/></svg>
\ No newline at end of file
diff --git a/public/assets/languages/html.svg b/public/assets/languages/html.svg
new file mode 100644
index 0000000..fbd31bf
--- /dev/null
+++ b/public/assets/languages/html.svg
@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 26.2.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 128 128" style="enable-background:new 0 0 128 128;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#FFFFFF;}
+	.st1{fill:#E44D26;}
+</style>
+<rect x="26.7" y="22.3" class="st0" width="74.8" height="83.2"/>
+<path class="st1" d="M9,2l10,112.1l44.9,12.4l45-12.4L119,2C119,2,9,2,9,2z M98.2,28.5l-0.6,7.2L97.3,39H44.6l1.3,14H96l-0.3,3.5
+	l-3.2,36.1l-0.2,2.3L64,102.6v0l0,0l-28.2-7.4L33.9,74h13.8l1,10.9L64,89h0v-0.5l15.4-3.9L81,67H33.3l-3.4-38.1L29.5,25h68.9
+	C98.5,25,98.2,28.5,98.2,28.5z"/>
+</svg>
diff --git a/public/assets/languages/javascript.svg b/public/assets/languages/javascript.svg
new file mode 100644
index 0000000..9650ca7
--- /dev/null
+++ b/public/assets/languages/javascript.svg
@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 630 630">
+<rect width="630" height="630" fill="#f7df1e"/>
+<path d="m423.2 492.19c12.69 20.72 29.2 35.95 58.4 35.95 24.53 0 40.2-12.26 40.2-29.2 0-20.3-16.1-27.49-43.1-39.3l-14.8-6.35c-42.72-18.2-71.1-41-71.1-89.2 0-44.4 33.83-78.2 86.7-78.2 37.64 0 64.7 13.1 84.2 47.4l-46.1 29.6c-10.15-18.2-21.1-25.37-38.1-25.37-17.34 0-28.33 11-28.33 25.37 0 17.76 11 24.95 36.4 35.95l14.8 6.34c50.3 21.57 78.7 43.56 78.7 93 0 53.3-41.87 82.5-98.1 82.5-54.98 0-90.5-26.2-107.88-60.54zm-209.13 5.13c9.3 16.5 17.76 30.45 38.1 30.45 19.45 0 31.72-7.61 31.72-37.2v-201.3h59.2v202.1c0 61.3-35.94 89.2-88.4 89.2-47.4 0-74.85-24.53-88.81-54.075z"/>
+</svg>
\ No newline at end of file
diff --git a/public/assets/languages/kotlin.svg b/public/assets/languages/kotlin.svg
new file mode 100644
index 0000000..cd57db1
--- /dev/null
+++ b/public/assets/languages/kotlin.svg
@@ -0,0 +1,8 @@
+<svg viewBox="0 0 20.554 20.543" xmlns="http://www.w3.org/2000/svg">
+<radialGradient id="a" cx="22.432" cy="3.493" r="21.679" gradientTransform="matrix(1.0856 0 0 1.0856 -4.4842 -2.9511)" gradientUnits="userSpaceOnUse">
+<stop stop-color="#e44857" offset=".003"/>
+<stop stop-color="#c711e1" offset=".469"/>
+<stop stop-color="#7f52ff" offset="1"/>
+</radialGradient>
+<path d="m20.554 20.543h-20.554v-20.543h20.554l-10.489 10.119z" fill="url(#a)" stroke-width="1.0858"/>
+</svg>
\ No newline at end of file
diff --git a/public/assets/languages/php.svg b/public/assets/languages/php.svg
new file mode 100644
index 0000000..e4f137c
--- /dev/null
+++ b/public/assets/languages/php.svg
@@ -0,0 +1,96 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg height="383.5975" id="svg3430" version="1.1" viewBox="0 0 711.20123 383.5975" width="711.20123" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg">
+  <title id="title3510">Official PHP Logo</title>
+  <metadata id="metadata3436">
+    <rdf:RDF>
+      <cc:Work rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"/>
+        <dc:title>Official PHP Logo</dc:title>
+        <dc:creator>
+          <cc:Agent>
+            <dc:title>Colin Viebrock</dc:title>
+          </cc:Agent>
+        </dc:creator>
+        <dc:description/>
+        <dc:contributor>
+          <cc:Agent>
+            <dc:title/>
+          </cc:Agent>
+        </dc:contributor>
+        <cc:license rdf:resource="http://creativecommons.org/licenses/by-sa/3.0/"/>
+        <dc:rights>
+          <cc:Agent>
+            <dc:title>Copyright Colin Viebrock 1997 - All rights reserved.</dc:title>
+          </cc:Agent>
+        </dc:rights>
+        <dc:date>1997</dc:date>
+      </cc:Work>
+      <cc:License rdf:about="http://creativecommons.org/licenses/by-sa/3.0/">
+        <cc:permits rdf:resource="http://creativecommons.org/ns#Reproduction"/>
+        <cc:permits rdf:resource="http://creativecommons.org/ns#Distribution"/>
+        <cc:requires rdf:resource="http://creativecommons.org/ns#Notice"/>
+        <cc:requires rdf:resource="http://creativecommons.org/ns#Attribution"/>
+        <cc:permits rdf:resource="http://creativecommons.org/ns#DerivativeWorks"/>
+        <cc:requires rdf:resource="http://creativecommons.org/ns#ShareAlike"/>
+      </cc:License>
+    </rdf:RDF>
+  </metadata>
+  <defs id="defs3434">
+    <clipPath clipPathUnits="userSpaceOnUse" id="clipPath3444">
+      <path d="M 11.52,162 C 11.52,81.677 135.307,16.561 288,16.561 l 0,0 c 152.693,0 276.481,65.116 276.481,145.439 l 0,0 c 0,80.322 -123.788,145.439 -276.481,145.439 l 0,0 C 135.307,307.439 11.52,242.322 11.52,162" id="path3446"/>
+    </clipPath>
+    <radialGradient cx="0" cy="0" fx="0" fy="0" gradientTransform="matrix(363.05789,0,0,-363.05789,177.52002,256.30713)" gradientUnits="userSpaceOnUse" id="radialGradient3452" r="1" spreadMethod="pad">
+      <stop id="stop3454" offset="0" style="stop-opacity:1;stop-color:#aeb2d5"/>
+      <stop id="stop3456" offset="0.3" style="stop-opacity:1;stop-color:#aeb2d5"/>
+      <stop id="stop3458" offset="0.75" style="stop-opacity:1;stop-color:#484c89"/>
+      <stop id="stop3460" offset="1" style="stop-opacity:1;stop-color:#484c89"/>
+    </radialGradient>
+    <clipPath clipPathUnits="userSpaceOnUse" id="clipPath3468">
+      <path d="M 0,324 576,324 576,0 0,0 0,324 Z" id="path3470"/>
+    </clipPath>
+    <clipPath clipPathUnits="userSpaceOnUse" id="clipPath3480">
+      <path d="M 0,324 576,324 576,0 0,0 0,324 Z" id="path3482"/>
+    </clipPath>
+  </defs>
+  <g id="g3438" transform="matrix(1.25,0,0,-1.25,-4.4,394.29875)">
+    <g id="g3440">
+      <g clip-path="url(#clipPath3444)" id="g3442">
+        <g id="g3448">
+          <g id="g3450">
+            <path d="M 11.52,162 C 11.52,81.677 135.307,16.561 288,16.561 l 0,0 c 152.693,0 276.481,65.116 276.481,145.439 l 0,0 c 0,80.322 -123.788,145.439 -276.481,145.439 l 0,0 C 135.307,307.439 11.52,242.322 11.52,162" id="path3462" style="fill:url(#radialGradient3452);stroke:none"/>
+          </g>
+        </g>
+      </g>
+    </g>
+    <g id="g3464">
+      <g clip-path="url(#clipPath3468)" id="g3466">
+        <g id="g3472" transform="translate(288,27.3594)">
+          <path d="M 0,0 C 146.729,0 265.68,60.281 265.68,134.641 265.68,209 146.729,269.282 0,269.282 -146.729,269.282 -265.68,209 -265.68,134.641 -265.68,60.281 -146.729,0 0,0" id="path3474" style="fill:#777bb3;fill-opacity:1;fill-rule:nonzero;stroke:none"/>
+        </g>
+      </g>
+    </g>
+    <g id="g3476">
+      <g clip-path="url(#clipPath3480)" id="g3478">
+        <g id="g3484" transform="translate(161.7344,145.3066)">
+          <path d="m 0,0 c 12.065,0 21.072,2.225 26.771,6.611 5.638,4.341 9.532,11.862 11.573,22.353 1.903,9.806 1.178,16.653 -2.154,20.348 C 32.783,53.086 25.417,55 14.297,55 L -4.984,55 -15.673,0 0,0 Z m -63.063,-67.75 c -0.895,0 -1.745,0.4 -2.314,1.092 -0.57,0.691 -0.801,1.601 -0.63,2.48 L -37.679,81.573 C -37.405,82.982 -36.17,84 -34.734,84 L 26.32,84 C 45.508,84 59.79,78.79 68.767,68.513 77.792,58.182 80.579,43.741 77.05,25.592 75.614,18.198 73.144,11.331 69.709,5.183 66.27,-0.972 61.725,-6.667 56.198,-11.747 49.582,-17.939 42.094,-22.429 33.962,-25.071 25.959,-27.678 15.681,-29 3.414,-29 l -24.722,0 -7.06,-36.322 c -0.274,-1.41 -1.508,-2.428 -2.944,-2.428 l -31.751,0 z" id="path3486" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none"/>
+        </g>
+        <g id="g3488" transform="translate(159.2236,197.3071)">
+          <path d="m 0,0 16.808,0 c 13.421,0 18.083,-2.945 19.667,-4.7 2.628,-2.914 3.124,-9.058 1.435,-17.767 C 36.012,-32.217 32.494,-39.13 27.452,-43.012 22.29,-46.986 13.898,-49 2.511,-49 L -9.523,-49 0,0 Z m 28.831,35 -61.055,0 c -2.872,0 -5.341,-2.036 -5.889,-4.855 l -28.328,-145.751 c -0.342,-1.759 0.12,-3.578 1.259,-4.961 1.14,-1.383 2.838,-2.183 4.63,-2.183 l 31.75,0 c 2.873,0 5.342,2.036 5.89,4.855 l 6.588,33.895 22.249,0 c 12.582,0 23.174,1.372 31.479,4.077 8.541,2.775 16.399,7.48 23.354,13.984 5.752,5.292 10.49,11.232 14.08,17.657 3.591,6.427 6.171,13.594 7.668,21.302 3.715,19.104 0.697,34.402 -8.969,45.466 C 63.965,29.444 48.923,35 28.831,35 m -45.633,-90 19.313,0 c 12.801,0 22.336,2.411 28.601,7.234 6.266,4.824 10.492,12.875 12.688,24.157 2.101,10.832 1.144,18.476 -2.871,22.929 C 36.909,3.773 28.87,6 16.808,6 L -4.946,6 -16.802,-55 M 28.831,29 C 47.198,29 60.597,24.18 69.019,14.539 77.44,4.898 79.976,-8.559 76.616,-25.836 75.233,-32.953 72.894,-39.46 69.601,-45.355 66.304,-51.254 61.999,-56.648 56.679,-61.539 50.339,-67.472 43.296,-71.7 35.546,-74.218 27.796,-76.743 17.925,-78 5.925,-78 l -27.196,0 -7.531,-38.75 -31.75,0 28.328,145.75 61.055,0" id="path3490" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"/>
+        </g>
+        <g id="g3492" transform="translate(311.583,116.3066)">
+          <path d="m 0,0 c -0.896,0 -1.745,0.4 -2.314,1.092 -0.571,0.691 -0.802,1.6 -0.631,2.48 L 9.586,68.061 C 10.778,74.194 10.484,78.596 8.759,80.456 7.703,81.593 4.531,83.5 -4.848,83.5 L -27.55,83.5 -43.305,2.428 C -43.579,1.018 -44.814,0 -46.25,0 l -31.5,0 c -0.896,0 -1.745,0.4 -2.315,1.092 -0.57,0.691 -0.801,1.601 -0.63,2.48 l 28.328,145.751 c 0.274,1.409 1.509,2.427 2.945,2.427 l 31.5,0 c 0.896,0 1.745,-0.4 2.315,-1.091 0.57,-0.692 0.801,-1.601 0.63,-2.481 L -21.813,113 2.609,113 c 18.605,0 31.221,-3.28 38.569,-10.028 7.49,-6.884 9.827,-17.891 6.947,-32.719 L 34.945,2.428 C 34.671,1.018 33.437,0 32,0 L 0,0 Z" id="path3494" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none"/>
+        </g>
+        <g id="g3496" transform="translate(293.6611,271.0571)">
+          <path d="m 0,0 -31.5,0 c -2.873,0 -5.342,-2.036 -5.89,-4.855 l -28.328,-145.751 c -0.342,-1.759 0.12,-3.578 1.26,-4.961 1.14,-1.383 2.838,-2.183 4.63,-2.183 l 31.5,0 c 2.872,0 5.342,2.036 5.89,4.855 l 15.283,78.645 20.229,0 c 9.363,0 11.328,-2 11.407,-2.086 0.568,-0.611 1.315,-3.441 0.082,-9.781 l -12.531,-64.489 c -0.342,-1.759 0.12,-3.578 1.26,-4.961 1.14,-1.383 2.838,-2.183 4.63,-2.183 l 32,0 c 2.872,0 5.342,2.036 5.89,4.855 l 13.179,67.825 c 3.093,15.921 0.447,27.864 -7.861,35.5 -7.928,7.281 -21.208,10.82 -40.599,10.82 l -20.784,0 6.143,31.605 C 6.231,-5.386 5.77,-3.566 4.63,-2.184 3.49,-0.801 1.792,0 0,0 m 0,-6 -7.531,-38.75 28.062,0 c 17.657,0 29.836,-3.082 36.539,-9.238 6.703,-6.16 8.711,-16.141 6.032,-29.938 l -13.18,-67.824 -32,0 12.531,64.488 c 1.426,7.336 0.902,12.34 -1.574,15.008 -2.477,2.668 -7.746,4.004 -15.805,4.004 l -25.176,0 -16.226,-83.5 -31.5,0 L -31.5,-6 0,-6" id="path3498" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"/>
+        </g>
+        <g id="g3500" transform="translate(409.5498,145.3066)">
+          <path d="m 0,0 c 12.065,0 21.072,2.225 26.771,6.611 5.638,4.34 9.532,11.861 11.574,22.353 1.903,9.806 1.178,16.653 -2.155,20.348 C 32.783,53.086 25.417,55 14.297,55 L -4.984,55 -15.673,0 0,0 Z m -63.062,-67.75 c -0.895,0 -1.745,0.4 -2.314,1.092 -0.57,0.691 -0.802,1.601 -0.631,2.48 L -37.679,81.573 C -37.404,82.982 -36.17,84 -34.733,84 L 26.32,84 C 45.509,84 59.79,78.79 68.768,68.513 77.793,58.183 80.579,43.742 77.051,25.592 75.613,18.198 73.144,11.331 69.709,5.183 66.27,-0.972 61.725,-6.667 56.198,-11.747 49.582,-17.939 42.094,-22.429 33.962,-25.071 25.959,-27.678 15.681,-29 3.414,-29 l -24.723,0 -7.057,-36.322 c -0.275,-1.41 -1.509,-2.428 -2.946,-2.428 l -31.75,0 z" id="path3502" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none"/>
+        </g>
+        <g id="g3504" transform="translate(407.0391,197.3071)">
+          <path d="M 0,0 16.808,0 C 30.229,0 34.891,-2.945 36.475,-4.7 39.104,-7.614 39.6,-13.758 37.91,-22.466 36.012,-32.217 32.493,-39.13 27.452,-43.012 22.29,-46.986 13.898,-49 2.511,-49 L -9.522,-49 0,0 Z m 28.831,35 -61.054,0 c -2.872,0 -5.341,-2.036 -5.889,-4.855 L -66.44,-115.606 c -0.342,-1.759 0.12,-3.578 1.259,-4.961 1.14,-1.383 2.838,-2.183 4.63,-2.183 l 31.75,0 c 2.872,0 5.342,2.036 5.89,4.855 l 6.587,33.895 22.249,0 c 12.582,0 23.174,1.372 31.479,4.077 8.541,2.775 16.401,7.481 23.356,13.986 5.752,5.291 10.488,11.23 14.078,17.655 3.591,6.427 6.171,13.594 7.668,21.302 3.715,19.105 0.697,34.403 -8.969,45.467 C 63.965,29.444 48.924,35 28.831,35 m -45.632,-90 19.312,0 c 12.801,0 22.336,2.411 28.601,7.234 6.267,4.824 10.492,12.875 12.688,24.157 2.102,10.832 1.145,18.476 -2.871,22.929 C 36.909,3.773 28.87,6 16.808,6 L -4.946,6 -16.801,-55 M 28.831,29 C 47.198,29 60.597,24.18 69.019,14.539 77.441,4.898 79.976,-8.559 76.616,-25.836 75.233,-32.953 72.894,-39.46 69.601,-45.355 66.304,-51.254 61.999,-56.648 56.679,-61.539 50.339,-67.472 43.296,-71.7 35.546,-74.218 27.796,-76.743 17.925,-78 5.925,-78 l -27.196,0 -7.53,-38.75 -31.75,0 28.328,145.75 61.054,0" id="path3506" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"/>
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>
\ No newline at end of file
diff --git a/public/assets/languages/python.svg b/public/assets/languages/python.svg
new file mode 100644
index 0000000..366f52f
--- /dev/null
+++ b/public/assets/languages/python.svg
@@ -0,0 +1,113 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://web.resource.org/cc/"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:xlink="http://www.w3.org/1999/xlink"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="110.4211"
+   height="109.8461"
+   id="svg2169"
+   sodipodi:version="0.32"
+   inkscape:version="0.45.1"
+   version="1.0"
+   sodipodi:docbase="/home/bene/Desktop"
+   sodipodi:docname="dessin-1.svg"
+   inkscape:output_extension="org.inkscape.output.svg.inkscape">
+  <defs
+     id="defs2171">
+    <linearGradient
+       id="linearGradient11301"
+       inkscape:collect="always">
+      <stop
+         id="stop11303"
+         offset="0"
+         style="stop-color:#ffe052;stop-opacity:1" />
+      <stop
+         id="stop11305"
+         offset="1"
+         style="stop-color:#ffc331;stop-opacity:1" />
+    </linearGradient>
+    <linearGradient
+       gradientUnits="userSpaceOnUse"
+       y2="168.1012"
+       x2="147.77737"
+       y1="111.92053"
+       x1="89.136749"
+       id="linearGradient11307"
+       xlink:href="#linearGradient11301"
+       inkscape:collect="always" />
+    <linearGradient
+       id="linearGradient9515"
+       inkscape:collect="always">
+      <stop
+         id="stop9517"
+         offset="0"
+         style="stop-color:#387eb8;stop-opacity:1" />
+      <stop
+         id="stop9519"
+         offset="1"
+         style="stop-color:#366994;stop-opacity:1" />
+    </linearGradient>
+    <linearGradient
+       gradientUnits="userSpaceOnUse"
+       y2="131.85291"
+       x2="110.14919"
+       y1="77.070274"
+       x1="55.549179"
+       id="linearGradient9521"
+       xlink:href="#linearGradient9515"
+       inkscape:collect="always" />
+  </defs>
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.24748737"
+     inkscape:cx="-260.46312"
+     inkscape:cy="316.02744"
+     inkscape:document-units="px"
+     inkscape:current-layer="layer1"
+     width="131.10236px"
+     height="184.25197px"
+     inkscape:window-width="872"
+     inkscape:window-height="624"
+     inkscape:window-x="5"
+     inkscape:window-y="48" />
+  <metadata
+     id="metadata2174">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Calque 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(-473.36088,-251.72485)">
+    <g
+       id="g1894"
+       transform="translate(428.42338,184.2561)">
+      <path
+         style="opacity:1;color:#000000;fill:url(#linearGradient9521);fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;marker:none;marker-start:none;marker-mid:none;marker-end:none;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;visibility:visible;display:inline;overflow:visible"
+         d="M 99.75,67.46875 C 71.718268,67.468752 73.46875,79.625 73.46875,79.625 L 73.5,92.21875 L 100.25,92.21875 L 100.25,96 L 62.875,96 C 62.875,96 44.9375,93.965724 44.9375,122.25 C 44.937498,150.53427 60.59375,149.53125 60.59375,149.53125 L 69.9375,149.53125 L 69.9375,136.40625 C 69.9375,136.40625 69.433848,120.75 85.34375,120.75 C 101.25365,120.75 111.875,120.75 111.875,120.75 C 111.875,120.75 126.78125,120.99096 126.78125,106.34375 C 126.78125,91.696544 126.78125,82.125 126.78125,82.125 C 126.78125,82.124998 129.04443,67.46875 99.75,67.46875 z M 85,75.9375 C 87.661429,75.937498 89.8125,78.088571 89.8125,80.75 C 89.812502,83.411429 87.661429,85.5625 85,85.5625 C 82.338571,85.562502 80.1875,83.411429 80.1875,80.75 C 80.187498,78.088571 82.338571,75.9375 85,75.9375 z "
+         id="path8615" />
+      <path
+         id="path8620"
+         d="M 100.5461,177.31485 C 128.57784,177.31485 126.82735,165.1586 126.82735,165.1586 L 126.7961,152.56485 L 100.0461,152.56485 L 100.0461,148.7836 L 137.4211,148.7836 C 137.4211,148.7836 155.3586,150.81787 155.3586,122.53359 C 155.35861,94.249323 139.70235,95.252343 139.70235,95.252343 L 130.3586,95.252343 L 130.3586,108.37734 C 130.3586,108.37734 130.86226,124.03359 114.95235,124.03359 C 99.042448,124.03359 88.421098,124.03359 88.421098,124.03359 C 88.421098,124.03359 73.514848,123.79263 73.514848,138.43985 C 73.514848,153.08705 73.514848,162.6586 73.514848,162.6586 C 73.514848,162.6586 71.251668,177.31485 100.5461,177.31485 z M 115.2961,168.8461 C 112.63467,168.8461 110.4836,166.69503 110.4836,164.0336 C 110.4836,161.37217 112.63467,159.2211 115.2961,159.2211 C 117.95753,159.2211 120.1086,161.37217 120.1086,164.0336 C 120.10861,166.69503 117.95753,168.8461 115.2961,168.8461 z "
+         style="opacity:1;color:#000000;fill:url(#linearGradient11307);fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;marker:none;marker-start:none;marker-mid:none;marker-end:none;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;visibility:visible;display:inline;overflow:visible" />
+    </g>
+  </g>
+</svg>
diff --git a/public/assets/languages/typescript.svg b/public/assets/languages/typescript.svg
new file mode 100644
index 0000000..339da0b
--- /dev/null
+++ b/public/assets/languages/typescript.svg
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="512" height="512" fill="none" version="1.1" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#">
+<title>TypeScript logo</title>
+ <rect width="512" height="512" rx="50" fill="#3178c6"/>
+ <path d="m317 407v50c8.1 4.2 18 7.3 29 9.4s23 3.1 35 3.1c12 0 23-1.1 34-3.4 11-2.3 20-6.1 28-11 8.1-5.3 15-12 19-21s7.1-19 7.1-32c0-9.1-1.4-17-4.1-24s-6.6-13-12-18c-5.1-5.3-11-10-18-14s-15-8.2-24-12c-6.6-2.7-12-5.3-18-7.9-5.2-2.6-9.7-5.2-13-7.8-3.7-2.7-6.5-5.5-8.5-8.4-2-3-3-6.3-3-10 0-3.4 0.89-6.5 2.7-9.3s4.3-5.1 7.5-7.1c3.2-2 7.2-3.5 12-4.6 4.7-1.1 9.9-1.6 16-1.6 4.2 0 8.6 0.31 13 0.94 4.6 0.63 9.3 1.6 14 2.9 4.7 1.3 9.3 2.9 14 4.9 4.4 2 8.5 4.3 12 6.9v-47c-7.6-2.9-16-5.1-25-6.5s-19-2.1-31-2.1c-12 0-23 1.3-34 3.8s-20 6.5-28 12c-8.1 5.4-14 12-19 21-4.7 8.4-7 18-7 30 0 15 4.3 28 13 38 8.6 11 22 19 39 27 6.9 2.8 13 5.6 19 8.3s11 5.5 15 8.4c4.3 2.9 7.7 6.1 10 9.5 2.5 3.4 3.8 7.4 3.8 12 0 3.2-0.78 6.2-2.3 9s-3.9 5.2-7.1 7.2-7.1 3.6-12 4.8c-4.7 1.1-10 1.7-17 1.7-11 0-22-1.9-32-5.7-11-3.8-21-9.5-30-17zm-84-123h64v-41h-179v41h64v183h51z" clip-rule="evenodd" fill="#fff" fill-rule="evenodd" style="fill:#fff"/>
+</svg>
diff --git a/public/assets/plurality.css b/public/assets/plurality.css
index 3f522eb..a7210a4 100644
--- a/public/assets/plurality.css
+++ b/public/assets/plurality.css
@@ -78,4 +78,33 @@
     text-align: center;
     margin-top: 5px;
     margin-bottom: 20px;
+}
+
+@media (max-width: 600px) {
+    #cnp-intro {
+        grid-template-columns: 1fr !important;
+        text-align: center !important;
+    }
+
+    #cnp-intro-outer {
+        padding-bottom: 10px !important;
+        margin-bottom: 10px !important;
+        border-bottom: 1px solid rgba(255, 255, 255, .25);
+    }
+
+    #cnp-image {
+        display: block;
+        margin-left: auto;
+        margin-right: auto;
+    }
+
+    #systems {
+        grid-template-columns: 1fr !important;
+    }
+
+    #system-cloudburst {
+        padding-bottom: 10px;
+        margin-bottom: 10px;
+        border-bottom: 1px solid rgba(255, 255, 255, .25);
+    }
 }
\ No newline at end of file
diff --git a/public/assets/projects.css b/public/assets/projects.css
new file mode 100644
index 0000000..e56b8eb
--- /dev/null
+++ b/public/assets/projects.css
@@ -0,0 +1,45 @@
+/*
+ * MIT License
+ *
+ * Copyright (c) 2022- Equestria.dev Developers
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ *
+ */
+
+.project {
+    display: block;
+    color: white !important;
+    text-decoration: none;
+    cursor: pointer;
+}
+
+.project .project-language {
+    float: right;
+    width: 36px;
+    height: 36px;
+}
+
+.project:hover {
+    opacity: .75;
+}
+
+.project:active, .project:focus {
+    opacity: .5;
+}
\ No newline at end of file
diff --git a/views/about.ejs b/views/about.ejs
index 1dfb4b0..9dc7a60 100644
--- a/views/about.ejs
+++ b/views/about.ejs
@@ -25,7 +25,23 @@
 <%- include("./partials/header.ejs", {title: "About Us"}) %>
 
 <div id="navbar-skipper">
-    Content here!
+    <br>
+    <div class="container">
+        <div class="section" id="this-section">
+            <!-- The pony who wrote this code is cute. - Scoots -->
+            <!-- The pony who wrote the above comment is cute. - Twi -->
+            <a class="section-title" href="#this-section">This section</a>
+            <p class="section-content">
+                We take our work very seriously, as you can see from the comments on this page.
+            </p>
+        </div>
+        <div class="section" id="another-section">
+            <a class="section-title" href="#this-section">Another section</a>
+            <p class="section-content">
+                Please don't see our code. Pleaaaaaase!
+            </p>
+        </div>
+    </div>
 </div>
 
 <%- include("./partials/footer.ejs") %>
\ No newline at end of file
diff --git a/views/broken.ejs b/views/broken.ejs
new file mode 100644
index 0000000..84c0e62
--- /dev/null
+++ b/views/broken.ejs
@@ -0,0 +1,31 @@
+<!--
+  ~ MIT License
+  ~
+  ~ Copyright (c) 2022- Equestria.dev Developers
+  ~
+  ~ Permission is hereby granted, free of charge, to any person obtaining a copy
+  ~ of this software and associated documentation files (the "Software"), to deal
+  ~ in the Software without restriction, including without limitation the rights
+  ~ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+  ~ copies of the Software, and to permit persons to whom the Software is
+  ~ furnished to do so, subject to the following conditions:
+  ~
+  ~ The above copyright notice and this permission notice shall be included in all
+  ~ copies or substantial portions of the Software.
+  ~
+  ~ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+  ~ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+  ~ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+  ~ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+  ~ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+  ~ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+  ~ SOFTWARE.
+  ~
+  -->
+<%- include("./partials/header.ejs", {title: "About Us"}) %>
+
+<div id="navbar-skipper">
+    <% throw new Error("Hello I'm a broken page") %>
+</div>
+
+<%- include("./partials/footer.ejs") %>
\ No newline at end of file
diff --git a/views/error.ejs b/views/error.ejs
new file mode 100644
index 0000000..cee0fd2
--- /dev/null
+++ b/views/error.ejs
@@ -0,0 +1,64 @@
+<!--
+  ~ MIT License
+  ~
+  ~ Copyright (c) 2022- Equestria.dev Developers
+  ~
+  ~ Permission is hereby granted, free of charge, to any person obtaining a copy
+  ~ of this software and associated documentation files (the "Software"), to deal
+  ~ in the Software without restriction, including without limitation the rights
+  ~ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+  ~ copies of the Software, and to permit persons to whom the Software is
+  ~ furnished to do so, subject to the following conditions:
+  ~
+  ~ The above copyright notice and this permission notice shall be included in all
+  ~ copies or substantial portions of the Software.
+  ~
+  ~ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+  ~ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+  ~ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+  ~ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+  ~ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+  ~ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+  ~ SOFTWARE.
+  ~
+  -->
+<%- include("./partials/header.ejs", {title: "Error " + code}) %>
+
+<div id="navbar-skipper">
+    <br>
+
+    <div class="container">
+        <h1 style="text-align: center;"><%= code %></h1>
+        <h2 style="text-align: center;"><%= message %></h2>
+        <p style="text-align: center;">An error occurred on our side, and we can't show this page for now. Please try again later! If you report a bug, a developer might ask you to give the weird code stuff below.</p>
+        <a class="btn btn-primary" href="/" style="margin-left:auto;margin-right:auto;display:block;width:max-content;">Go home</a>
+        <br>
+        <details>
+            <summary style="opacity: .5;">Show weird code stuff</summary>
+            <div style="background-color:rgba(0, 0, 0, .25);border-radius:10px;margin-top:10px;padding:10px;">
+                <ul>
+                    <li>URL: <%= req.url %></li>
+                    <%
+
+                    let ua = new UAParser(req.header('user-agent'));
+
+                    %>
+                    <li>Browser: <%= ua.getBrowser().name + " " + ua.getBrowser().version %></li>
+                    <li>Engine: <%= ua.getEngine().name + " " + ua.getEngine().version %></li>
+                    <li>Vapor Trail Version: <%= version %> (build <%= build %>)</li>
+                    <li>Core Version: <%= process.version %></li>
+                    <li>Memory (RSS): <%= (process.memoryUsage().rss / 1024).toFixed(2) %>K</li>
+                    <li>Memory (Heap Total): <%= (process.memoryUsage().heapTotal / 1024).toFixed(2) %>K</li>
+                    <li>Memory (Heap Used): <%= (process.memoryUsage().heapUsed / 1024).toFixed(2) %>K</li>
+                    <li>Memory (External): <%= (process.memoryUsage().heapUsed / 1024).toFixed(2) %>K</li>
+                    <li>Memory (Array Buffers): <%= (process.memoryUsage().arrayBuffers / 1024).toFixed(2) %>K</li>
+                </ul>
+                <% if (typeof err !== "undefined") { %>
+                <pre><%= err.stack %></pre>
+                <% } %>
+            </div>
+        </details>
+    </div>
+</div>
+
+<%- include("./partials/footer.ejs") %>
\ No newline at end of file
diff --git a/views/partials/header.ejs b/views/partials/header.ejs
index 431be60..fee03d8 100644
--- a/views/partials/header.ejs
+++ b/views/partials/header.ejs
@@ -32,6 +32,9 @@
     <link rel="stylesheet" href="/bootstrap/styles.css">
     <link rel="stylesheet" href="/assets/custom.css">
     <link rel="stylesheet" href="/assets/plurality.css">
+    <link rel="stylesheet" href="/assets/projects.css">
+    <link rel="stylesheet" href="/assets/about.css">
+    <link rel="icon" href="/assets/favicon.png" type="image/png">
     <script src="/bootstrap/script.js"></script>
     <title><%= title %> - The Cuties</title>
 </head>
diff --git a/views/plurality.ejs b/views/plurality.ejs
index 412906e..ad57734 100644
--- a/views/plurality.ejs
+++ b/views/plurality.ejs
@@ -39,10 +39,27 @@ let frontersRaindrops = raindrops['fronters']['members'].map((i) => { return i['
 <div id="navbar-skipper">
     <div class="container">
         <br>
-        <h2 style="text-align: center;">We are plural.</h2>
+        <h2 style="text-align: center;">Hello, we are plural!</h2>
+        <p style="text-align: center;"><%= (cloudburst["members"].length + raindrops["members"].length) - 2 %> ponies, 2 brains!</p>
 
+        <div id="cnp-intro-outer">
+            <div id="cnp-intro" style="display:grid;grid-template-columns: 131px 1fr;grid-gap:10px;background:#353535;border-radius:10px;padding:10px;">
+                <div id="cnp-image-outer" style="display:flex;align-items:center;">
+                    <img id="cnp-image" alt="" src="https://ponies.equestria.horse/Special:Redirect/file/Logo.jpg" style="height:131px;border-radius:10px;">
+                </div>
+                <div id="cnp-content-outer" style="display:flex;align-items:center;">
+                    <div id="cnp-content">
+                        <h4 id="cnp-title">There is even better than this page</h4>
+                        <span id="cnp-tagline">On <b>Cuties and Plurality</b>, you can get additional information about all of us, such as what each one of us likes doing, pronouns, species, and more.</span><br>
+                        <a id="cnp-link" href="https://ponies.equestria.horse" target="_blank" class="btn btn-outline-light" style="display:inline-block;margin-top:10px;">Read more</a>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <br>
         <div id="systems">
-            <div>
+            <div id="system-cloudburst">
                 <img id="system-cloudburst-icon" class="system-icon" alt="" src="<%= cloudburst["general"]["avatar_url"] %>">
                 <h3 id="system-cloudburst-name" class="system-name">Cloudburst System</h3>
                 <p id="system-cloudburst-description" class="system-description">Plural system of <%= cloudburst["members"].length - 1 %> ponies!</p>
@@ -55,7 +72,7 @@ let frontersRaindrops = raindrops['fronters']['members'].map((i) => { return i['
                 </a>
                 <% }} %>
             </div>
-            <div>
+            <div id="system-raindrops">
                 <img id="system-raindrops-icon" class="system-icon" alt="" src="<%= raindrops["general"]["avatar_url"] %>">
                 <h3 id="system-raindrops-name" class="system-name">Raindrops System</h3>
                 <p id="system-raindrops-description" class="system-description">Plural system of <%= raindrops["members"].length - 1 %> ponies!</p>
diff --git a/views/projects.ejs b/views/projects.ejs
index 2e31af1..705a1fe 100644
--- a/views/projects.ejs
+++ b/views/projects.ejs
@@ -26,12 +26,20 @@
 
 <div id="navbar-skipper">
     <br>
+    <h2 style="text-align: center;">Projects</h2>
+    <p style="text-align: center;margin-bottom:20px;"><%= Object.keys(projectCache).length %> projects we're working on</p>
     <div class="projects-container container">
         <% for (let project of Object.keys(projectCache)) { %>
-        <div class="project" id="project-<%= project %>">
-            <% let data = projectCache[project]; %>>
-            <h3 class="name"><%= data.name %>></h3>
-        </div>
+        <% let data = projectCache[project]; %>
+        <a class="project" id="project-<%= data.id %>" target="_blank"
+            <% if (![undefined, null, ""].includes(data.url)) { %>
+                href="<%= data.url %>"
+            <% } %>
+        >
+            <img class="project-language" src="/assets/languages/<%= data.language %>.svg" />
+            <h3 class="project-name"><%= data.name %></h3>
+            <p class="project-description"><%= data.description %></p>
+        </a>
         <% } %>
     </div>
 </div>
diff --git a/views/servers.ejs b/views/servers.ejs
index 1367bfe..2248c6d 100644
--- a/views/servers.ejs
+++ b/views/servers.ejs
@@ -26,6 +26,8 @@
 
 <div id="navbar-skipper">
     <br>
+    <h2 style="text-align: center;">Servers</h2>
+    <p style="text-align: center;margin-bottom:20px;"><%= Object.keys(serverCache).length %> servers we manage</p>
     <div class="server-container container">
         <% for (let server of Object.keys(serverCache)) { %>
             <div class="server" id="server-<%= server %>">