Merge pull request #16 from ProjectSegfault/akis/rewrite

Let's merge the rewrite 2
2024-11-26 08:42:04 +05:30 · 2022-06-18 17:40:32 +02:00 · 2022-06-18 17:40:32 +02:00 · b90baa022b
commit b90baa022b
parent 75c8387e1d bd7b694c02
40 changed files with 702 additions and 2502 deletions
--- a/.eslintrc.cjs
+++ b/.eslintrc.cjs
@ -1,20 +0,0 @@
-module.exports = {
-	root: true,
-	parser: '@typescript-eslint/parser',
-	extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended'],
-	plugins: ['svelte3', '@typescript-eslint'],
-	ignorePatterns: ['*.cjs'],
-	overrides: [{ files: ['*.svelte'], processor: 'svelte3/svelte3' }],
-	settings: {
-		'svelte3/typescript': () => require('typescript')
-	},
-	parserOptions: {
-		sourceType: 'module',
-		ecmaVersion: 2020
-	},
-	env: {
-		browser: true,
-		es2017: true,
-		node: true
-	}
-};
--- a/.gitignore
+++ b/.gitignore
@ -1,12 +1,8 @@
 .DS_Store
-start.sh
 node_modules
 /build
 /.svelte-kit
 /package
 .env
 .env.*
-yarn.lock
 !.env.example
-# devnol is a fucking nigger
-client/
--- a/.prettierignore
+++ b/.prettierignore
@ -0,0 +1,13 @@
+.DS_Store
+node_modules
+/build
+/.svelte-kit
+/package
+.env
+.env.*
+!.env.example
+
+# Ignore files for PNPM, NPM and YARN
+pnpm-lock.yaml
+package-lock.json
+yarn.lock
--- a/.prettierrc
+++ b/.prettierrc
@ -0,0 +1,7 @@
+{
+	"tabWidth": 4,
+	"useTabs": true,
+	"bracketSpacing": true,
+	"singleAttributePerLine": true,
+	"trailingComma": "none"
+}
--- a/README.md
+++ b/README.md
@ -8,14 +8,12 @@ If you're seeing this, you've probably already done this step. Congrats!

 ```bash
 # create a new project in the current directory
-npm init svelte@next
+npm init svelte

 # create a new project in my-app
-npm init svelte@next my-app
+npm init svelte my-app
 ```

-> Note: the `@next` is temporary
-
 ## Developing

 Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:
--- a/mdsvex.config.js
+++ b/mdsvex.config.js
@ -1,14 +0,0 @@
-import { defineMDSveXConfig as defineConfig } from "mdsvex";
-
-const config = defineConfig({
-  extensions: [".svelte.md", ".md", ".svx"],
-  layout: "./src/lib/content.svelte",
-
-  smartypants: {
-    dashes: "oldschool",
-  },
-  remarkPlugins: [],
-  rehypePlugins: [],
-});
-
-export default config;
--- a/package.json
+++ b/package.json
@ -1,33 +1,34 @@
 {
-  "name": "projectsegfaultwebsite",
-  "version": "0.0.1",
-  "scripts": {
-    "dev": "svelte-kit dev",
-    "build": "svelte-kit build",
-    "package": "svelte-kit package",
-    "preview": "svelte-kit preview",
-    "check": "svelte-check --tsconfig ./tsconfig.json",
-    "check:watch": "svelte-check --tsconfig ./tsconfig.json --watch",
-    "lint": "eslint --ignore-path .gitignore ."
-  },
-  "devDependencies": {
-    "@sveltejs/adapter-auto": "next",
-    "@sveltejs/kit": "next",
-    "@typescript-eslint/eslint-plugin": "^5.26.0",
-    "@typescript-eslint/parser": "^5.26.0",
-    "eslint": "^8.17.0",
-    "eslint-plugin-svelte3": "^4.0.0",
-    "mdsvex": "^0.10.6",
-    "svelte": "^3.48.0",
-    "svelte-check": "^2.7.1",
-    "svelte-preprocess": "^4.10.6",
-    "tslib": "^2.4.0",
-    "typescript": "~4.7.3"
-  },
-  "type": "module",
-  "dependencies": {
-    "@modular-css/svelte": "^28.1.2",
-    "@sveltejs/adapter-static": "next",
-    "svelte-seo": "^1.4.0"
-  }
-}
+	"name": "project-segfault-website",
+	"version": "2.0.0",
+	"scripts": {
+		"dev": "svelte-kit dev",
+		"build": "svelte-kit build",
+		"package": "svelte-kit package",
+		"preview": "svelte-kit preview",
+		"prepare": "svelte-kit sync",
+		"check": "svelte-check --tsconfig ./tsconfig.json",
+		"check:watch": "svelte-check --tsconfig ./tsconfig.json --watch",
+		"lint": "prettier --check --plugin-search-dir=. .",
+		"format": "prettier --write --plugin-search-dir=. ."
+	},
+	"devDependencies": {
+		"@iconify-json/fa6-solid": "^1.1.4",
+		"@iconify-json/simple-icons": "^1.1.15",
+		"@sveltejs/adapter-static": "next",
+		"@sveltejs/kit": "next",
+		"mdsvex": "^0.10.6",
+		"prettier": "^2.6.2",
+		"prettier-plugin-svelte": "^2.7.0",
+		"svelte": "^3.44.0",
+		"svelte-check": "^2.7.1",
+		"svelte-preprocess": "^4.10.6",
+		"tslib": "^2.3.1",
+		"typescript": "^4.7.2",
+		"unplugin-icons": "^0.14.4"
+	},
+	"type": "module",
+	"dependencies": {
+		"svelte-seo": "^1.4.1"
+	}
+}
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
--- a/src/app.d.ts
+++ b/src/app.d.ts
@ -1,14 +1,10 @@
-/* eslint-disable */
 /// <reference types="@sveltejs/kit" />

-// See https://kit.svelte.dev/docs/typescript
+// See https://kit.svelte.dev/docs/types#app
 // for information about these interfaces
 declare namespace App {
-	interface Locals {}
-
-	interface Platform {}
-
-	interface Session {}
-
-	interface Stuff {}
+	// interface Locals {}
+	// interface Platform {}
+	// interface Session {}
+	// interface Stuff {}
 }
