duanshuwen/zn-ai
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style(ui): enhance hover states for interactive elements

Browse Source 
Improve user experience by adding consistent hover effects to clickable elements:
- ChatHistory "New Conversation" button now shows background and border color changes
- TaskCenter task items get subtle background change on hover
Both changes maintain visual consistency with the application's color scheme.
This commit is contained in:
duanshuwen
2026-04-06 21:56:57 +08:00
parent 6062120105
commit 2f627d6705
2 changed files with 4 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/pages/home/ChatHistory.vue
View File

@@ -5,7 +5,8 @@
<div class="font-bold text-gray-80">YINIAN</div> <div class="font-bold text-gray-80">YINIAN</div>
</div> </div>
<div class="flex justify-center m-2 bg-white rounded-lg p-2.5 border-[#E5E8EE] shadow-sm text-center" <div
class="flex justify-center m-2 bg-white rounded-lg p-2.5 border-[#E5E8EE] shadow-sm text-center cursor-pointer hover:bg-[#F5F7FA] hover:text-[#2B7FFF] hover:border-[#2B7FFF]"
@click="addNewChat"> @click="addNewChat">
<RiAddLine /> 新对话 <RiAddLine /> 新对话
</div> </div>

3
src/pages/home/TaskCenter.vue
View File

@@ -9,7 +9,8 @@
<div class="grid grid-cols-2 gap-4 max-[800px]:grid-cols-1"> <div class="grid grid-cols-2 gap-4 max-[800px]:grid-cols-1">
<div v-for="item in taskList" :key="item.id" class="flex gap-3 items-start p-3.5 <div v-for="item in taskList" :key="item.id" class="flex gap-3 items-start p-3.5
rounded-[10px] border border-[#dfeaf6] bg-white cursor-pointer" @click="handleTaskItem(item)"> rounded-[10px] border border-[#dfeaf6] bg-white cursor-pointer hover:bg-[#F5F7FA]"
@click="handleTaskItem(item)">
<div class="w-11 h-11 bg-[#EFF6FF] rounded-lg <div class="w-11 h-11 bg-[#EFF6FF] rounded-lg
border border-dashed border-[#9fc0e8] border border-dashed border-[#9fc0e8]
flex items-center justify-center flex items-center justify-center