Added prettier

.prettierignore

@@ -0,0 +1,11 @@
+dist
+node_modules
+README.md
+.vscode
+yarn.lock
+package-lock.json
+LICENSE
+.env
+.prettierrc
+.next
+next-env.d.ts

package.json

@@ -5,13 +5,12 @@
 	"scripts": {
 		"dev": "next dev",
 		"build": "next build",
-    "start": "next start"
+		"start": "next start",
+		"pretify": "prettier --write ."
 	},
 	"dependencies": {
-    "axios": "^0.21.1",
 		"milligram": "^1.4.1",
 		"next": "10.0.8",
-    "next-iron-session": "^4.1.12",
 		"next-themes": "^0.0.12",
 		"react": "17.0.1",
 		"react-dom": "17.0.1",
@@ -21,6 +20,7 @@
 	"devDependencies": {
 		"@types/node": "^14.14.32",
 		"@types/react": "^17.0.3",
+		"prettier": "^2.2.1",
 		"typescript": "^4.2.3"
 	}
 }

src/components/Footer.tsx

@@ -1,4 +1,4 @@
-import { FaTwitter, FaYoutube, FaCoffee, FaGithub } from "react-icons/fa";
+import { FaTwitter, FaYoutube, FaCoffee, FaGithub } from 'react-icons/fa';
 
 const Footer = () => {
 	const year = new Date().getFullYear();
@@ -14,7 +14,10 @@ const Footer = () => {
 					<a href="https://twitter.com/GuusvanMeerveld" aria-label="twitter link">
 						<FaTwitter className="img" />
 					</a>
-          <a href="https://www.youtube.com/channel/UCYuqpoMay5SezCBrA_HKVWQ" aria-label="youtube link">
+					<a
+						href="https://www.youtube.com/channel/UCYuqpoMay5SezCBrA_HKVWQ"
+						aria-label="youtube link"
+					>
 						<FaYoutube className="img" />
 					</a>
 					<a href="https://ko-fi.com/guusvanmeerveld" aria-label="kofi link">

src/components/Layout.tsx

@@ -1,5 +1,5 @@
-import Navbar from "./Navbar";
+import Navbar from './Navbar';
-import Footer from "./Footer";
+import Footer from './Footer';
 
 const Layout = ({ children }) => (
 	<>

src/components/Navbar.tsx

@@ -1,10 +1,10 @@
-import { useTheme } from "next-themes";
+import { useTheme } from 'next-themes';
-import { BiMoon } from "react-icons/bi";
+import { BiMoon } from 'react-icons/bi';
-import { ImSun } from "react-icons/im";
+import { ImSun } from 'react-icons/im';
 
 const Navbar = () => {
 	const { theme, setTheme } = useTheme();
-  const switchTheme = () => setTheme(theme == "dark" ? "light" : "dark");
+	const switchTheme = () => setTheme(theme == 'dark' ? 'light' : 'dark');
 
 	return (
 		<nav className="navigation">

src/components/Page.tsx

@@ -1,4 +1,4 @@
-import Head from "next/head";
+import Head from 'next/head';
 
 const Page = ({
 	title,

src/components/Projects.tsx

@@ -9,8 +9,9 @@ const Projects = () => (
 				<div className="content">
 					<div className="info">
 						<div className="title">Argo</div>
-            Argo is a new app for Magister 6, made with <b>Dart and Flutter</b>. It will soon be available on the Google
+						Argo is a new app for Magister 6, made with <b>Dart and Flutter</b>. It will soon be
-            Play store and (maybe) even the App store! For more information, click either of the buttons below.
+						available on the Google Play store and (maybe) even the App store! For more information,
+						click either of the buttons below.
 						<br />
 						<br />
 						<a href="https://argo-magister.net" className="button">
@@ -33,8 +34,8 @@ const Projects = () => (
 					</div>
 					<div className="info right">
 						<div className="title">Tempo</div>
-            Tempo is a "simple" Discord bot which can be used to play YouTube, SoundCloud and even Spotify songs. It's
+						Tempo is a "simple" Discord bot which can be used to play YouTube, SoundCloud and even
-            made in pure <b>TypeScript</b> and has plentiful settings. <br />
+						Spotify songs. It's made in pure <b>TypeScript</b> and has plentiful settings. <br />
 						<br />
 						<a href="https://tempo.g-vm.nl" className="button">
 							Website
@@ -50,9 +51,10 @@ const Projects = () => (
 				<div className="content">
 					<div className="info">
 						<div className="title">Keyzo</div>
-            Keyzo is an electron-based program written in <b>JavaScript and CSS</b> but I am planning on moving to
+						Keyzo is an electron-based program written in <b>JavaScript and CSS</b> but I am
-            <b> TypeScript</b>. It's main use is to bring every keybind you will every need into a single program, with
+						planning on moving to
-            a simple and neat interface. <br />
+						<b> TypeScript</b>. It's main use is to bring every keybind you will every need into a
+						single program, with a simple and neat interface. <br />
 						<br />
 						<a href="https://keyzo.net" className="button">
 							Website
@@ -72,7 +74,8 @@ const Projects = () => (
 					</div>
 					<div className="info right">
 						<div className="title">Magister Auto-Login</div>
-            Magister Auto-Login is a chrome extension that automatically logs into Magister 6 for you. <br />
+						Magister Auto-Login is a chrome extension that automatically logs into Magister 6 for
+						you. <br />
 						<br />
 						<a
 							className="button"

src/pages/404.tsx

@@ -1,5 +1,5 @@
-import Page from "src/components/Page";
+import Page from 'src/components/Page';
-import Layout from "src/components/Layout";
+import Layout from 'src/components/Layout';
 
 const NotFound = () => (
 	<Page title="Page not found" description="This page either doesn't exist or has been deleted">

src/pages/_document.tsx

@@ -1,4 +1,4 @@
-import Document, { Html, Head, Main, NextScript } from "next/document";
+import Document, { Html, Head, Main, NextScript } from 'next/document';
 
 export default class AppDocument extends Document {
 	static async getInitialProps(ctx) {

src/pages/binas.tsx

@@ -1,6 +1,6 @@
-import Page from "@components/Page";
+import Page from '@components/Page';
-import Layout from "@components/Layout";
+import Layout from '@components/Layout';
-import { Component } from "react";
+import { Component } from 'react';
 
 class Binas extends Component {
 	links: string[];

src/pages/index.tsx

@@ -1,8 +1,8 @@
-import Page from "@components/Page";
+import Page from '@components/Page';
-import Landing from "@components/Landing";
+import Landing from '@components/Landing';
-import Projects from "@components/Projects";
+import Projects from '@components/Projects';
-import Contact from "@components/Contact";
+import Contact from '@components/Contact';
-import Layout from "@components/Layout";
+import Layout from '@components/Layout';
 
 const Home = () => (
 	<Page description="A simple portfolio website to display my projects." title="Projects">

src/pages/thanks.tsx

@@ -1,5 +1,5 @@
-import Page from "src/components/Page";
+import Page from 'src/components/Page';
-import Layout from "src/components/Layout";
+import Layout from 'src/components/Layout';
 
 const Thanks = () => (
 	<Page title="Thanks!" description="Thanks for submitting your contact form!">

src/styles/raleway.css

@@ -1,54 +1,57 @@
 /* cyrillic-ext */
 @font-face {
-  font-family: "Raleway";
+	font-family: 'Raleway';
 	font-style: normal;
 	font-weight: 400;
 	font-display: swap;
 	src: url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCFPrEVJz9d-c8.woff2)
-    format("woff2");
+		format('woff2');
 	unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
 }
 
 /* cyrillic */
 @font-face {
-  font-family: "Raleway";
+	font-family: 'Raleway';
 	font-style: normal;
 	font-weight: 400;
 	font-display: swap;
 	src: url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCMPrEVJz9d-c8.woff2)
-    format("woff2");
+		format('woff2');
 	unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
 }
 
 /* vietnamese */
 @font-face {
-  font-family: "Raleway";
+	font-family: 'Raleway';
 	font-style: normal;
 	font-weight: 400;
 	font-display: swap;
 	src: url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCHPrEVJz9d-c8.woff2)
-    format("woff2");
+		format('woff2');
-  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
+	unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0,
+		U+1EA0-1EF9, U+20AB;
 }
 
 /* latin-ext */
 @font-face {
-  font-family: "Raleway";
+	font-family: 'Raleway';
 	font-style: normal;
 	font-weight: 400;
 	font-display: swap;
 	src: url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCGPrEVJz9d-c8.woff2)
-    format("woff2");
+		format('woff2');
-  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
+	unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113,
+		U+2C60-2C7F, U+A720-A7FF;
 }
 
 /* latin */
 @font-face {
-  font-family: "Raleway";
+	font-family: 'Raleway';
 	font-style: normal;
 	font-weight: 400;
 	font-display: swap;
-  src: url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCIPrEVJz9d.woff2) format("woff2");
+	src: url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCIPrEVJz9d.woff2)
-  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC,
+		format('woff2');
-    U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F,
+		U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
 }

src/styles/sass/contact.scss

@@ -15,7 +15,7 @@
 		background-color: var(--secondary);
 	}
 
-  font-family: "Raleway";
+	font-family: 'Raleway';
 
 	#message {
 		resize: none;

src/styles/sass/footer.scss

@@ -4,7 +4,7 @@
 
 	padding: 3rem;
 
-  font-family: "Raleway";
+	font-family: 'Raleway';
 
 	.profile {
 		width: 5rem;

src/styles/sass/index.scss

@@ -6,7 +6,7 @@
 	--foreground: #606c76;
 }
 
-[data-theme="dark"] {
+[data-theme='dark'] {
 	.profile {
 		filter: invert(1);
 	}
@@ -28,12 +28,12 @@ a {
 	color: var(--links);
 }
 
-@import "nav.scss";
+@import 'nav.scss';
-@import "landing.scss";
+@import 'landing.scss';
-@import "project.scss";
+@import 'project.scss';
-@import "contact.scss";
+@import 'contact.scss';
-@import "footer.scss";
+@import 'footer.scss';
 
-@import "binas.scss";
+@import 'binas.scss';
-@import "upload.scss";
+@import 'upload.scss';
-@import "page.scss";
+@import 'page.scss';

src/styles/sass/landing.scss

@@ -15,7 +15,7 @@
 	}
 
 	text-align: center;
-  font-family: "Raleway";
+	font-family: 'Raleway';
 
 	.title {
 		font-size: 4rem;

src/styles/sass/nav.scss

@@ -5,7 +5,7 @@
 
 	position: fixed;
 	top: 0;
-  font-family: "Raleway";
+	font-family: 'Raleway';
 	padding: 1.5rem 0;
 
 	width: 100%;
@@ -36,7 +36,7 @@
 	}
 }
 
-[data-theme="dark"] {
+[data-theme='dark'] {
 	.sun {
 		display: none;
 	}

src/styles/sass/page.scss

@@ -1,5 +1,5 @@
 .page {
-  font-family: "Raleway";
+	font-family: 'Raleway';
 	height: 100vh;
 	width: 100vw;
 	display: flex;

src/styles/sass/project.scss

@@ -5,7 +5,7 @@
 		margin-bottom: 3rem;
 	}
 
-  font-family: "Raleway";
+	font-family: 'Raleway';
 	margin-top: 3rem;
 
 	.project {

yarn.lock

@@ -1377,6 +1377,11 @@ postcss@^7.0.32:
     source-map "^0.6.1"
     supports-color "^6.1.0"
 
+prettier@^2.2.1:
+  version "2.2.1"
+  resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.2.1.tgz#795a1a78dd52f073da0cd42b21f9c91381923ff5"
+  integrity sha512-PqyhM2yCjg/oKkFPtTGUojv7gnZAoG80ttl45O6x2Ug/rMJw4wcc9k6aaf2hibP7BGVCCM33gZoGjyvt9mm16Q==
+
 process-nextick-args@~2.0.0:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/process-nextick-args/-/process-nextick-args-2.0.1.tgz#7820d9b16120cc55ca9ae7792680ae7dba6d7fe2"