--- a/src/app.html
+++ b/src/app.html
@ -2,8 +2,7 @@
 <html lang="en">
 	<head>
 		<meta charset="utf-8" />
-		<meta name="description" content="" />
-		<!--<link rel="icon" href="%sveltekit.assets%/favicon.png" />-->
+		<link rel="icon" href="%sveltekit.assets%/logo.png" />
 		<meta name="viewport" content="width=device-width, initial-scale=1" />
 		%sveltekit.head%
 	</head>
--- a/src/assets/animation.css
+++ b/src/assets/animation.css
@ -1,263 +0,0 @@
-/* ----------------------------------------------
- * Generated by Animista on 2022-4-22 18:29:34
- * Licensed under FreeBSD License.
- * See http://animista.net/license for more info. 
- * w: http://animista.net, t: @cssanimista
- * ---------------------------------------------- */
-
-/**
- * ----------------------------------------
- * animation text-flicker-in-glow
- * ----------------------------------------
- */
-@-webkit-keyframes text-flicker-in-glow {
-  0% {
-    opacity: 0;
-  }
-  10% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  10.1% {
-    opacity: 1;
-    text-shadow: none;
-  }
-  10.2% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  20% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  20.1% {
-    opacity: 1;
-    text-shadow: 0 0 30px rgba(255, 255, 255, 0.25);
-  }
-  20.6% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  30% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  30.1% {
-    opacity: 1;
-    text-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);
-  }
-  30.5% {
-    opacity: 1;
-    text-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);
-  }
-  30.6% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  45% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  45.1% {
-    opacity: 1;
-    text-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);
-  }
-  50% {
-    opacity: 1;
-    text-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);
-  }
-  55% {
-    opacity: 1;
-    text-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);
-  }
-  55.1% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  57% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  57.1% {
-    opacity: 1;
-    text-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.35);
-  }
-  60% {
-    opacity: 1;
-    text-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.35);
-  }
-  60.1% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  65% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  65.1% {
-    opacity: 1;
-    text-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.35), 0 0 100px rgba(255, 255, 255, 0.1);
-  }
-  75% {
-    opacity: 1;
-    text-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.35), 0 0 100px rgba(255, 255, 255, 0.1);
-  }
-  75.1% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  77% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  77.1% {
-    opacity: 1;
-    text-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.4), 0 0 110px rgba(255, 255, 255, 0.2), 0 0 100px rgba(255, 255, 255, 0.1);
-  }
-  85% {
-    opacity: 1;
-    text-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.4), 0 0 110px rgba(255, 255, 255, 0.2), 0 0 100px rgba(255, 255, 255, 0.1);
-  }
-  85.1% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  86% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  86.1% {
-    opacity: 1;
-    text-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.45), 0 0 110px rgba(255, 255, 255, 0.25), 0 0 100px rgba(255, 255, 255, 0.1);
-  }
-  100% {
-    opacity: 1;
-    text-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.45), 0 0 110px rgba(255, 255, 255, 0.25), 0 0 100px rgba(255, 255, 255, 0.1);
-  }
-}
-@keyframes text-flicker-in-glow {
-  0% {
-    opacity: 0;
-  }
-  10% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  10.1% {
-    opacity: 1;
-    text-shadow: none;
-  }
-  10.2% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  20% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  20.1% {
-    opacity: 1;
-    text-shadow: 0 0 30px rgba(255, 255, 255, 0.25);
-  }
-  20.6% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  30% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  30.1% {
-    opacity: 1;
-    text-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);
-  }
-  30.5% {
-    opacity: 1;
-    text-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);
-  }
-  30.6% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  45% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  45.1% {
-    opacity: 1;
-    text-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);
-  }
-  50% {
-    opacity: 1;
-    text-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);
-  }
-  55% {
-    opacity: 1;
-    text-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);
-  }
-  55.1% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  57% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  57.1% {
-    opacity: 1;
-    text-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.35);
-  }
-  60% {
-    opacity: 1;
-    text-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.35);
-  }
-  60.1% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  65% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  65.1% {
-    opacity: 1;
-    text-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.35), 0 0 100px rgba(255, 255, 255, 0.1);
-  }
-  75% {
-    opacity: 1;
-    text-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.35), 0 0 100px rgba(255, 255, 255, 0.1);
-  }
-  75.1% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  77% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  77.1% {
-    opacity: 1;
-    text-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.4), 0 0 110px rgba(255, 255, 255, 0.2), 0 0 100px rgba(255, 255, 255, 0.1);
-  }
-  85% {
-    opacity: 1;
-    text-shadow: 0 0 30px rgba(0, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.4), 0 0 110px rgba(255, 255, 255, 0.2), 0 0 100px rgba(255, 255, 255, 0.1);
-  }
-  85.1% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  86% {
-    opacity: 0;
-    text-shadow: none;
-  }
-  86.1% {
-    opacity: 1;
-    text-shadow: 0 0 30px rgba(0, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.45), 0 0 110px rgba(255, 255, 255, 0.25), 0 0 100px rgba(255, 255, 255, 0.1);
-  }
-  100% {
-    opacity: 1;
-    text-shadow: 0 0 30px rgba(0, 208, 212, 0.6), 0 0 60px rgba(255, 255, 255, 0.45), 0 0 110px rgba(255, 255, 255, 0.25), 0 0 100px rgba(255, 255, 255, 0.1);
-  }
-}
-
--- a/src/assets/global.css
+++ b/src/assets/global.css
@ -1,192 +0,0 @@
-@import url('https://fonts.googleapis.com/css2?family=Comfortaa&family=Quicksand:wght@500&display=swap');
-
-body {
-      	
-	background-color: #151515;
-        color: white;
-        font-family: 'Comfortaa', sans-serif;
-        margin: 0;
-}
-
-a {
-        color: #ce1818;
-        text-decoration: none;
-}
-a:hover {
-        color: rgb(233, 110, 110);
-}
-
-.center {
-	text-align: center;
-}
-
-.card {
-        display: flex;
-        justify-content: space-evenly;
-        flex-direction: inherit;
-        flex-wrap: wrap;
-}
-
-.card > div {
-        word-wrap: break-word;
-        margin: 50px;
-        padding: 20px;
-        border-radius: 25px;
-        background-color: #252525;
-        box-shadow: 0 0 5px 5px #252525;
-}
-
-.button {
-  background-color: #00755e; /* Green */
-  border: none;
-  font-family: 'Comfortaa', sans-serif;
-  color: white;
-  padding: 16px 32px;
-  text-align: center;
-  text-decoration: none;
-  display: inline-block;
-  font-size: 16px;
-  margin: 4px 2px;
-  border-radius: 16px;
-  transition-duration: 0.4s;
-  cursor: pointer;
-}
-
-.button:hover {
- 	background-color: #00d4aa;
-	color: black;
-	transform: translateY(-0.25em);
-	box-shadow: 0 0.5em 0.5em -0.4em #00755e;
-}
-.button:active {
-	transform: translateY(0.10em);
-	background-color: #4beacb;
-	box-shadow: 0 0.2em 0.2em -0.2em #00c7a1;
-}
-
-.ResponsiveImage {
-        max-inline-size: 50%;
-        block-size: auto;
-        aspect-ratio: 2/1;
-        object-fit: contain;
-}
-
-.pointyfinger {
-        cursor: pointer;
-}
-
-.roundedimage {
-        border-radius: 100px;
-}
-
-.midoucolored:hover {
-	background-color: #a44ef4;
-	color: #fff ;
-	box-shadow: 0 0.5em 0.5em -0.4em #c78bff;
-
-}
-.midoucolored:active {
-	background-color: #c78bff;
-	color: #fff;
-	box-shadow: 0 0.2em 0.2em -0.2em #c78bff;
-}
-.odysscolored:hover {
-        background-color: #75b877;
-        color: #000 ;  
-        box-shadow: 0 0.5em 0.5em -0.4em #74e578;
- 
-}
-.odysscolored:active {
-        background-color: #74e578;
-        color: #000;
-        box-shadow: 0 0.2em 0.2em -0.2em #74e578;
-}
-
-.pleromacolored:hover {
-        box-shadow: 0 0.2em 0.2em -0.2em #fba457;
-        background-color: #fba457;
-}
-
-.pleromacolored:active {
-        background-color: #ffcc55;
-}
-
-.catcolored:hover {
-        box-shadow: 0 0.2em 0.2em -0.2em #f1f2ff;
-        background-color: #f1f2ff;
-}
-
-.matrixcolored {
-        background-color: #fff;
-	color: #000;
-}
-
-.matrixcolored:hover {
-        background-color: #099970;
-        color: #fff;
-}
-
-.discordcolored {
-        background-color: #5865F2;
-}
-
-.discordcolored:hover {
-        background-color: hsl(235,calc(var(--saturation-factor, 1)*86.1%),71.8%); /* I didn't steal this from their website DONT SUE ME DONT FUCKING SUE ME PLEASEEEEEEEEEEEEEEEE */
-        color: #fff;
-}
-
-.githubcolored {
-        background-color: #333333;
-}
-
-.githubcolored:hover {
-        background-color: #666666;
-        color: #fff;
-}
-.gameserversCardTitle, .centreofattention {
-        text-align: center;
-}
-
-#wordwrappedlongthingaaa {
-        word-wrap: break-word;
-}
-
-#shitfuck {
-        display: inline-block;
-        width: 80%;
-        word-wrap: break-word;
-}
-
-#MenuButton {
-        display: none;
-}
-
-@media screen and (max-width: 800px) {
-  .card {
-    flex-direction: column;
-  }
-  .ResponsiveImage {
-        max-inline-size: 100%;
-  }
-
-  .navbar {display: none;}
-
-  .navbar.responsive {display: initial;}
-  /*.navbarpieceofshitfuckihatethis.responsive a {
-    float: none;
-    display: block;
-    text-align: left;
-  }*/
-  #MenuButton {
-        display: initial;
-  }
-
-  #shitfuck {
-        display: initial;
-  }
-}
-
-.oh-fuck-center {
-	line-height: 1.8;
-	text-align: center;
-}
--- a/src/assets/images/Cat.png
+++ b/src/assets/images/Cat.png
--- a/src/assets/images/CatLooking.png
+++ b/src/assets/images/CatLooking.png
--- a/src/assets/images/DevnolNamesACat.png
+++ b/src/assets/images/DevnolNamesACat.png
--- a/src/lib/Footer.svelte
+++ b/src/lib/Footer.svelte
@ -0,0 +1,70 @@
+<script>
+    import IconDiscord from "~icons/simple-icons/discord";
+    import IconMatrix from "~icons/simple-icons/matrix";
+    import IconGitHub from "~icons/simple-icons/github";
+    import IconSignal from "~icons/fa6-solid/signal";
+</script>
+
+<footer>
+    <hr />
+    <div class="content">
+            <span>© 2021 - present, Project Segfault</span>
+
+            <div class="links">
+                <a href="https://matrix.to/#/#project-segfault:projectsegfau.lt">
+                    <IconMatrix />
+                </a>
+                <a href="https://discord.gg/26EG7fFtfS">
+                    <IconDiscord />
+                </a>
+                <a href="https://github.com/ProjectSegfault">
+                    <IconGitHub />
+                </a>
+                <a href="https://status.projectsegfau.lt/">
+                    <IconSignal />
+                </a>
+            </div>
+    </div>
+</footer>
+
+<style>
+    footer {
+        padding: 1rem;
+        display: flex;
+        flex-direction: column;
+        font-size: 20px;
+    }
+
+    hr {
+        color: var(--accent-primary);
+        width: 100%;
+        margin-left: 0;
+    }
+
+    div.content {
+        display: flex;
+        justify-content: space-between;
+    }
+
+    div.links {
+        display: flex;
+        gap: 12px;
+        margin-left: 8px;
+    }
+
+    .links a {
+        text-decoration: none;
+    }
+
+    @media only screen and (max-width: 500px) {
+        .content {
+            display: flex;
+            flex-direction: column;
+            gap: 8px;
+        }
+
+        div.links {
+            margin-left: 0;
+        }
+    }
+</style>
--- a/src/lib/Header.svelte
+++ b/src/lib/Header.svelte
@ -1,65 +0,0 @@
-<script context="module">
-    export const prerender = true;
-    export const hydrate = true;
-</script>
-<script lang="ts">
-	import "../assets/animation.css";
-	import ProjectSegfaultLogo from "../assets/images/projectsegfault1.png";
-    let showMenu = false
-    let innerWidth
-    let mobile
-    $: mobile = innerWidth < 800
-</script>
-
-<svelte:window bind:innerWidth />
-
-<header id="navigationBar" class="navigvationBar">
-    <a href="/">
-        <img src={ProjectSegfaultLogo} id="ProjectSegfaultLogoHeader" alt="Logo."/>
-    </a>
-    <a href="/" class="text-flicker-in-glow" style="color: #ce1717">Project <span style="color: #00d4aa">Segfault</span></a>
-    {#if mobile}
-        <a href="{'#'}" class="button" id="MenuButton" on:click="{() => showMenu = !showMenu}">Menu</a>
-    {/if}
-   {#if !mobile || showMenu}
-   <div class="center navbar" id="navbar" class:responsive={mobile}>
-    <a href="https://instances.projectsegfau.lt" class="button">Instances & Gameservers </a>
-    
-    <a href="/minecraft" class="button">Minecraft</a>
-
-    <a href="/donate" class="button">Donate</a>
-    
-    <a href="/faq" class="button">FAQ</a>
-
-    <a href="/members" class="button">Members</a>
-
-    <a href="/contact" class="button">Contact</a>
-   </div>
-   {/if}
-</header>
-
-<style>
-    header {
-        background-color: #252525;
-        border: solid #252525;
-        border-width: 1em;
-    }
-    #ProjectSegfaultLogoHeader {
-        /*Here goes anything to do with the header logo*/
-        border-radius: 16px;
-        width: 32px;
-	    vertical-align: middle;
-	    display: inline-block;
-    }
-    .text-flicker-in-glow {
-	    opacity: 1;
-        -webkit-animation: text-flicker-in-glow 3000ms both;
-	    animation: text-flicker-in-glow 3000ms both;
-    }
-    @media screen and (prefers-reduced-motion) {
-	    .text-flicker-in-glow {
-	    	opacity: 1;
-            animation: none;
-       }
-    }
-</style>
--- a/src/lib/Nav.svelte
+++ b/src/lib/Nav.svelte
@ -0,0 +1,86 @@
+<script>
+    import * as strings from "$lib/strings";
+</script>
+
+<nav>
+    <a class="brand" href="/">
+        <img src="/logo.png" alt="Project Segfault logo">
+        <span style="color: var(--accent-secondary); margin-left: 4px; margin-right: 4px;">{strings.PROJECT}</span>
+        <span style="color: var(--accent-primary); margin-right: 8px;">{strings.SEGFAULT}</span>
+    </a>
+
+    <div class="links">
+        <a href="https://instances.projectsegfau.lt/">{strings.INSTANCES}</a>
+        <a href="/minecraft">{strings.MINECRAFT}</a>
+        <a href="/donate">{strings.DONATE}</a>
+        <a href="/faq">{strings.FAQ}</a>
+        <a href="/contact">{strings.CONTACT}</a>
+        <a href="https://blog.projectsegfau.lt/">{strings.BLOG}</a>
+    </div>
+</nav>
+
+<style>
+    nav {
+        background-color: var(--secondary);
+        padding: 1rem;
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        justify-content: space-between;
+    }
+
+    a.brand {
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        text-decoration: none;
+    }
+
+    .links > * {
+        background-color: var(--tertiary);
+        border: none;
+        border-radius: 10px;
+        padding: 1rem;
+        cursor: pointer;
+        color: var(--text);
+        font-family: var(--font-primary);
+        text-decoration: none;
+    }
+
+    .links > *:hover {
+        background-color: var(--accent-tertiary);
+        text-decoration: none;
+	    transition: all 0.5s;
+	    color: var(--secondary);
+    }
+
+    .links > *:active {
+        background-color: var(--accent-primary);
+        text-decoration: none;
+	    transition: all 0.5s;
+	    color: var(--secondary);
+    }
+
+    img {
+        height: 36px;
+        border-radius: 50%;
+    }
+
+    div.links {
+        display: flex;
+        gap: 8px;
+    }
+
+    @media only screen and (max-width: 820px) {
+        nav {
+            flex-direction: column;
+            align-items: flex-start;
+        }
+
+        div.links {
+            flex-direction: column;
+            margin-top: 10px;
+            gap: 19px;
+        }
+    }
+</style>
--- a/src/lib/app.css
+++ b/src/lib/app.css
@ -0,0 +1,33 @@
+@font-face {
+    font-family: Comfortaa;
+    src: url("/Comfortaa.ttf");
+    font-display: swap;
+}
+
+html {
+    --primary: #151515;
+    --secondary: #252525;
+    --tertiary: #353535;
+    --accent-primary: #00d4aa;
+    --accent-secondary: #ce1717;
+    --text: #fff;
+    --font-primary: Comfortaa;
+    --accent-tertiary: #4beacb;
+}
+
+body {
+    font-family: var(--font-primary);
+    background-color: var(--primary);
+    color: var(--text);
+    margin: 0;
+}
+
+main {
+    padding: 1rem;
+}
+
+a {
+    text-decoration: underline;
+    color: var(--accent-primary);
+    text-underline-offset: 5px;
+}
--- a/src/assets/images/Monero.png
+++ b/src/assets/images/Monero.png
--- a/src/lib/strings.json
+++ b/src/lib/strings.json
@ -0,0 +1,10 @@
+{
+    "PROJECT": "Project",
+    "SEGFAULT": "Segfault",
+    "INSTANCES": "Instances & Gameservers",
+    "MINECRAFT": "Minecraft",
+    "DONATE": "Donate",
+    "FAQ": "FAQ",
+    "CONTACT": "Contact",
+    "BLOG": "Blog"
+}
--- a/src/routes/404.md
+++ b/src/routes/404.md
@ -1,21 +0,0 @@
---
-title: 404
-description: This isn't where you're supposed to be!
---
-<script lang="ts">
-    import CatLooking from "../assets/images/CatLooking.png";
-</script>
-
-<div class="oh-fuck-center">
-
-# {title}
-
-## {description}
-
-Don't worry, this cat is also looking for the page.
-
-<img src={CatLooking} alt="Cta" class="ResponsiveImage pointyfinger roundedimage" width="1600" height="900" onclick="window.open(this.src)">
-
-[Go home](/) or [get lost](https://instances.projectsegfau.lt)
-
-</div>
--- a/src/routes/__layout.svelte
+++ b/src/routes/__layout.svelte
@ -1,15 +1,11 @@
-<script lang="ts">
-    import Header from "$lib/Header.svelte"
-    import '../assets/global.css'
-    import SvelteSeo from "svelte-seo"
+<script>
+    import "$lib/app.css";
+    import Nav from "$lib/Nav.svelte";
+    import Footer from "$lib/Footer.svelte";
 </script>

-<svelte:head>
-    <title>Project Segfault</title>
-</svelte:head>
-
-<Header />
-
+<Nav />
 <main>
-    <slot></slot>
-</main>
+    <slot />
+</main>
+<Footer />
--- a/src/routes/branding.md
+++ b/src/routes/branding.md
@ -1,17 +0,0 @@
---
-title: Project Segfault Branding
-description: The files for Project Segfault's Branding
---
-
-
-# {title}
-
-## {description}
-
-### Legal
-Our branding is protected under Creative Commonns Attribution-ShareAlike 4.0 International (CC BY-SA 4.0).
-
-### Now let's get into the branding
-We put pretty much everything you need on [GitHub](https://github.com/ProjectSegfault/brandng).
-
-Read the README there, there's guidelines and everything you'd need in it.
--- a/src/routes/contact.md
+++ b/src/routes/contact.md
@ -3,8 +3,6 @@ title: Contact Us
 description: Do you want to contact us?
 ---

-<div class="oh-fuck-center">
-
 # {title}
 ## {description}

@ -20,16 +18,77 @@ description: Do you want to contact us?
 <p><a href="https://matrix.to/#/#project-segfault:projectsegfau.lt">Matrix</a></p>

 <div id="Active" style="display:none">
+    <h1>People</h1>

-	<p style="font-size: 25px; line-height: 0.3">Midou</p><p> <a class="button matrixcolored" style="padding: 10px 16px;"href="https://matrix.to/#/@midou:projectsegfau.lt">[Matrix]</a></p>
-	<p style="font-size: 25px; line-height: 0.3">Mrlerien </p><p><a class="button discordcolored" style="padding: 10px 16px" href="https://discordapp.com/users/213634643327582208">Discord</a></p>
-	<p style="font-size: 25px; line-height: 0.3">Odyssey </p> <p><a style="padding: 10px 16px" class="button matrixcolored" href="https://matrix.to/#/@odyssey346:projectsegfau.lt">|Matrix]</a> <a style="padding: 10px 16px" class="button discordcolored" href="https://discordapp.com/users/315843700490240002">Discord</a></p>
-	<p style="font-size: 25px; line-height: 0.3">Devnol</p> <p> <a style="padding: 10px 16px" class="button matrixcolored" href="https://matrix.to/#/@devnol:projectsegfau.lt">|Matrix]</a> <a class="button discordcolored" href="https://discordapp.com/users/429353559566319626" style="padding: 10px 16px">Discord</a></p>
+	<div>
+        <span>Midou:</span>
+        <a class="matrixcolored" href="https://matrix.to/#/@midou:projectsegfau.lt">[Matrix]</a>
+    </div>

+
+	<div>
+        <span>MrLeRien:</span>
+        <a class="discordcolored" href="https://discord.com/users/213634643327582208">Discord</a>
+    </div>
+
+	<div>
+        <span>Odyssey:</span>
+        <a class="matrixcolored" href="https://matrix.to/#/@odyssey346:projectsegfau.lt">[Matrix]</a>
+        <a class="discordcolored" href="https://discord.com/users/315843700490240002">Discord</a>
+    </div>
+
+	<div>
+        <span>Devnol:</span>
+        <a class="matrixcolored" href="https://matrix.to/#/@devnol:projectsegfau.lt">[Matrix]</a>
+        <a class="discordcolored" href="https://discordapp.com/users/429353559566319626">Discord</a>
+    </div>
 </div>

-<button  id="hide" type="button" class="button" onclick='document.getElementById("Active").style.display ="block"; document.getElementById("hide").style.display = "none" ;'>Click to show who is active on what platform</button>
+<button 
+    id="hide"
+    type="button"
+    onclick='document.getElementById("Active").style.display ="block"; document.getElementById("hide").style.display = "none" ;'
+>
+    Click to show who is active on what platform
+</button>

+<style>
+    button {
+        background-color: var(--accent-primary);
+        border: none;
+        border-radius: 10px;
+        padding: 1rem;
+        cursor: pointer;
+        font-family: var(--font-primary);
+    }

+    #Active {
+        display: flex;
+        flex-direction: column;
+    }

