From cba25e34f714be8dfa546886b345b808f39b6b1f Mon Sep 17 00:00:00 2001
From: daudix <ddaudix@gmail.com>
Date: Sun, 9 Jun 2024 19:13:53 +0300
Subject: [PATCH] Change order of the current nav item indicator styles

---
 sass/_general.scss |  2 ++
 sass/_nav.scss     | 20 ++++++++++----------
 2 files changed, 12 insertions(+), 10 deletions(-)

diff --git a/sass/_general.scss b/sass/_general.scss
index 7db3fd8..1b41177 100644
--- a/sass/_general.scss
+++ b/sass/_general.scss
@@ -54,12 +54,14 @@ body {
 	}
 }
 
+// Custom focus indicator
 :focus-visible {
 	animation: focus-in var(--transition);
 	outline: 0.125rem solid var(--primary-color);
 	outline-offset: 2px;
 }
 
+// Fallback for older browsers
 @supports not selector(:focus-visible) {
 	:focus {
 		animation: focus-in var(--transition);
diff --git a/sass/_nav.scss b/sass/_nav.scss
index ac10bd8..8b4bec0 100644
--- a/sass/_nav.scss
+++ b/sass/_nav.scss
@@ -65,16 +65,6 @@
 			}
 
 			&.active {
-				&:hover::before {
-					right: 1rem;
-					left: 1rem;
-					border-bottom: 0.25rem solid var(--primary-color);
-				}
-
-				&:active::before {
-					border-radius: 0.25rem;
-				}
-
 				&::before {
 					display: block;
 					position: absolute;
@@ -87,6 +77,16 @@
 					border-radius: 0 0 0.25rem 0.25rem;
 					content: "";
 				}
+
+				&:hover::before {
+					right: 1rem;
+					left: 1rem;
+					border-bottom: 0.25rem solid var(--primary-color);
+				}
+
+				&:active::before {
+					border-radius: 0.25rem;
+				}
 			}
 		}