11<v-sidebar-drawer >
2- <i class =" icon-menu hidden cursor-pointer rounded-md p-1.5 text-2xl hover:bg-gray-100 dark:hover:bg-gray-950 max-lg:block" ></i >
2+ <i class =" icon-menu lg: hidden cursor-pointer rounded-md p-1.5 text-2xl hover:bg-gray-100 dark:hover:bg-gray-950 max-lg:block" ></i >
33</v-sidebar-drawer >
44
55@pushOnce (' scripts' )
6- <script
7- type =" text/x-template"
6+ <script
7+ type =" text/x-template"
88 id =" v-sidebar-drawer-template"
99 >
10- < x- admin:: drawer
11- position= " left"
10+ < x- admin:: drawer
11+ position= " left"
1212 width= " 280px"
13- class = " [&>:nth-child(3)]:!m-0 [&>:nth-child(3)]:!rounded-l-none [&>:nth-child(3)]:max-sm:!w-[80%]"
13+ class = " lg:hidden [&>:nth-child(3)]:!m-0 [&>:nth-child(3)]:!rounded-l-none [&>:nth-child(3)]:max-sm:!w-[80%]"
1414 >
1515 < x- slot: toggle>
16- < i class = " icon-menu hidden cursor-pointer rounded-md p-1.5 text-2xl hover:bg-gray-100 dark:hover:bg-gray-950 max-lg:block" >< / i>
16+ < i class = " icon-menu lg: hidden cursor-pointer rounded-md p-1.5 text-2xl hover:bg-gray-100 dark:hover:bg-gray-950 max-lg:block" >< / i>
1717 < / x- slot>
1818
1919 < x- slot: header>
2020 @if ($logo = core ()-> getConfigData (' general.design.admin_logo.logo_image' ) )
21- < img
22- class = " h-10"
23- src= " {{ Storage:: url ($logo ) } }"
24- alt= " {{ config (' app.name' ) } }"
21+ < img
22+ class = " h-10"
23+ src= " {{ Storage:: url ($logo ) } }"
24+ alt= " {{ config (' app.name' ) } }"
2525 / >
2626 @else
27- < img
27+ < img
2828 class = " h-10"
2929 src= " {{ request ()-> cookie (' dark_mode' ) ? vite ()-> asset (' images/dark-logo.svg' ) : vite ()-> asset (' images/logo.svg' ) } }"
30- id= " logo-image"
31- alt= " {{ config (' app.name' ) } }"
30+ id= " logo-image"
31+ alt= " {{ config (' app.name' ) } }"
3232 / >
3333 @endif
3434 < / x- slot>
@@ -41,19 +41,19 @@ class="h-10"
4141 $hasActiveChild = $menuItem -> haveChildren () && collect ($menuItem -> getChildren ())-> contains (fn ($child ) => $child -> isActive ());
4242
4343 $isMenuActive = $menuItem -> isActive () == ' active' || $hasActiveChild ;
44-
44+
4545 $menuKey = $menuItem -> getKey ();
4646 @endphp
4747
48- < div
49- class = " menu-item relative"
48+ < div
49+ class = " menu-item relative"
5050 data- menu- key= " {{ $menuKey } }"
5151 >
52- < a
52+ < a
5353 href= " {{ ! in_array ($menuItem -> getKey (), [' settings' , ' configuration' ]) && $menuItem -> haveChildren () ? ' javascript:void(0)' : $menuItem -> getUrl () } }"
5454 class = " menu-link flex items-center justify-between rounded-lg p-2 transition-colors duration-200"
55- @if ($menuItem -> haveChildren () && ! in_array ($menuKey , [' settings' , ' configuration' ]) )
56- @click .prevent = " toggleMenu('{{ $menuKey } } ')"
55+ @if ($menuItem -> haveChildren () && ! in_array ($menuKey , [' settings' , ' configuration' ]) )
56+ @click .prevent = " toggleMenu('{{ $menuKey } } ')"
5757 @endif
5858 : class = " { 'bg-brandColor text-white': activeMenu === '{{ $menuKey } } ' || {{ $isMenuActive ? ' true' : ' false' } } , 'text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-950': !(activeMenu === '{{ $menuKey } } ' || {{ $isMenuActive ? ' true' : ' false' } } ) }"
5959 >
@@ -64,20 +64,20 @@ class="menu-link flex items-center justify-between rounded-lg p-2 transition-col
6464 < / div>
6565
6666 @if ($menuItem -> haveChildren () )
67- < span
67+ < span
6868 class = " transform text-lg transition-transform duration-300"
6969 : class = " { 'icon-arrow-up': activeMenu === '{{ $menuKey } } ', 'icon-arrow-down': activeMenu !== '{{ $menuKey } } ' }"
7070 >< / span>
7171 @endif
7272 < / a>
7373
7474 @if ($menuItem -> haveChildren () && ! in_array ($menuKey , [' settings' , ' configuration' ]) )
75- < div
75+ < div
7676 class = " submenu ml-1 mt-1 overflow-hidden rounded-b-lg border-l-2 transition-all duration-300 dark:border-gray-700"
7777 : class = " { 'max-h-[500px] py-2 border-l-brandColor bg-gray-50 dark:bg-gray-900': activeMenu === '{{ $menuKey } } ' || {{ $hasActiveChild ? ' true' : ' false' } } , 'max-h-0 py-0 border-transparent bg-transparent': activeMenu !== '{{ $menuKey } } ' && !{{ $hasActiveChild ? ' true' : ' false' } } }"
7878 >
7979 @foreach ($menuItem -> getChildren () as $subMenuItem )
80- < a
80+ < a
8181 href= " {{ $subMenuItem -> getUrl () } }"
8282 class = " submenu-link block whitespace-nowrap p-2 pl-10 text-sm transition-colors duration-200"
8383 : class = " { 'text-brandColor font-medium bg-gray-100 dark:bg-gray-800': '{{ $subMenuItem -> isActive () } } ' === '1', 'text-gray-600 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-800': '{{ $subMenuItem -> isActive () } } ' !== '1' }" >
@@ -104,7 +104,7 @@ class="submenu-link block whitespace-nowrap p-2 pl-10 text-sm transition-colors
104104
105105 mounted () {
106106 const activeElement = document .querySelector (' .menu-item .menu-link.bg-brandColor' );
107-
107+
108108 if (activeElement) {
109109 this .activeMenu = activeElement .closest (' .menu-item' ).getAttribute (' data-menu-key' );
110110 }
0 commit comments