优化菜单栏选中和鼠标悬浮的背景色

.changeset/clean-bobcats-exercise.md

@@ -0,0 +1,5 @@
+---
+"@opendoc/frontend": patch
+---
+
+优化菜单栏选中和鼠标悬浮的背景色

app/backend/package.json

@@ -70,7 +70,7 @@
     "ws": "^8.18.0"
   },
   "devDependencies": {
-    "@buka/eslint-config": "^2.0.2",
+    "@buka/eslint-config": "^2.0.3",
     "@nestjs/cli": "^10.4.5",
     "@nestjs/schematics": "^10.1.4",
     "@nestjs/testing": "^10.4.1",

app/compiler/package.json

@@ -67,7 +67,7 @@
     "ws": "^8.18.0"
   },
   "devDependencies": {
-    "@buka/eslint-config": "^2.0.2",
+    "@buka/eslint-config": "^2.0.3",
     "@nestjs/cli": "^10.4.5",
     "@nestjs/schematics": "^10.1.4",
     "@nestjs/testing": "^10.4.1",

app/frontend/assets/css/menu.css

@@ -0,0 +1,13 @@
+/* 更改 menu 组件选中后的背景/前景色 */
+.d-menu li > *:not(ul, .d-menu-title, details, .d-btn):active,
+.d-menu li > *:not(ul, .d-menu-title, details, .d-btn).d-active,
+.d-menu li > details > summary:active {
+  @apply bg-ctp-surface0 text-inherit;
+}
+
+/* 更改 menu 鼠标悬浮时的背景色 */
+@media (hover: hover) {
+  :where(.d-menu li:not(.d-menu-title, .d-disabled) > *:not(ul, details, .d-menu-title)):not(.d-active, .d-btn):hover, :where(.d-menu li:not(.d-menu-title, .d-disabled) > details > summary:not(.d-menu-title)):not(.d-active, .d-btn):hover {
+    @apply bg-ctp-surface0/30;
+  }
+}

app/frontend/nuxt.config.ts

@@ -16,6 +16,7 @@ export default defineNuxtConfig({
     '~/assets/css/main.css',
     '~/assets/css/schema.css',
     '~/assets/css/tabs.css',
+    '~/assets/css/menu.css',
     '~/assets/css/shiki-themes.css',
     '~/assets/css/tabler-icon.css',
   ],

app/frontend/package.json

@@ -11,7 +11,7 @@
     "postinstall": "nuxt prepare"
   },
   "devDependencies": {
-    "@buka/eslint-config": "^2.0.2",
+    "@buka/eslint-config": "^2.0.3",
     "@catppuccin/tailwindcss": "^0.1.6",
     "@nuxt/devtools": "^1.4.1",
     "@nuxt/eslint": "^0.5.4",

app/frontend/pages/application/[application_id]/sheet/[sheet_id]/[version]/openapi/operation.vue

@@ -87,7 +87,10 @@ const counter = computed(() => ({
   <div class="size-full flex items-stretch">
     <div class="bg-ctp-mantle flex-0 overflow-y-auto overflow-x-hidden h-full">
       <div class="p-2">
-        <search v-model="filter" class="d-input-xs" />
+        <search
+          v-model="filter"
+          class="d-input-xs"
+        />
 
         <div class="w-full px-1 text-xs text-base-content/50 font-bold inline-flex justify-between">
           <span>GET: {{ counter.get }}</span>
@@ -99,12 +102,21 @@ const counter = computed(() => ({
       </div>
 
       <ul class="flex-nowrap d-menu d-menu-sm w-72 h-full">
-        <template v-for="group in groups" :key="group.key">
-          <li v-if="group.tags.length" class="d-menu-title">
+        <template
+          v-for="group in groups"
+          :key="group.key"
+        >
+          <li
+            v-if="group.tags.length"
+            class="d-menu-title"
+          >
             {{ group.tags.join(',') }}
           </li>
 
-          <li v-for="operation in group.operations" :key="operation.$uid">
+          <li
+            v-for="operation in group.operations"
+            :key="operation.$uid"
+          >
             <NuxtLink
               class="block w-full"
               :to="{ path: `${prefix}/${operation.$uid}`, query: route.query }"

pkg/register/package.json

@@ -33,7 +33,7 @@
     "test:update": "jest --updateSnapshot"
   },
   "devDependencies": {
-    "@buka/eslint-config": "^2.0.2",
+    "@buka/eslint-config": "^2.0.3",
     "@jest/globals": "^29.7.0",
     "@types/fs-extra": "^11.0.4",
     "@types/node": "^20.16.2",

pkg/sdk/package.json

@@ -37,7 +37,7 @@
     "test:update": "jest --updateSnapshot"
   },
   "devDependencies": {
-    "@buka/eslint-config": "^2.0.2",
+    "@buka/eslint-config": "^2.0.3",
     "@jest/globals": "^29.7.0",
     "@types/fs-extra": "^11.0.4",
     "@types/node": "^20.16.2",