-</div>
+    #Active > div {
+        margin-top: 36px;
+        margin-bottom: 36px;
+    }
+
+    #Active a {
+        border: none;
+        border-radius: 10px;
+        padding: .5rem;
+        cursor: pointer;
+        font-family: var(--font-primary);
+        color: var(--secondary);
+        text-decoration: none;
+        margin-right: 8px;
+    }
+
+    .matrixcolored {
+        background-color: #fff;
+    }
+
+    .discordcolored {
+        background-color: #5865F2;
+        color: #fff !important;
+    }
+</style>
--- a/src/routes/donate.md
+++ b/src/routes/donate.md
@ -3,11 +3,9 @@ title: Donate to Project Segfault
 description: Our donation methods
 ---
 <script lang="ts">
-    import MoneroQR from "../assets/images/Monero.png";
+    import MoneroQR from "$lib/images/Monero.png";
 </script>

-<div class="oh-fuck-center">
-
 # {title}
 ## {description}

@ -17,6 +15,30 @@ If you donate, we will be more motivated to work on the server and host more stu
 # yeah sure I'll donate. links?


-Monero: <span id="wordwrappedlongthingaaa">47L7Qsto7XcifY3CdG18ySe5Tt83kpFLDLve9jQwbc9taPBLNGv6ZrJNUKpMG9Nj9zHgCZ4FQMSyt75e8Jvx12JFLtJyFdA</span>
-<img src={MoneroQR} alt="Monero Qr Code" class="ResponsiveImage">
+<div class="monero">
+    <span>Monero: <code>47L7Qsto7XcifY3CdG18ySe5Tt83kpFLDLve9jQwbc9taPBLNGv6ZrJNUKpMG9Nj9zHgCZ4FQMSyt75e8Jvx12JFLtJyFdA</code></span>
+    <img src={MoneroQR} alt="Monero Qr Code">
 </div>
