fix: class conflict preventing clicks #329

Author: bayang

src/jelu-ui/src/assets/style.css

@@ -428,7 +428,7 @@ li.o-pagination__item button.o-pagination__button.o-pagination__button--current
 
 /* jelu sidebar menu*/
 
-.jl-sidebar {
+.jl-menubar {
     transition: width .6s ease;
     height: 100vh;
     gap: 10px;
@@ -439,13 +439,13 @@ li.o-pagination__item button.o-pagination__button.o-pagination__button--current
     @apply hover:bg-accent/70 rounded-md py-2;
     height: 40px;
 }
-.jl-sidebar a {
+.jl-menubar a {
     @apply flex justify-items-start;
 }
-.jl-sidebar a:hover {
+.jl-menubar a:hover {
     transition: all .6s ease;
 }
-.jl-sidebar svg {
+.jl-menubar svg {
     min-width: 50px;
     font-size: 20px;
 }

src/jelu-ui/src/components/AdminBase.vue

@@ -37,10 +37,9 @@ const isOpened = ref(false)
 <template>
   <div class="flex flex-row gap-4 w-full">
     <div class="justify-self-start">
-      <div class="jl-sidebar">
+      <div class="jl-menubar">
         <div
           v-if="isOpened"
-          class="jl-menu-icon jl-sidebar-item"
           @click="isOpened=!isOpened"
         >
           <svg
@@ -58,7 +57,6 @@ const isOpened = ref(false)
         </div>
         <div
           v-else
-          class="jl-menu-icon jl-sidebar-item"
           @click="isOpened=!isOpened"
         >
           <svg