Various changes, mostly to content but some styling.

.gitignore

@@ -1 +1,3 @@
 *~
+theme-compiled.css
+font/*.ttf

README.md

@@ -1,10 +1,12 @@
 This repository contains the code for my personal site, hosted at [carya.software](https://www.carya.software). 
 
 # Building
-"Building" the site such that it can be deployed is simple. Clone the repository, add the relevant font .ttf files, and compile the tailwindCSS. 
+"Building" the site such that it can be deployed is simple. Clone the repository, add the relevant font(s), and compile the tailwindCSS. 
 ## Fonts 
-Obtain the files [ioseevka_ter_regular.ttf](https://typeof.net/Iosevka/) and [OFLGoudyStMTT.ttf](https://www.1001fonts.com/ofl-sorts-mill-goudy-font.html) and put them in the fonts folder. 
+Obtain the file [ioseevka_ter_regular.ttf](https://typeof.net/Iosevka/)and put it in the fonts folder. 
 ## Tailwind 
 [Install TailwindCSS](https://tailwindcss.com/docs/installation) (site most recently built with v3.3.3) with npm if you haven't already. Compile the CSS with the following terminal command. 
 
-    npx tailwindcss -i ./www/css/theme.css -o ./www/css/theme-compiled.css
+    npx tailwindcss -i ./css/theme.css -o ./css/theme-compiled.css
+
+Open index.html and the site should look as it does at [carya.software](https://www.carya.software).

css/theme.css

@@ -9,7 +9,7 @@
 
 @font-face {
   font-family: 'TitleFont';
-  src: url('../font/OFLGoudyStMTT.ttf') format('truetype');
+  src: url('../font/ioseevka_term_regular.ttf') format('truetype');
 }
 
 body {
@@ -20,7 +20,6 @@ body {
 
 .title {
   font-family: TitleFont;
-  font-feature-settings: "c2sc", "smcp";
   font-size: 72px;
 }
 

index.html

@@ -11,7 +11,7 @@
     <!-- <div class="mx-4 order-last"> -->
       <!-- <img class="logo" src="img/logo.svg" alt="carya.software logo"> -->
     <!-- </div> -->
-    <div class="mx-4 self-center mt-16 max-w-3xl min-w-2xl">
+    <div class="mx-4 self-center mt-16 max-w-xl min-w-xl">
       <h1 class="title text-center">carya.software</h1>
       <div class="justify-center">
         <div class="flex justify-center">
@@ -19,25 +19,28 @@
           <button onclick="toggleSections(this)" class="text-xl text-[#14591e] p-2 mx-14">projects</button>
           <button onclick="toggleSections(this)" class="text-xl text-[#14591e] p-2 mx-14">contact</button>
         </div>
-        <div id="about" class="hidden">
+        <div id="about" class="hidden p-2">
           <h2 class="font-semibold text-[#0a210f] p-2">What is this site?</h2>
           <div class="text-left">
-            <p class="p-1">
+            <p class="p-2">
               This is my personal website.
             </p>
-            <p class="p-1">
+            <p class="p-2">
               I do not use my real name here for privacy reasons — <br> and because I like <span class="italic">carya.software</span> a lot more than <span class="italic">first-last.tld</span>.
             </p> 
-            <p class="p-1">
+            <p class="p-2">
-              If you got here from my resume you may want to look at the projects tab <span class="line-through">(or head straight to my <a class="underline" href="https://forge.carya.software">Forgejo instance</a> (a fork of Gitea, a lightweight DevOps platform) to see open-source projects I've worked on</span>[coming soon™]. If you need to contact me for any reason you can find my various account addresses in the contact tab. I would be happy to chat once I know you aren't a web scraper!
+              If you got here from my resume you may want to look at the projects tab or head to my <a class="underline" href="https://forge.carya.software/explore/repos">Forgejo instance</a> (a lightweight FOSS git software forge) directly. 
+            </p>
+            <p class="p-2">
+              If you need to contact me you can find my various account addresses in the contact tab. I would be happy to chat once I know you aren't a web scraper!
             </p>
           </div>
           <h2 class="font-semibold text-[#0a210f] p-2">Who are you?</h2>
           <div class="text-left">
-            <p class="p-1">
+            <p class="p-2">
               I am a software engineer based on the East Coast of the USA. Professionally I have mostly worked with microsoft technology (.NET, SQL Server, et al) but for personal use I prefer <a class="underline text-[#4e2a8e]" href="https://elixir-lang.org/">Elixir</a>.
             </p>
-            <p class="p-1">
+            <p class="p-2">
               Outside of spending time with family and community I garden, work on personal projects, read, and attempt to catalogue the various fungi I find growing in my yard.
             </p>
           </div>
@@ -49,16 +52,40 @@
           </div>
         </div>
         <div id="projects" class="hidden">
-          <ul class="p-2">
+          <ul class="p-2 list-disc">
-            <li>TBD<li>
+            <li>
+              <a class="underline font-semibold" href="https://forge.carya.software/Public/carya.software">Carya.software</a> — the source code for this site. 
+              <ul class="p-2 list-disc">
+                <li>Built using basic HTML, TailwindCSS, and vanilla JavaScript. Hosted on a VPS with Nginx running on Debian.</li>
+                <li>I have additional services running on subdomains on the same server. For example, I host my public repositories at forge.carya.software, and I have a pleroma instance on pleroma.carya.software</li>
+                <li>SSL certificates managed using Certbot</li>
+              </ul>
+            </li>
           </ul>
         </div>
         <div id="contact" class="hidden">
-          <ul class="p-2">
+          <div class="">
-            <li>Email: TBD</li>
+          <table class="table-auto mx-auto my-8 font-[#0a210f]">
-            <li>Matrix: TBD</li>
+            <tbody>
-            <!-- <li>Fediverse: <a class="underline" href="https://pleroma.carya.software/users/TeO3">@TeO3@pleroma.carya.software</a></li> -->
+              <tr>
-          </ul>
+                <td class="p-2">
+                  <label class="font-semibold text-[#0a210f]">Email:</label>
+                </td>
+                <td class="p-2">
+                  TBD, redacted due to spambots.
+                </td>
+              </tr>
+              <tr>
+                <td class="p-2">
+                  <label class="font-semibold text-[#0a210f]">Matrix:</label>
+                </td>
+                <td class="p-2">
+                  TBD
+                </td>
+              </tr>
+            </tbody>
+          </table>
+          </div>
         </div>
       </div>
     </div>
@@ -70,8 +97,6 @@
     hiddenClass = "hidden";
     revealedClass = "visible";
     function switchClasses(element, toRemove, toInsert){
-      console.log(toRemove);
-      console.log(element.classList);
       element.classList.remove(toRemove);
       element.classList.add(toInsert);
     }
@@ -84,7 +109,6 @@
     id = button.textContent;
     ids = ["about", "projects", "contact"];
     ids.filter(i => i !== id).forEach(hide);
-    console.log("All hidden!");
     element = document.getElementById(id);
     if(element.classList.contains(revealedClass)){
       switchClasses(element, revealedClass, hiddenClass);