From 8f58e6d8521d053b156f72cacbc5ad75b974afc5 Mon Sep 17 00:00:00 2001
From: "Dominik V. Salonen" <contact@quad.moe>
Date: Wed, 14 Mar 2018 19:12:52 +0000
Subject: [PATCH] Add project page

---
 main.js             |  2 +-
 pages/projects.html |  9 +++++++++
 style.css           | 20 +++++++++++++++++++-
 3 files changed, 29 insertions(+), 2 deletions(-)
 create mode 100644 pages/projects.html

diff --git a/main.js b/main.js
index 00fe75f..47a19e5 100755
--- a/main.js
+++ b/main.js
@@ -10,7 +10,7 @@ const button3 = document.getElementById('button3');
 // Create variables that will get populated by loadContent() later
 var page1 = "pages/about.html";
 var page2 = "pages/social.html";
-var page3 = "pages/about.html";
+var page3 = "pages/projects.html";
 
 const contentArea = document.getElementById("page");
 
diff --git a/pages/projects.html b/pages/projects.html
new file mode 100644
index 0000000..6b1c551
--- /dev/null
+++ b/pages/projects.html
@@ -0,0 +1,9 @@
+<p>I'm not an active dev anymore. But I've still got some things going on.</p>
+
+<p><a href="http://openings.moe">openings.moe</a> is still a huge site, although I'm mostly just responsible for servers now.</p>
+
+<p><a href="https://blog.quad.moe">My blog</a> is a thing that exists. I tend to forget it, but I'm hoping that I manage to come up with something interesting for it once in a while.</p>
+
+<p><a href="https://masto.quad.moe">masto.quad.moe</a> is a mastodon instance run by me. I use it and some friends, it's invite-only but we're all nice people, so feel free to hit us up if you're on the fediverse</p>
+
+<p><a href="https://twitter.com/anipictures">Anipictures</a> is a bot written by me. Though I don't do much other than fix it if it implodes.</p>
diff --git a/style.css b/style.css
index 2ee1987..caeab60 100755
--- a/style.css
+++ b/style.css
@@ -191,6 +191,24 @@ a:hover {
   transition: color 0.25s ease-in-out;
 }
 
+a.mastodon {
+  display: block;
+  margin: 15px auto;
+  filter: grayscale(100%);
+  width: 35%;
+  transition: all ease-in-out 0.1s;
+  font-size: 0;
+}
+
+.mastodon:hover {
+    filter: grayscale(0%);
+    transition: all ease-in-out 0.1s;
+}
+
+.mastodon img {
+    max-width: 100%;
+}
+
 /* Page contents */
 
 #page p {
@@ -216,4 +234,4 @@ a:hover {
 
 #page h1:first-child {
   margin-top: 0;
-}
\ No newline at end of file
+}