Skip to content

Commit 59d51ea

Browse files
committed
fix(PanelPiano): 添加光标指针样式以提升用户交互体验
- 更新PanelPiano组件中的白键和黑键样式,增加cursor-pointer类以改善用户交互体验。 - 确保在用户悬停时,键盘按键显示为可点击状态,提升可用性。
1 parent c062f23 commit 59d51ea

File tree

1 file changed

+2
-2
lines changed

1 file changed

+2
-2
lines changed

examples/src/components/PanelPiano.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
<div
1010
v-for="(key, i) in pianoStore.whiteKeys"
1111
:key="key.index"
12-
class="absolute border border-[#bbb] rounded-b-md box-border transition-colors duration-100 shadow-sm top-0 h-full z-10 border-r border-[#eee]"
12+
class="absolute cursor-pointer border rounded-b-md box-border transition-colors duration-100 shadow-sm top-0 h-full z-10 border-r border-[#eee]"
1313
:class="[
1414
pianoStore.highlightKeys.includes(key.index)
1515
? 'bg-[#ffe082]'
@@ -22,7 +22,7 @@
2222
<div
2323
v-for="key in pianoStore.blackKeys"
2424
:key="key.index"
25-
class="absolute border border-[#bbb] rounded-b-md box-border transition-colors duration-100 h-20 top-0 border-[#444] shadow-md z-20"
25+
class="absolute cursor-pointer border rounded-b-md box-border transition-colors duration-100 h-20 top-0 border-[#444] shadow-md z-20"
2626
:class="[
2727
pianoStore.highlightKeys.includes(key.index)
2828
? 'bg-[#ffd54f]'

0 commit comments

Comments
 (0)