From 26a0b494925e98e5dff62edf67f000f4742a9410 Mon Sep 17 00:00:00 2001
From: Teddy Middleton-Smith <edward.middletonsmith@gmail.com>
Date: Wed, 9 Apr 2025 14:51:43 +0100
Subject: [PATCH] Fix(UI): Navigation header styles.

---
 index.html                    |  6 +++---
 styles/layouts/navigation.css |  6 +++++-
 styles/themes.css             | 16 ++++++++--------
 3 files changed, 16 insertions(+), 12 deletions(-)

diff --git a/index.html b/index.html
index 819cec9..cc4475f 100644
--- a/index.html
+++ b/index.html
@@ -42,11 +42,11 @@
             <li><a href="#experience">Experience</a></li>
             <li><a href="#contact">Contact</a></li>
             <li>
-                <!-- <div id="theme-switch"></div> -->
                 <button class="theme-switch" aria-label="Toggle Dark Mode">
                     <img src="content/images/dark-mode-icon.webp" alt="Dark Mode" class="theme-icon dark-mode-icon">
-                    <!-- Added with JavaScript
-                    <img src="content/images/light-mode-icon.webp" alt="Light Mode" class="theme-icon light-mode-icon"> -->
+                    <!-- Deprecated - this is added with JavaScript now
+                        <img src="content/images/light-mode-icon.webp" alt="Light Mode" class="theme-icon light-mode-icon">
+                    -->
                 </button>
             </li>
             <li><div id="google_translate_element"></div></li>
diff --git a/styles/layouts/navigation.css b/styles/layouts/navigation.css
index cdbeaab..e912c2b 100644
--- a/styles/layouts/navigation.css
+++ b/styles/layouts/navigation.css
@@ -24,7 +24,11 @@ nav a {
     font-weight: 500;
     transition: color 0.3s;
 }
+nav a:visited {
+    color: var(--text-background-colour);
+}
 
-nav a:hover {
+nav a:hover,
+nav a:hover:visited {
     color: var(--accent-colour);
 }
\ No newline at end of file
diff --git a/styles/themes.css b/styles/themes.css
index 8dd3bd6..616e387 100644
--- a/styles/themes.css
+++ b/styles/themes.css
@@ -87,15 +87,15 @@
     background: none;
     border: none;
     cursor: pointer;
-    width: 5vh;
-    height: 5vh;
+    width: 4vh;
+    height: 4vh;
     padding: 0;
     display: flex;
     align-items: center;
     justify-content: center;
     position: relative;
     margin-top: auto;
-    border-radius: 2.5vh;
+    border-radius: 2vh;
 }
 .theme-switch:hover {
     background-color: var(--primary-colour);
@@ -111,13 +111,13 @@
 }
 img.theme-icon.dark-mode-icon {
     top: 0vh;
-    left: -0.1vh;
+    left: 0vh;
 }
 svg.theme-icon.light-mode-icon {
-    width: 4vh;
-    height: 4vh;
-    top: 0.55vh;
-    left: 0.45vh;
+    width: 3.5vh;
+    height: 3.5vh;
+    top: 0.25vh;
+    left: 0.25vh;
 }
 svg.theme-icon.light-mode-icon .background {
     fill: var(--secondary-colour);