From 675354d7c4c086bd3d1bc1009cc510a7e55964e9 Mon Sep 17 00:00:00 2001
From: F53 <fseusb@gmail.com>
Date: Wed, 1 Nov 2023 14:31:43 -0600
Subject: [PATCH] Home Page

---
 app.vue                  |  6 +--
 layouts/default.vue      |  3 ++
 pages/index.vue          | 88 ++++++++++++++++++++++++++++++++++++++++
 public/assets/email.svg  | 10 +++++
 public/assets/github.svg |  3 ++
 public/assets/pfp.svg    |  4 ++
 6 files changed, 111 insertions(+), 3 deletions(-)
 create mode 100644 layouts/default.vue
 create mode 100644 pages/index.vue
 create mode 100644 public/assets/email.svg
 create mode 100644 public/assets/github.svg
 create mode 100644 public/assets/pfp.svg

diff --git a/app.vue b/app.vue
index 042b531..f8eacfa 100644
--- a/app.vue
+++ b/app.vue
@@ -1,5 +1,5 @@
 <template>
-  <h1>
-    hello world
-  </h1>
+  <NuxtLayout>
+    <NuxtPage />
+  </NuxtLayout>
 </template>
diff --git a/layouts/default.vue b/layouts/default.vue
new file mode 100644
index 0000000..ba4672f
--- /dev/null
+++ b/layouts/default.vue
@@ -0,0 +1,3 @@
+<template>
+  <slot />
+</template>
diff --git a/pages/index.vue b/pages/index.vue
new file mode 100644
index 0000000..f7d70d4
--- /dev/null
+++ b/pages/index.vue
@@ -0,0 +1,88 @@
+<template>
+  <div id="home" class="row centerChildren">
+    <img class="pfp" src="/assets/pfp.svg">
+
+    <main class="col gap2">
+      <h1>Hi, I'm F53</h1>
+
+      <p class="bio">
+        I'm a {{ Math.floor((Date.now() / 100000 - 10463292) / 315360) }}yo Full Stack Developer
+        who spends a majority of their free time tinkering on mods and websites.
+        Fluent in React, Vue, Ruby on Rails, Java, and Python.
+      </p>
+
+      <ul class="links gap4 row centerChildren">
+        <li>
+          <NuxtLink to="mailto:fseusb@gmail.com" aria-label="email">
+            <img src="/assets/email.svg">
+            <span>Email</span>
+          </NuxtLink>
+        </li>
+        <li>
+          <NuxtLink to="https://github.com/CodeF53" aria-label="github">
+            <img src="/assets/github.svg">
+            <span>Github</span>
+          </NuxtLink>
+        </li>
+        <li>
+          <NuxtLink to="https://dev.to/f53" aria-label="blog">
+            Blog
+          </NuxtLink>
+        </li>
+      </ul>
+    </main>
+  </div>
+  <div>
+    <h2>TODO:</h2>
+    <ul>
+      <li>background: pointcloud + something fancy with mouse movement + parallax scroll</li>
+      <li>colors</li>
+      <li>experience page: (education + jobs + projects) handled with markdown, click to learn more, filterable, sortable</li>
+      <li>blog page: handled with markdown, filterable, sortable</li>
+      <li>header for non-homepage pages</li>
+      <li>duplicate site, but with real name and picture, with minimal duplicate source code</li>
+    </ul>
+  </div>
+</template>
+
+<style lang="scss">
+#home {
+  --imgSize: min(20rem, 50vw, 50vh);
+  --bioSize: min(40rem, 100vw - 2rem);
+  @media (max-width: 60rem) {
+    flex-direction: column;
+
+    --imgSize: min(20rem, 100vw - 1rem)
+  }
+
+  gap: 2rem;
+
+  img.pfp {
+    width: var(--imgSize);
+    height: var(--imgSize);
+  }
+
+  main {
+    max-width: var(--bioSize);
+  }
+
+  .links {
+    list-style-type: none;
+    padding: 0;
+    display: flex;
+    flex-wrap: wrap;
+
+    a {
+      display: flex;
+      gap: .25rem;
+      justify-content: center;
+      align-items: center;
+      text-decoration: none;
+      cursor: pointer;
+    }
+    img {
+      height: 1.5rem;
+    }
+  }
+}
+</style>
diff --git a/public/assets/email.svg b/public/assets/email.svg
new file mode 100644
index 0000000..36f122b
--- /dev/null
+++ b/public/assets/email.svg
@@ -0,0 +1,10 @@
+<svg fill="#fff" height="800px" width="800px" version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
+	 viewBox="0 0 75.294 75.294" xml:space="preserve">
+	<path d="M66.097,12.089h-56.9C4.126,12.089,0,16.215,0,21.286v32.722c0,5.071,4.126,9.197,9.197,9.197h56.9
+		c5.071,0,9.197-4.126,9.197-9.197V21.287C75.295,16.215,71.169,12.089,66.097,12.089z M61.603,18.089L37.647,33.523L13.691,18.089
+		H61.603z M66.097,57.206h-56.9C7.434,57.206,6,55.771,6,54.009V21.457l29.796,19.16c0.04,0.025,0.083,0.042,0.124,0.065
+		c0.043,0.024,0.087,0.047,0.131,0.069c0.231,0.119,0.469,0.215,0.712,0.278c0.025,0.007,0.05,0.01,0.075,0.016
+		c0.267,0.063,0.537,0.102,0.807,0.102c0.001,0,0.002,0,0.002,0c0.002,0,0.003,0,0.004,0c0.27,0,0.54-0.038,0.807-0.102
+		c0.025-0.006,0.05-0.009,0.075-0.016c0.243-0.063,0.48-0.159,0.712-0.278c0.044-0.022,0.088-0.045,0.131-0.069
+		c0.041-0.023,0.084-0.04,0.124-0.065l29.796-19.16v32.551C69.295,55.771,67.86,57.206,66.097,57.206z"/>
+</svg>
\ No newline at end of file
diff --git a/public/assets/github.svg b/public/assets/github.svg
new file mode 100644
index 0000000..5f945e2
--- /dev/null
+++ b/public/assets/github.svg
@@ -0,0 +1,3 @@
+<svg width="32" height="32" viewBox="0 0 16 16" fill="#fff" xmlns="http://www.w3.org/2000/svg">
+  <path d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"></path>
+</svg>
\ No newline at end of file
diff --git a/public/assets/pfp.svg b/public/assets/pfp.svg
new file mode 100644
index 0000000..824385e
--- /dev/null
+++ b/public/assets/pfp.svg
@@ -0,0 +1,4 @@
+<svg width="256" height="256" version="1.1" viewBox="0 0 256 256" xmlns="http://www.w3.org/2000/svg">
+  <path d="m96.351 246.01c-4.6785-1.1518-7.4302-3.2088-8.4331-6.3041-0.25053-0.77315-0.85404-3.9164-1.3411-6.9851-0.48708-3.0687-1.1077-6.3233-1.3791-7.2325-0.67363-2.2565-3.4338-5.205-8.8576-9.462-5.2084-4.088-10.246-9.1996-12.65-12.834-2.1353-3.2296-5.0019-9.3405-6.7585-14.408-1.7718-5.1114-2.676-6.1825-6.212-7.3591-1.5355-0.51099-3.3436-1.3933-4.0179-1.9606-2.4111-2.0288-3.4599-6.7137-2.619-11.698 0.67908-4.026 0.20085-5.4843-2.4142-7.3624-3.5251-2.5316-4.7521-7.3624-3.4062-13.412 0.41083-1.8466 1.8057-5.4733 3.2737-8.5116 1.4068-2.9117 2.5579-5.6308 2.5579-6.0425 0-1.6199-1.0589-2.8278-4.7498-5.4183-6.5642-4.6071-12.371-9.4954-19.219-16.179-3.6241-3.5373-6.9569-7.1525-7.4065-8.0336-2.0096-3.9391-2.6418-10.532-1.4492-15.111 1.4737-5.658 3.9595-6.9604 15.228-7.9781 7.2185-0.65194 12.129-1.6461 21.047-4.2603 4.1219-1.2085 10.176-2.6838 13.453-3.2781 3.2773-0.59448 6.5604-1.3398 7.296-1.6562 0.73562-0.31644 3.3612-2.3532 5.8345-4.5261 9.6361-8.4656 20.362-14.053 32.627-16.996 2.7146-0.65132 5.1824-1.406 5.4842-1.6771 0.32562-0.2925 0.79781-2.8585 1.1617-6.3129 1.483-14.078 5.5881-26.181 9.9086-29.214 3.4137-2.3958 11.168-3.0551 17.136-1.4567 2.9874 0.80017 4.2778 1.5418 7.6965 4.4235 3.5503 2.9926 7.0897 7.2873 14.092 17.1 7.0149 9.8299 9.1222 12.468 10.744 13.449 0.75468 0.45686 4.0056 1.7087 7.2242 2.7821 15.343 5.1164 27.021 13.627 37.157 27.079 6.1542 8.1676 14.257 27.199 17.739 41.667 1.8015 7.4852 2.674 13.002 5.1262 32.416 1.2066 9.5529 2.6562 20.555 3.2215 24.45 1.7292 11.916 2.0704 17.679 1.8043 30.471-0.33618 16.162-1.2688 21.632-5.2897 31.026-2.1256 4.9661-2.9822 5.9069-7.5458 8.2863l-3.9886 2.0797-4.9356 0.15978c-2.7146 0.0879-5.9886-0.0323-7.2756-0.26711-1.8674-0.34067-3.2977-0.25543-7.0814 0.42207-5.6785 1.0168-10.616 0.85074-14.959-0.50301-2.474-0.77107-3.4028-1.3674-6.0584-3.89-1.7251-1.6386-3.3571-2.9793-3.6267-2.9793-0.26971 0-1.6192 1.0378-2.9989 2.3061-4.2327 3.8912-8.9676 5.1166-13.543 3.5047-4.9351-1.7386-6.8641-4.0244-8.5837-10.171-0.55076-1.9687-1.8881-5.7247-2.9717-8.3465-3.2773-7.9287-5.1735-16.732-6.5075-30.212-0.89414-9.0341-1.2736-10.503-3.275-12.674-2.474-2.6839-2.9629-4.5514-3.3456-12.779-0.1909-4.1046-0.53415-7.4114-0.79656-7.6738-0.5543-0.55431-0.82247 0.88471-1.0961 5.8814-0.32963 6.0198-2.0779 8.6625-6.7043 10.134-1.5435 0.49083-3.8686 0.88888-5.1669 0.88452-3.4504-0.0114-8.7543-1.8515-11.588-4.0199-1.9957-1.5271-2.738-1.8344-4.8027-1.988-2.2255-0.16563-2.5388-0.0775-3.5312 0.9932-2.1689 2.3402-1.9 4.289 1.6706 12.103 3.5796 7.8339 4.6287 16.781 3.6818 31.404-0.58448 9.0262-1.3478 14.623-2.6679 19.563-1.2065 4.5138-3.1212 6.5956-7.2268 7.857-4.0791 1.2533-5.9291 1.4088-8.6859 0.73014z" fill="#fff" />
+  <path d="m98.476 234.12c-0.41323-7.9301-1.5278-13.968-3.1808-17.23-1.3719-2.7073-4.1-5.3688-10.92-10.653-9.2366-7.1569-12.186-11.189-16.211-22.163-2.2528-6.1416-4.1424-13.836-4.7886-19.498-0.82046-7.1898-0.68811-7.1757-3.93-0.42178-2.8059 5.8457-6.2813 10.783-6.3213 8.9798-0.0097-0.43565 0.34419-1.3048 0.78639-1.9313 4.2265-5.9886 6.278-15.494 5.9825-27.718l-0.13418-5.5492-1.6549 2.6833c-3.4324 5.5653-10.174 12.841-11.492 12.402-0.25778-0.086 0.50658-1.2991 1.6985-2.6959 3.2431-3.8006 4.8634-6.8295 8.4545-15.806 3.396-8.4884 3.4468-8.8528 1.2339-8.869-0.49588-3e-3 -1.4615-0.17757-2.1459-0.38658-0.68436-0.20901-3.9482-0.72026-7.2529-1.1361-8.5037-1.0701-9.6565-1.7564-9.6565-5.7479 0-0.98451-0.38728-2.2044-0.979-3.0836-1.0304-1.5311-2.0252-4.4006-2.0252-5.8415 0-0.53861-3.0105-3.8392-8.1545-8.9402-4.4849-4.4475-8.1545-8.2122-8.1545-8.366 0-0.15374 2.8487-0.41265 6.3304-0.57534 9.9985-0.46721 16.891-1.8229 28.648-5.635 4.6927-1.5216 7.2303-2.0776 11.588-2.5392 7.8928-0.83614 9.6935-1.6077 14.55-6.2344 5.6472-5.3797 10.388-8.7301 16.766-11.85 8.1827-4.0022 13.951-5.6679 24.048-6.9437l2.5751-0.32541 0.0937-3.432c0.17256-6.32 1.0392-15.412 1.8406-19.311 1.4454-7.0325 5.4039-16.417 6.7129-15.915 1.7413 0.66819 7.2908 4.9383 9.5332 7.3355 1.3805 1.4758 4.1727 4.9755 6.2047 7.7772 2.0322 2.8015 5.3917 7.4386 7.4657 10.305 2.074 2.8659 4.9675 6.6644 6.4298 8.4411 2.5334 3.0778 2.7766 3.2544 5.1502 3.7422 4.5974 0.94473 12.758 3.8543 16.549 5.9001 11.568 6.2435 23.997 18.471 28.241 27.778 4.987 10.943 6.4088 14.397 8.8323 21.459 3.3553 9.777 4.4402 15.58 7.4617 39.913 1.1724 9.4419 2.809 21.786 3.6369 27.435 1.6458 11.224 1.864 17.522 1.1015 31.793-0.42874 8.0242-1.0556 10.753-3.9018 16.983-1.1502 2.5177-2.3173 5.4754-2.5936 6.5728-0.64107 2.5459-1.485 3.1923-1.1309 0.8661 0.47827-3.1417-0.39304-10.033-1.8398-14.551-0.7559-2.3605-1.5495-4.4765-1.7636-4.7021-0.45433-0.47923-4.4163 3.2236-5.3529 5.0027-1.3117 2.4917-0.3355 7.6237 2.4263 12.755 0.68863 1.2795 1.1642 2.4143 1.0568 2.5217-0.27692 0.27692-4.314-4.1873-7.0545-7.8007-2.1882-2.8854-5.1932-8.419-5.1932-9.5634 0-1.1086-0.93386-1.0022-2.7689 0.3156-2.7556 1.979-3.4543 3.6655-3.4539 8.3379 2.5e-4 3.3209 0.16662 4.2179 1.1864 6.3958 0.65238 1.3932 1.0998 2.6194 0.99435 2.725-0.51237 0.51239-5.0652-2.5454-7.5458-5.0681-3.6661-3.7282-7.8636-10.819-15.795-26.684-3.4395-6.8796-6.309-12.327-6.3766-12.106-0.0676 0.22149-0.51431 3.3704-0.9926 6.9976-0.94082 7.135-1.0582 12.015-0.45031 18.727 0.35435 3.913-5e-3 13.404-0.65354 17.274-0.44269 2.6408-0.83879 1.3829-0.87896-2.7913-0.0431-4.4921 0.11225-3.9761-4.0277-13.372-4.0037-9.0867-5.5153-18.458-7.084-43.917-0.35982-5.8391-0.63052-10.764-0.60153-10.944 0.029-0.18011 0.0146-0.90688-0.0331-1.615l-0.0858-1.2876-0.58488 1.3333c-0.32168 0.73332-0.89079 3.0964-1.2647 5.2514-0.65763 3.7904-2.2333 8.2205-2.9242 8.2216-0.18552 3.2e-4 -0.18552-1.7859 0-3.9693 0.18552-2.1835 0.32085-6.4806 0.30074-9.5493-0.0333-5.0666-0.15767-5.9272-1.354-9.3646-1.5238-4.3782-4.1814-8.9556-8.6025-14.817-4.482-5.9419-5.1846-6.5218-3.3266-2.7459 0.84304 1.7134 1.9022 4.0527 2.3538 5.1984 1.3178 3.3433 2.7449 11.076 1.8857 10.217-0.15524-0.15507-1.0196-2.2367-1.9211-4.6256-1.9614-5.1983-4.0436-9.0247-6.7061-12.324-3.1216-3.8684-17.441-18.667-17.6-18.189-0.33824 1.0147 3.0903 16 5.4691 23.905 1.4208 4.721 2.9564 10.515 3.4126 12.875 1.1098 5.7439 2.0294 16.414 1.4634 16.98-0.28655 0.28654-0.60508-0.15654-0.95704-1.3313-0.34929-1.1658-1.4975-2.7723-3.3981-4.7545l-2.8706-2.9937-4.0772-0.82677c-5.0402-1.022-9.191-3.0322-12.795-6.1968-1.4904-1.3084-2.7811-2.379-2.8682-2.379-0.49004 0 4.3357 8.5603 5.8358 10.352 1.6191 1.9339 2.0219 3.0547 0.83405 2.3206-1.2755-0.7883-13.399-14.283-16.202-18.033-4.0976-5.484-5.9813-8.8739-7.7533-13.952l-1.4226-4.0772 0.20902 6.4378c0.11496 3.5407 0.51641 8.0794 0.89212 10.086 1.5203 8.1194 5.3453 17.559 10.682 26.361 1.563 2.5782 2.725 4.7991 2.5822 4.9356-0.45697 0.43665-5.588-5.5116-9.6575-11.196-3.6893-5.1529-4.8212-6.5436-3.8726-4.7578 0.21944 0.41308 1.5714 4.2862 3.0043 8.6069 3.1903 9.6194 4.9013 13.1 9.4291 19.183 6.3408 8.5176 6.7309 11.013 5.2323 33.477-0.22048 3.3047-0.70151 7.1672-1.069 8.5837-0.91564 3.5292-2.407 7.5106-2.8135 7.5106-0.18448 0-0.42851-1.7864-0.54228-3.9699zm128.45-16.738c1.2206-2.002 1.1101-6.1406-0.40751-15.268-0.69364-4.1719-1.4029-8.7441-1.5761-10.16l-0.31489-2.5751-0.55983 3.4335c-0.85384 5.2365-1.2303 16.458-0.63559 18.946 0.48443 2.0257 2.2789 7.0201 2.5224 7.0201 0.0665 0 0.50372-0.62767 0.97147-1.3948zm-142.06-19.395c0-0.78351-5.3387-15.274-6.5711-17.835-2.39-4.9677-5.8538-10.649-5.8652-9.6207-0.01395 1.2654 4.0415 11.453 5.8503 14.696 0.83277 1.4931 1.3979 2.8309 1.2559 2.973-0.4949 0.49491-2.9052-2.279-5.0246-5.7831-1.174-1.9408-2.2922-3.6262-2.4849-3.7453-0.44704-0.27628 0.19146 3.1947 1.1012 5.9865 1.947 5.9747 5.2384 10.838 8.4025 12.414 2.0526 1.0228 3.336 1.3747 3.336 0.91457zm-23.64-77.911c2.8933-0.82979 3.9748-2.8075 4.4937-8.2177 0.10467-1.0914 0.58488-2.7579 1.0671-3.7031 1.3309-2.6087 2.3462-7.1332 2.0069-8.9423l-0.29264-1.56-3.2977 0.28494c-1.8138 0.15671-4.9393 0.49247-6.9457 0.7461l-3.6479 0.46116-2.6815 2.7079c-2.6637 2.6899-8.5814 6.1956-10.458 6.1956-0.44476 0-0.80866 0.27044-0.80866 0.60096 0 0.86784 3.9432 1.7009 6.7025 1.4162 1.2706-0.13115 2.3035-0.10755 2.2956 0.0524-0.0081 0.15999-0.83352 1.4497-1.8343 2.8659-1.2826 1.8153-2.2281 2.6962-3.2041 2.9858-2.439 0.72331-1.5637 1.3594 2.8878 2.0987 4.7886 0.79527 9.7071 0.92121 11.365 0.29099 1.3203-0.50196 1.512 0.16832 0.24254 0.84774-1.9952 1.0678-0.59461 1.6443 2.1102 0.8686zm89.305-46.147c4.2476-0.74821 6.9252-0.8133 8.9983-0.21874 0.81509 0.23376 1.6341 0.27287 1.8202 0.08688 0.50295-0.50295-2.0638-8.3799-4.0128-12.314-2.6113-5.2718-6.4191-10.857-7.6073-11.158-0.55888-0.14154-2.2615-1.5516-3.7837-3.1334-2.318-2.409-2.8317-2.762-3.1624-2.1736-0.49442 0.87958 0.50475 4.3866 1.6022 5.6237 0.76063 0.85744 0.75864 0.86818-0.0775 0.41527-1.6132-0.87381-3.179-2.6617-4.9669-5.6712-1.8075-3.0426-5.9481-7.2934-7.1042-7.2934-0.47571 0-0.56624 0.3393-0.37216 1.3948 0.14112 0.76716 0.41203 4.8712 0.60216 9.1201 0.19012 4.2489 0.41655 7.9184 0.50316 8.1545 0.20668 0.56326-3.092 4.9456-5.9366 7.8866-1.892 1.9563-2.6598 3.0507-2.1459 3.0591 0.059 8.58e-4 2.9078 0.58678 6.3304 1.3018 3.8186 0.7977 8.2573 1.4028 11.488 1.5659 4.7709 0.24098 5.209 0.3302 4.6713 0.95141-0.69653 0.80476-1.3031 3.0463-0.82407 3.0453 0.18154-3.21e-4 1.9717-0.28976 3.978-0.64318z" fill="#000" />
+</svg>