Menu styling tweak

public/css/style.css

@@ -303,6 +303,18 @@ div.pp_default .pp_close:hover {
   margin-left: -10px;
 }
 
+.submenu li.selected a {
+  color: #0f259d !important;
+}
+
+.mobile-menu .submenu li.selected a,
+.mobile-menu .submenu li:hover a,
+.mobile-menu .submenu li.hover a {
+  color: white !important;
+  background: linear-gradient(to right, #0f259d, #5ba8f4);
+}
+
+
 .top_menu_container, .menu_mobile_container {
   height: 50px;
   max-width: 1170px;

resources/views/widgets/menu.blade.php

@@ -1,7 +1,23 @@
 <?php
-function isActive($link, $checksubmenus)
+function isActive($link, $submenus)
 {
+    if(count($submenus) > 0) {
+        foreach ($submenus as $subitem) {
+        if (isActive($subitem->link, $subitem->submenu)) {
+                return true;
+            }
+        }
+    }
+
+    if($link == "#") { 
         return false; 
+    }
+
+    if ($link == "/") {
+        return $_SERVER["REQUEST_URI"] == "/" || $_SERVER["REQUEST_URI"] == "";
+    }
+
+    return (substr($_SERVER["REQUEST_URI"], 0, strlen($link)) == $link);
 }
 
 function buildMenu($menu, $ismobile)
@@ -13,7 +29,7 @@ function buildMenu($menu, $ismobile)
         }
 
         $submenu = count($item->submenu) > 0;
-        $isactive = isActive($item->link, !$ismobile);
+        $isactive = isActive($item->link, $item->submenu);
         $icon = "";
         $isplayer = false;
         $isFile = false;
@@ -61,7 +77,7 @@ function buildMenu($menu, $ismobile)
 <nav class="d-none d-md-flex">
     <div></div>
     <ul class="menu d-none d-lg-block">
-        <li class="{{isActive('/', false) || isActive('/nieuws', false) ? "selected" : ""}}">
+        <li class="{{isActive('/', []) || isActive('/nieuws', []) ? "selected" : ""}}">
             <a href="/" title="Nieuws">Nieuws</a>
         </li>
         {!! buildMenu($items, false) !!}
@@ -80,7 +96,7 @@ function buildMenu($menu, $ismobile)
                     <a href="javascript:void(0)"><i class="fa-solid fa-xmark"></i></a>
                 </div>
             </li>
-            <li class="{{isActive('/', false) || isActive('/nieuws', false) ? "selected" : ""}}">
+            <li class="{{isActive('/', []) || isActive('/nieuws', []) ? "selected" : ""}}">
                 <a href="/" title="Nieuws">Nieuws</a>
             </li>
             {!! buildMenu($items, true) !!}