patch: active/inactive styles on navbar

assets/controllers/navbar_controller.js

@@ -0,0 +1,25 @@
+import { Controller } from '@hotwired/stimulus';
+
+/*
+* The following line makes this controller "lazy": it won't be downloaded until needed
+* See https://github.com/symfony/stimulus-bridge#lazy-controllers
+*/
+/* stimulusFetch: 'lazy' */
+export default class extends Controller {
+    inactiveStyles = "block rounded-lg px-4 py-2 text-sm font-medium text-gray-50 hover:bg-orange-500 hover:bg-opacity-80";
+    activeStyles = "block rounded-lg bg-orange-500 hover:bg-opacity-70 bg-clip-padding backdrop-filter backdrop-blur-md bg-opacity-80 px-4 py-2 text-sm font-medium text-gray-50";
+
+    connect() {
+        console.log(window.location.pathname);
+        this.element.querySelectorAll('a:not(.nav-foot)').forEach(link => {
+            link.className = this.inactiveStyles;
+            if (window.location.pathname === (new URL(link.href)).pathname || window.location.pathname.startsWith( (new URL(link.href)).pathname + '/' ) ) {
+                link.className = this.activeStyles;
+            }
+        });
+    }
+
+    setActive() {
+
+    }
+}