+
+<style>
+    .monero {
+        display: flex;
+        align-items: center;
+    }
+
+    .monero > img {
+        margin-left: 8px;
+    }
+
+    @media only screen and (max-width: 930px) {
+        .monero {
+            flex-direction: column;
+            align-items: flex-start;
+        }
+
+        .monero > img {
+            margin-left: 0;
+            margin-top: 8px;
+        }
+    }
+</style>
--- a/src/routes/faq.md
+++ b/src/routes/faq.md
@ -3,8 +3,6 @@ title: FAQ
 description: Frequently or not frequently asked questions about Project Segfault!
 ---

-<div class="oh-fuck-center">
-
 # {title}
 ## Who is the project owner?
 Orignally: Midou (Sysadmin) and Mrlerien (Hoster), but now Odyssey346 (Game Server Sysadmin, webdev and social media manager) and Devnol (Hoster) are with us.
@ -20,6 +18,4 @@ If it's something personal, just say that you have a report against someone on o
 Well, you really can't. We don't make our logs or anything public, however, if you would like the data we have on you, please contact us. If you're paranoid, **you are allowed to use Tor on our services**, but we don't host any .onion links.

 # Which ways do you prefer to communicate?
-Look at <a href="/contact">Contact</a>.
-
-</div>
+Look at <a href="/contact">Contact</a>.
--- a/src/routes/gameservers.md.disabled
+++ b/src/routes/gameservers.md.disabled
@ -1,51 +0,0 @@
---
-title: Our Gameservers
---
-# {title}
-## The places to release good chemicals in your brain
-
-### Note: MOST OF THESE ARE NOT ONLINE! We're too fucking lazy to get them back right now.
-<div class="centreofattention">
-    Please use common sense when playing on our servers. (<a href="https://www.google.com/search?q=i%27m%20stupid%20and%20i%20dont%20know%20what%20common%20sense%20is%20so%20i%20have%20to%20google%20it" target="_blank">What is common sense?</a>)
-    <br>
-    <a href="https://discord.gg/26EG7fFtfS" style="color: #5865F2">Our Discord server</a>
-</div>
-<div class="card">
-    <div id="gmod">
-        <h3 class="gameserversCardTitle"> Garry's Mod </h3>
-        <a href="https://gmod.projectsegfau.lt">Garry's Mod has it's own website. Check it out here!</a>
-        <br>
-        <a href="steam://connect/gmodsrv.projectsegfau.lt">Connect to the server using this link</a>
-        <br>
-        <a href="https://www.gametracker.com/server_info/176.174.120.242:27015/" target="_blank">GameTracker Link</a>
-    </div>
-    <div id="hl2dm">
-        <h3 class="gameserversCardTitle"> Half-Life 2 Deathmatch </h3>
-        <b>Server name in browser list: MutaToiletTips</b>
-        <br>
-        Almost pure vanilla hl2dm server where you can have lots of fun chucking toilets at people
-        <br>
-        <a href="steam://connect/176.174.120.242:27017">Connect to the server using this link</a>
-        <br>
-        <a href="https://www.gametracker.com/server_info/176.174.120.242:27017/" target="_blank">GameTracker Link</a>
-    </div>
-    <div id="ricochet">
-        <h3 class="gameserversCardTitle"> Ricochet </h3>
-        <b>Server name in browser list: MutaRicochetTips</b>
-        <br>
-        Our mission is to become the #1 Ricochet server in the world. It probably already is.
-        <br>
-        <a href="steam://connect/176.174.120.242:27016">Connect to the server using this link</a>
-        <br>
-    </div>
-    <div id="hldm">
-        <h3 class="gameserversCardTitle"> Half-Life: Deathmatch </h3>
-        <b>Server name in browser list: MutaCascadeTips</b>
-        <br>
-        Fun, casual Half-Life: Deathmatch. Perfect for when you dig out that old computer you found in your attic.
-        <br>
-        <a href="steam://connect/176.174.120.242:27018">Connect to the server using this link</a>
-        <br>
-        <a href="https://www.gametracker.com/server_info/176.174.120.242:27018/" target="_blank">GameTracker Link</a>
-    </div>
-</div>
--- a/src/routes/index.md
+++ b/src/routes/index.md
@ -1,25 +1,14 @@
 ---
 title: Project Segfault
