From e80a6ca5400b3a7e4670fc0ff8099e7b9cd00a9c Mon Sep 17 00:00:00 2001
From: Brooke Kuhlmann <brooke@alchemists.io>
Date: Fri, 10 Jul 2026 17:19:39 -0600
Subject: [PATCH] Updated menu item style to use active state

Instead of looking for the `.active` class, we'll use `data-state="active"` as our check which aligns with the `MenuItem` scope.

Milestone: minor
---
 app/assets/css/layout.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/assets/css/layout.css b/app/assets/css/layout.css
index da0bcc16..96ee986b 100644
--- a/app/assets/css/layout.css
+++ b/app/assets/css/layout.css
@@ -160,7 +160,7 @@
     text-decoration: none;
     transition: border-bottom-color 0.3s ease-in-out;
 
-    &:hover, &:active, &.active {
+    &:hover, &:active, &[data-state="active"] {
       border-bottom-color: var(--site-orange);
     }
   }