From 6fa88f6c7a3af31ffc3589bf5af6541c88b4d4ad Mon Sep 17 00:00:00 2001
From: Angel Wang <angel@angelcube.dev>
Date: Wed, 1 Apr 2026 11:18:24 -0600
Subject: [PATCH] feat(treewide): tracking, superscript, and other cool styles

---
 public/logotype.svg       |  4 ++--
 src/scripts/LocalTime.tsx | 12 ++++++++++--
 src/styles/_var.scss      |  1 +
 src/styles/about.scss     |  5 +++++
 src/styles/footer.scss    |  1 +
 src/styles/header.scss    |  2 ++
 src/styles/index.scss     | 16 ++++++++++++----
 src/styles/projects.scss  |  4 +++-
 8 files changed, 36 insertions(+), 9 deletions(-)

diff --git a/public/logotype.svg b/public/logotype.svg
index ae581c0..6d4596e 100644
--- a/public/logotype.svg
+++ b/public/logotype.svg
@@ -1,4 +1,4 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="124.8" height="22.248" viewBox="0 0 124.8 22.248">
+<svg xmlns="http://www.w3.org/2000/svg" width="119.6" height="22.248" viewBox="0 0 119.6 22.248">
     <style>
         @font-face { 
             font-family: "PP Neue Machina Inktrap Variable";
@@ -12,7 +12,7 @@
             font-family: 'PP Neue Machina Inktrap Variable';
             font-size: 24px;
             fill: #242424;
-            
+            letter-spacing: -0.03em;
         }
 
         @media (prefers-color-scheme: dark) {
diff --git a/src/scripts/LocalTime.tsx b/src/scripts/LocalTime.tsx
index b24c257..85ae076 100644
--- a/src/scripts/LocalTime.tsx
+++ b/src/scripts/LocalTime.tsx
@@ -3,15 +3,23 @@ import { Temporal } from "temporal-polyfill"
 
 export default function LocalTime() {
     const [time, setTime] = useState("")
+    const [timezone, setTimezone] = useState("")
+    const [loading, setLoading] = useState(true)
 
     useEffect(() => {
         setInterval(() => {
-            setTime(Temporal.Now.zonedDateTimeISO("America/Edmonton").toLocaleString())
+            setTime(Temporal.Now.zonedDateTimeISO("America/Edmonton").toPlainDateTime().toLocaleString("en-CA", { hourCycle: "h24" }))
+            setLoading(false);
+
+            setTimezone("UTC" + Temporal.Now.zonedDateTimeISO("America/Edmonton").offset)
+
         }, 1000)
     })
 
+    if (loading) return;
+
     return (
-        <p className="local-time">{time}</p>
+        <p className="local-time">{time} <sup>{timezone}</sup></p>
     )
     
 }
\ No newline at end of file
diff --git a/src/styles/_var.scss b/src/styles/_var.scss
index 051661b..3971f74 100644
--- a/src/styles/_var.scss
+++ b/src/styles/_var.scss
@@ -2,6 +2,7 @@
 
 :root {
     color-scheme: light dark;
+    overscroll-behavior: none;
     
     --width: 1125px;
     --font-main: 'PP Neue Machina Inktrap Variable';
diff --git a/src/styles/about.scss b/src/styles/about.scss
index af87b3b..d5fd279 100644
--- a/src/styles/about.scss
+++ b/src/styles/about.scss
@@ -14,6 +14,7 @@ p.big:first-child {
 }
 
 a.big {
+    letter-spacing: -0.03em;
     font-family: var(--font-main);
     display: block;
     font-size: 1.4rem;
@@ -29,6 +30,10 @@ a.big::after{
     content: " ↗"
 }
 
+h2 {
+    letter-spacing: -0.03em;
+}
+
 .columns {
     display: flex;
 }
diff --git a/src/styles/footer.scss b/src/styles/footer.scss
index 0dbc804..f977e78 100644
--- a/src/styles/footer.scss
+++ b/src/styles/footer.scss
@@ -14,6 +14,7 @@ footer {
         margin-bottom: 3em;
 
         span {
+            letter-spacing: -0.03em;
             font-family: var(--font-main);
             font-size: 1.25rem;
         }
diff --git a/src/styles/header.scss b/src/styles/header.scss
index f19eb87..46c153d 100644
--- a/src/styles/header.scss
+++ b/src/styles/header.scss
@@ -11,6 +11,7 @@ header .title {
 }
 
 header .title h1 {
+    letter-spacing: -0.03em;
     margin: 0;
 }
 
@@ -26,6 +27,7 @@ header nav {
         font-family: var(--font-main);
         font-size: 2rem;
         text-decoration: none;
+        letter-spacing: -0.03em;
 
         .header-icon:hover {
             box-shadow: inset 0 -2px 0 0 currentColor;
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 0b976b8..23c05f4 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -23,8 +23,12 @@ p.big {
         flex: none;
 
         p.local-time {
-            font-feature-settings: "tnum";
-            font-size: 1.5rem
+            position: relative;
+            bottom: 0.25rem;
+
+            font-feature-settings: "tnum" 1;
+            font-size: 1.4rem;
+            letter-spacing: -0.05em;
         }
     }
 }
@@ -49,11 +53,15 @@ p.big {
 }
 
 #now-playing {
-    // display: flex;
-    // flex-direction: row;
+    i {
+        font-size: 1rem;
+        font-variation-settings: "ital" 100; // because of course it works that way
+    }
+
     p {
         font-family: var(--font-main);
         font-size: 1.4rem;
+        letter-spacing: -0.03em;
     }
 
     b {
diff --git a/src/styles/projects.scss b/src/styles/projects.scss
index be91942..26daa57 100644
--- a/src/styles/projects.scss
+++ b/src/styles/projects.scss
@@ -13,6 +13,7 @@ header a:nth-child(3) {
         margin-right: 10%;
 
         h3 {
+            letter-spacing: -0.03em;
             margin-top: 0;
             margin-bottom: 0.5em;
         }
@@ -31,13 +32,14 @@ header a:nth-child(3) {
         text-decoration: none;
     }
 
-    a:has(h3):hover {
+    a[href]:has(h3):hover {
         text-decoration: underline;
         text-decoration-thickness: 2px;
     }
 }
 
 main h2 {
+    letter-spacing: -0.03em;
     margin-bottom: 0.5em
 }
 
-- 
2.51.2