-description: 4 idiots & one Sun server.
+description: 4 idiots, a Sun server and a Hitachi Compute Rack.
 ---
-<div class="oh-fuck-center">

 # {title}

-<a href="https://matrix.to/#/#project-segfault:projectsegfau.lt" class="button matrixcolored">Matrix</a>
-
-<a href="https://discord.gg/26EG7fFtfS" class="button discordcolored">Discord</a>
-
-<a href="https://github.com/ProjectSegfault" class="button githubcolored">GitHub</a>
-
-<a href="https://blog.projectsegfau.lt" class="button">Blog</a>
-
-
 ## {description}

 # what
-<span id="shitfuck">We are 4 teenagers who have a decently powerful server. What do we do with this server? Host game servers and random assortment of privacy respecting tools like Invidious, Nextcloud, Matrix etc.... and maybe some original works. You'll see eventually!</span>
+We are 4 teenagers who have a decently powerful server. What do we do with this server? Host game servers and random assortment of privacy respecting tools like Invidious, Nextcloud, Matrix etc.... and maybe some original works. You'll see eventually!

-# shut up nerd, I want to play games. Give me your ips!!!!
-There should be a navbar at the top.
-</div>
+# Tell me more! What do you guys host? Where can I contact you? Can you fix my daughter's iPad?
+We can't fix your daughter's iPad, but there is a navigation bar at the top of the page with links to websites that explain things about us, or contain useful information about us.
--- a/src/routes/instances.md.disabled
+++ b/src/routes/instances.md.disabled
@ -1,52 +0,0 @@
---
-title: Our Instances
---
-# {title}
-## Privacy-respecting services hosted on our network.
-
-<div class="centreofattention">
-   <p>Notice: Invidious, Libreddit, LBRY and nitter will move to the new domains soon.<p/> 
-</div>
-<div class="card">
-    <div id="inv">
-        <h3 class="instances"> Invidious </h3>
-        <br>
-        Tired of using YouTube on an old PC? Too Bloated? Want less tracking? Invidious is for you.
-        <br>
-        <a href="https://invidious.mutahar.rocks">Click here to access the website.</a>
-        <br>
-    </div>
-    <div id="libr">
-        <h3 class="instances"> Libreddit </h3>
-        <br>
-        Want to become a redditor? Wait actually you shouldn't- 
-        <br>
-        <a href="https://libreddit.mutahar.rocks">Click here to access the website.</a>
-        <br>
-    </div>
-    <div id="lbry">
-        <h3 class="instances"> Librarian (LBRY)</h3>
-        <br>
-        Even with Odysee, we still can't have nice things.
-        <br>
-        <a href="https://lbry.mutahar.rocks">Click here to access the website.</a>
-        <br>
-    </div>
-    <div id="nitt">                                                                                                  
-        <h3 class="instances"> Nitter </h3>                                                                 
-        <br>                                                                                                         
-        You want to check something on twitter? Oh wait you don't have an account.. No worries! 
-        <br>                                                                                                         
-        <a href="https://nitter.mutahar.rocks">Nitter is here for that.</a>                                   
-        <br>                                                                                                         
-    </div>
-    <div id="pleroma">
-        <h3 class="instances"> Pleroma (Fediverse) </h3>
-        <br>
-        Imagine a twitter-like social media that is distributed throughout a network of individual servers and applications...
-        Then you should use Pleroma. It's like Twitter but less stupid and open source and decentralized. Works with the Fediverse, so you can see all your friends.
-        <br>
-        <a href="https://social.projectsegfau.lt">Click me to access our Pleroma instance</a>
-        <br>
-    </div>
-</div>
--- a/src/routes/members.md
+++ b/src/routes/members.md
@ -1,38 +0,0 @@
---
-title: Members of the project
-description: A list of the members of Project Segfault!
---
-<script lang="ts">
-    import DevnolNamesACat from "../assets/images/DevnolNamesACat.png";
-    import Cat from "../assets/images/Cat.png";
-</script>
-
-
-<div class="oh-fuck-center">
-
-# {title}
-
-## {description}
-
-<h2 style="color: #a44ef4"> Midou </h2>
-Project owner, manages the team. 
-<p><a href="https://miicord.com" class="button midoucolored">His website</a> <a href="https://social.projectsegfau.lt/Midou" class="button pleromacolored">His Pleroma account</a></p>
-
-<h2> MrLeRien </h2>
-Project co-owner + Hoster (hosts the Hitachi server in France), master of coins.
-
-<h2 style="color: #7bc27d"> Odyssey346 </h2>
-Chief Gaming Officer, web developer and occasional service borker. 
-<p><a href="https://odyssey346.github.io" class="button odysscolored">His website</a> <a href="https://social.projectsegfau.lt/Odyssey346" class="button pleromacolored">His Pleroma account</a></p>
-
-<h2 style="color: #00d4aa"> Devnol </h2>
-Owner of our Helios server in Greece. 
-<p><a href="https://devnol.github.io" class="button">His website</a><a href="https://social.projectsegfau.lt/Panos" class="button pleromacolored">His Pleroma account</a></p>
-
-
-<h2 style="color: #f1f2ff"><a href={DevnolNamesACat} target="_blank" style="color: #f1f2ff; text-decoration: underline;">"Segfault"</a></h2>
-Chief Cuteness Officer
-<p><a href={Cat} target="_blank" class="button catcolored">Selfie</a><p>
-
-
-</div>
--- a/src/routes/minecraft_recommendedcsmods.md
+++ b/src/routes/minecraft_recommendedcsmods.md
@ -3,7 +3,7 @@ title: Project Segfault MC
 ---
 # {title}

