Problem z Dashplex i kolorowaniem Menu

Potrzebuję waszej pomocy.
Mam problem z kolorowaniem (podświetlaniem) aktualnego menu
Mam za dużo podświetlone.

Layout to DashPlex

Menu jest zrobione poprzez

Kopiuj

<ul class="menu-nav nav" style="margin-left: 0px; margin-right: 0px;">

...


<li class="nav-item"><a class="nav-link with-sub"
      href="javascript:;"> <svg class="sidemenu-icon menu-icon"
              xmlns="http://www.w3.org/2000/svg"
              enable-background="new 0 0 24 24" viewBox="0 0 24 24">
              <path
                  d=""></path></svg>
          <span class="sidemenu-label"><font
              style="vertical-align: inherit;"><font
                  style="vertical-align: inherit;">Faktury</font></font></span> <i
          class="angle fe fe-chevron-right"></i>
  </a>
      <ul class="nav-sub">
          <li class="side-menu-label1"><a href="javascript:;"><font
                  style="vertical-align: inherit;"><font
                      style="vertical-align: inherit;">Faktury</font></font></a></li>
          <li class="nav-sub-item"><a class="nav-sub-link"
              href="{{ path('app_fs_lista_mie_num_tf_r', {'miesiac': "now"|date("Y-m"),'numeracja':'0','typfaktury':'0','rows':'50'}) }}"><font
                  style="vertical-align: inherit;"><font
                      style="vertical-align: inherit;">Sprzedaż</font></font></a></li>
          <li class="nav-sub-item"><a class="nav-sub-link"
              href="{{absolute_url(path('app_faktura_lista_zakupy', { 'miesiac': "now"|date("Y-m") }))}}"><font
                  style="vertical-align: inherit;"><font
                      style="vertical-align: inherit;">Zakupy</font></font></a></li>

      </ul></li>

...

<li class="nav-item"><a class="nav-link"
      href="{{absolute_url(path('app_dokumentlistmiesiac', { 'miesiac': "now"|date("Y-m") })) }}">
          <svg class="sidemenu-icon menu-icon"
              xmlns="http://www.w3.org/2000/svg"
              enable-background="new 0 0 24 24" viewBox="0 0 24 24">
              <path
                  d=""></path></svg>
          <span class="sidemenu-label"><font
              style="vertical-align: inherit;"><font
                  style="vertical-align: inherit;">Dokumenty</font></font></span>
  </a></li>
...


<li class="nav-item"><a class="nav-link"
      href="{{absolute_url(path('app_listaplac_lista', { 'rok': "now"|date("Y") }))}}">
          <svg class="sidemenu-icon menu-icon"
              xmlns="http://www.w3.org/2000/svg"
              enable-background="new 0 0 24 24" viewBox="0 0 24 24">
              <path
                  d="" /></svg>
          <span class="sidemenu-label">Płace</span>
  </a></li>

Niestety podświetla mi za dużo i dodaje w kilku pozycjach klasę active zamiast jednej pozycji

Kopiuj