From 56154b0c6307c5c80f0aaefb7dd9422bcf201dcb Mon Sep 17 00:00:00 2001
From: Cory Dransfeldt <coryd@hey.com>
Date: Sun, 28 Apr 2024 19:33:00 -0700
Subject: [PATCH] fix: menu styles

---
 package.json                           |   2 +-
 src/_includes/partials/nav/link.liquid |   3 ++-
 src/assets/img/avatar.webp             | Bin 432566 -> 432566 bytes
 src/assets/styles/base/index.css       |  20 +++++++++++---------
 src/assets/styles/components/menu.css  |  13 +++++++++----
 5 files changed, 23 insertions(+), 15 deletions(-)

diff --git a/package.json b/package.json
index 057b09a0..08c0ebaa 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "coryd.dev",
-  "version": "13.0.2",
+  "version": "13.0.3",
   "description": "The source for my personal site. Built using 11ty.",
   "type": "module",
   "scripts": {
diff --git a/src/_includes/partials/nav/link.liquid b/src/_includes/partials/nav/link.liquid
index d452e9bd..7d21f9c3 100644
--- a/src/_includes/partials/nav/link.liquid
+++ b/src/_includes/partials/nav/link.liquid
@@ -3,6 +3,7 @@
   <span class="active {{ class }}" aria-current="page">
     {% if icon %}
       {% tablericon icon link %}
+      <span>{{ link }}</span>
     {% else %}
       {{ link }}
     {% endif %}
@@ -14,7 +15,7 @@
       <span>{{ link }}</span>
     </a>
   {% else %}
-    <a class="icon" href="/{{ link | downcase }}">
+    <a href="/{{ link | downcase }}">
       {{ link }}
     </a>
   {% endif %}
diff --git a/src/assets/img/avatar.webp b/src/assets/img/avatar.webp
index e0d737af149f985a44824183b7f1ce60de70a01a..f0098b6af92857c5540bb13d7e703f1047e1cf09 100644
GIT binary patch
delta 32
ocmdnCS!&y6sfHHD7N!>F7M2#)Eo`aNS&WUWjJIb_XY*wO0LEMj!T<mO

delta 32
ocmdnCS!&y6sfHHD7N!>F7M2#)Eo`aNS&R&<Ot)uFXY*wO0LD%V!2kdN

diff --git a/src/assets/styles/base/index.css b/src/assets/styles/base/index.css
index 5a7deb52..d610a3f1 100644
--- a/src/assets/styles/base/index.css
+++ b/src/assets/styles/base/index.css
@@ -113,12 +113,12 @@ blockquote {
 
 /* links */
 a {
-  text-decoration: none;
-}
-
-a,
-.active {
   color: var(--accent-color);
+  text-decoration: none;
+
+  & svg {
+    stroke: var(--accent-color);
+  }
 }
 
 a:hover,
@@ -303,10 +303,12 @@ a.view-all:focus svg {
   cursor: not-allowed;
 }
 
-a svg,
-nav .active svg,
-nav ul li .active svg {
-  stroke: var(--accent-color);
+.active {
+  color: var(--accent-color) !important;
+}
+
+.active svg {
+  stroke: var(--accent-color) !important;
 }
 
 /* social icons */
diff --git a/src/assets/styles/components/menu.css b/src/assets/styles/components/menu.css
index f7a72f94..48efad77 100644
--- a/src/assets/styles/components/menu.css
+++ b/src/assets/styles/components/menu.css
@@ -10,11 +10,13 @@
     overflow: hidden;
     margin: 0;
 
-    & .icon > svg {
+    & .icon > svg,
+    & .active > svg {
       display: block;
     }
 
-    & .icon > span {
+    & .icon > span,
+    & .active > span {
       display: none;
     }
   }
@@ -78,6 +80,7 @@ theme-toggle {
     justify-content: center;
     align-items: center;
     gap: 0;
+    z-index: 1;
 
     & > li {
       display: flex;
@@ -89,11 +92,13 @@ theme-toggle {
       color: var(--text-color);
       background: var(--background-color);
 
-      & .icon > svg {
+      & .icon > svg,
+      & .active > svg {
         display: none;
       }
 
-      & .icon > span {
+      & .icon > span,
+      & .active > span {
         display: inline;
       }
     }