-# [Click me to go back to the Minecraft site](minecraft)
+# [Click me to go back to the Minecraft site](/minecraft)

 ## Recommended mods list
 These are picked by our community or are for server features like voice chatting.
--- a/src/routes/minecraft/index.md
+++ b/src/routes/minecraft/index.md
@ -3,8 +3,6 @@ title: Project Segfault MC
 description: Yeah, we have a Minecraft server.
 ---

-<div class="oh-fuck-center">
-
 # {title}

 # {description}
@ -35,7 +33,7 @@ If you would like to join, please [join our Discord](https://discord.gg/26EG7fFt
 [MC Server Connector for Android](https://play.google.com/store/apps/details?id=com.smokiem.mcserverconnector&hl=no&gl=US)

 ## Recommended Client-Side Mods
-[Click me for a list of recommended client-side mods](minecraft_recommendedcsmods)
+[Click me for a list of recommended client-side mods](/minecraft/client-side-mods)

 ## Plugin list
 This is a manually made list of our plugins, so it might not be up to date.
@ -51,6 +49,4 @@ This is a manually made list of our plugins, so it might not be up to date.
 - ViaVersion (You may only connect from a base version and its subversions (1.18, 1.18.1, 1.18.2). You cannot connect from a major version older than the major version the server is running.)
 - PlugMan
 - CombatLogX
- Simple Voice Mod
-
-</div>
+- Simple Voice Mod
--- a/src/routes/rules.md.disabled
+++ b/src/routes/rules.md.disabled
@ -1,52 +0,0 @@
---
-title: Our Rules
---
-# {title}
-## Follow these or you're dumb
-
-### Section 1 - General
-1. Do not destroy other's bases.
-2. Do not harass other users.
-3. Do not use anything that could put others at a disadvantage (xray, cheats, exploits like duping etc)
-4. You are not allowed to automate processes like fishing while you're away from your keyboard (you are allowed to do something else while you're fishing though, like be on your phone, but you must fish manually without the use of any software.)
-5. Do not kill people for no reason. If you hit someone, then they are allowed to fight back, even if it was an accident.
-
-### Section 2 - Island/Area Claims
-#### You can claim islands for yourself. Here's the rules for that though:
-1. You can't claim islands the size of fucking Russia. 
-2. You may only have max 8 islands, but if they're all massive, your max is 3.
-3. Your islands must be visible on dynmap (use a sign with [dynmap] on the start)
-4. An island owner may kill anyone on sight.
-
-### Section 3 - Trading
-1. If someone is in the process of trading, you cannot be near them (be at least 5 blocks apart).
-2. If you picked up an item that was being traded, give it back. If you do not give it back in at least 10 seconds, the people who trading are allowed to kill you.
-3. Do not deal damage to anyone who is trading.
-4. If you're trading, please advertise it in the chat.
-
-### Section 4 - Wars
-1. You are allowed to start wars against alliances and people for reasons like stealing your things, destroying your stuff, and killing your dog (Oh also by the way if you kill a dog the owner is allowed to go John Wick on you)
-2. Alliances are allowed to start wars against other alliances without needing a reason.
-3. Do not log out during combat.
-4. Do not attempt to trap people who have logged out during a war. They could have disconnected for multiple reasons, it's not always because they don't want to fight.
-5. You may not start wars or raid a base owned by someone who is offline.
-6. You are allowed to bypass the max claims limit in case you want to set up a temporary claimed area for basing during a war.
-### Section 5 - Alliances
-1. Alliances are allowed to have one island only. (Except in special cases, please negotiate with an admin about this if you feel like you need two)
-2. Alliances must be clearly advertised. (I'll try to make something in for this)
-3. Alliances are allowed to go at war, but this must be for a reasonable reason (Not something petty like someone going on your island)
-4. Alliances can go against other alliances for any reason though.
-
-### Section 6 - Griefing
-1. Do not destroy villages for no reason.
-2. Do not destroy other's crops. If you accidentally step on one, please replant. If you can't, please say so in the chat.
-3. Do not make massive useless buildings unless it's on your island/claimed area. Things like lavacasts are only permitted on your areas.
-4. Do not burn or explode public buildings. This is very unacceptable.
-
-### Section 7 - Traps
-1. Do not trap nether portals. This means don't place obisidan or any other blocks that could trap people inside your nether portal.
-2. Don't be into traps - what the fuck that's kinda gay pal
-
-### Section 8 - Bases
-1. Do not attempt to bypass base protection like [Private] signs on doors.
-2. You are not allowed to destroy bases. I mean, it would be fun, but like, it probably took them lots of time.
--- a/static/Comfortaa.ttf
+++ b/static/Comfortaa.ttf
--- a/static/favicon.ico
+++ b/static/favicon.ico
--- a/static/logo-outline.png
+++ b/static/logo-outline.png
--- a/src/assets/images/projectsegfault1.png
+++ b/src/assets/images/projectsegfault1.png
--- a/svelte.config.js
+++ b/svelte.config.js
@ -1,21 +1,33 @@
+import adapter from '@sveltejs/adapter-static';
+import preprocess from 'svelte-preprocess';
+import icons from 'unplugin-icons/vite'
 import { mdsvex } from "mdsvex";
-import mdsvexConfig from "./mdsvex.config.js";
-import adapter from "@sveltejs/adapter-static";
-import preprocess from "svelte-preprocess";

 /** @type {import('@sveltejs/kit').Config} */
 const config = {
-  extensions: [".svelte", ...mdsvexConfig.extensions],
+	// Consult https://github.com/sveltejs/svelte-preprocess
+	// for more information about preprocessors
+	extensions: [".svelte", ".md"],

-  // Consult https://github.com/sveltejs/svelte-preprocess
-  // for more information about preprocessors
-  preprocess: [preprocess(), mdsvex(mdsvexConfig)],
+	preprocess: [
+		preprocess(),
+		mdsvex({
+			extensions: [".md"],
+			layout: "./src/lib/content.svelte"
+		})
+	],

+	kit: {
+		adapter: adapter(),

-  kit: {
-    adapter: adapter(),
-    prerender: { default: true }
-  },
+		vite: {
+			plugins: [
+				icons({
+					compiler: 'svelte',
+				}),
+			],
+		},
+	}
 };

 export default config;
--- a/tsconfig.json
+++ b/tsconfig.json
@ -1,36 +1,13 @@
 {
+	"extends": "./.svelte-kit/tsconfig.json",
 	"compilerOptions": {
-		"moduleResolution": "node",
-		"module": "es2020",
-		"lib": ["es2020", "DOM"],
-		"target": "es2020",
-		/**
-			svelte-preprocess cannot figure out whether you have a value or a type, so tell TypeScript
-			to enforce using \`import type\` instead of \`import\` for Types.
-		*/
-		"importsNotUsedAsValues": "error",
-		/**
-			TypeScript doesn't know about import usages in the template because it only sees the
-			script of a Svelte file. Therefore preserve all value imports. Requires TS 4.5 or higher.
-		*/
-		"preserveValueImports": true,
-		"isolatedModules": true,
-		"resolveJsonModule": true,
-		/**
-			To have warnings/errors of the Svelte compiler at the correct position,
-			enable source maps by default.
-		*/
-		"sourceMap": true,
-		"esModuleInterop": true,
-		"skipLibCheck": true,
-		"forceConsistentCasingInFileNames": true,
-		"baseUrl": ".",
 		"allowJs": true,
 		"checkJs": true,
-		"paths": {
-			"$lib": ["src/lib"],
-			"$lib/*": ["src/lib/*"]
-		}
-	},
-	"include": ["src/**/*.d.ts", "src/**/*.js", "src/**/*.ts", "src/**/*.svelte"]
+		"esModuleInterop": true,
+		"forceConsistentCasingInFileNames": true,
+		"resolveJsonModule": true,
+		"skipLibCheck": true,
+		"sourceMap": true,
+		"strict": true
+	}
 }