refactor: update layout

src/components/AppSidebar.vue

@@ -1,6 +1,6 @@
 <template>
   <CSidebar
-    class="border-end"
+    class="sidebar-dark border-end"
     position="fixed"
     :unfoldable="sidebarUnfoldable"
     :visible="sidebarVisible"

src/components/AppSidebarNav.js

@@ -62,6 +62,7 @@ const AppSidebarNav = defineComponent({
         return h(
           CNavGroup,
           {
+            compact: true,
             ...(firstRender.value && {
               visible: item.items.some((child) => isActiveItem(route, child)),
             }),
@@ -97,11 +98,16 @@ const AppSidebarNav = defineComponent({
                   },
                   {
                     default: () => [
-                      item.icon &&
+                      item.icon
-                        h(resolveComponent('CIcon'), {
+                        ? h(resolveComponent('CIcon'), {
-                          customClassName: 'nav-icon',
+                            customClassName: 'nav-icon',
-                          name: item.icon,
+                            name: item.icon,
-                        }),
+                          })
+                        : h(
+                            'span',
+                            { class: 'nav-icon' },
+                            h('span', { class: 'nav-icon-bullet' }),
+                          ),
                       item.name,
                       item.badge &&
                         h(