style: 微调样式

resources/admin/components/admin/dialog/index.vue

@@ -6,9 +6,9 @@
           <div>
             <h4 :id="titleId" :class="titleClass">{{ title }}</h4>
           </div>
-          <div class="flex w-14 justify-between">
-            <Icon :name="fullscreenIcon" @click="fullscreen" class="hover:cursor-pointer" />
-            <Icon name="x-mark" class="hover:cursor-pointer" @click="close" />
+          <div class="flex w-12 justify-end">
+            <!--<Icon :name="fullscreenIcon" @click="fullscreen" className="hover:cursor-pointer w-4 h-4" />-->
+            <Icon name="x-mark" className="hover:cursor-pointer w-5 h-5" @click="close" />
           </div>
         </div>
       </template>

resources/admin/layout/components/Menu/item.vue

@@ -19,7 +19,7 @@
 
 <script lang="ts" name="MenuItem" setup>
 import { Menu } from '/admin/types/Menu'
-import { PropType } from 'vue'
+import { onMounted, PropType, ref } from 'vue'
 import { useAppStore } from '/admin/stores/modules/app'
 import { isMiniScreen } from '/admin/support/helper'
 

resources/admin/layout/components/Menu/menus.vue

@@ -30,14 +30,6 @@ const selectMenu = (index: string) => {
   border-right: none;
 }
 
-:deep(.el-menu--inline) {
-  @apply pt-1 pb-2;
-}
-
-:deep(.ct-menu-item) {
-  @apply mt-1;
-}
-
 :deep(.is-active) {
   background-color: var(--side-active-menu-bg-color) !important;
 }
@@ -62,5 +54,16 @@ const selectMenu = (index: string) => {
 
 :deep(.el-menu-item:hover) {
   background-color: var(--sider-sub-menu-hover-bg-color) !important;
+  border-right: 3px solid;
+  border-right-color: var(--el-color-primary);
+}
+
+:deep(.el-menu-item.is-active) {
+  border-right: 3px solid;
+  border-right-color: var(--el-color-primary);
+}
+
+:deep(.el-menu-item) {
+  height: 50px !important;
 }
 </style>

resources/admin/styles/theme/dark.scss

@@ -29,4 +29,6 @@ html.dark {
 
   // side sub menu margin
   --sider-sub-menu-bg-margin: 0px 0.05rem;
+
+  --el-mask-color: transparent;
 }