优化

src/app/layouts/AppLayout.test.ts

@@ -55,6 +55,8 @@ describe('AppLayout', () => {
     expect(wrapper.text()).toContain('消息管理')
     expect(wrapper.text()).toContain('模板管理')
     expect(wrapper.text()).not.toContain('我的消息')
+    const notificationTrigger = wrapper.get('.notification-trigger')
+    expect(notificationTrigger.find('.notification-count').exists()).toBe(false)
   })
 
   it('hides the shell heading when the route opts out', async () => {

src/app/layouts/AppLayout.vue

@@ -168,7 +168,9 @@ watch(() => auth.user?.id || auth.user?.account || '', (userId, previousUserId)
 
 <style scoped>
 .app-header--without-page-heading .header-user { margin-left: auto; }
-.notification-trigger { display: inline-flex; min-height: 34px; align-items: center; gap: 6px; padding: 0 9px; border: 0; border-radius: 4px; background: transparent; color: var(--cc-muted); font: inherit; }
-.notification-trigger { cursor: pointer; }
-@media (max-width: 720px) { .notification-trigger > span { display: none; } }
+.notification-trigger { display: inline-flex; height: 38px; align-items: center; gap: 7px; padding: 0 12px; border: 1px solid rgba(255, 255, 255, .28); border-radius: 10px; background: rgba(255, 255, 255, .12); color: #fff; font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; transition: background .2s ease, border-color .2s ease, transform .2s ease; }
+.notification-trigger:hover { border-color: rgba(255, 255, 255, .48); background: rgba(255, 255, 255, .24); transform: translateY(-1px); }
+.notification-trigger:focus-visible { outline: 2px solid rgba(255, 255, 255, .9); outline-offset: 2px; }
+.notification-trigger > svg { flex: 0 0 auto; }
+@media (max-width: 720px) { .notification-trigger { width: 44px; height: 44px; justify-content: center; padding: 0; } .notification-trigger > span { display: none; } }
 </style>