search

vuetifyjs / vuetify

🐉 Vue Component Framework
https://vuetifyjs.com
MIT License
39.83k stars 6.97k forks source link

[Bug Report][3.6.10] VWindowItem always sets cursor to default #20090

Open wagich opened 3 months ago

wagich commented 3 months ago

Environment

Vuetify Version: 3.6.10 Vue Version: 3.4.31 Browsers: Edge 126.0.0.0 OS: Windows

Steps to reproduce

Expected Behavior

The cursor displayed should depend on the element that is hovered over.

Actual Behavior

The cursor stays as the default cursor unless it hovers over an element that explicitly set a different cursor.

Reproduction Link

https://play.vuetifyjs.com/#...

Other comments

The MaybeTransition element inside of VWindowItem seems to incorrectly output a disabled attribute into the rendered markup (disabled="false"). Since this is a boolean attribute, it's presence indicates true and it should not be rendered at all in the false case.

The presence of the attribute makes the CSS rule at https://github.com/vuetifyjs/vuetify/blob/master/packages/vuetify/src/styles/generic/_reset.scss#L127 apply that sets the cursor for any children to the default one (unless a child explicitly overrode its cursor).

antoinematyja commented 4 days ago

I also ran into this issue today using VTabs. I was about to create an issue but found yours and it's perfect 👍🏻

I tried to find a workaround using props to remove the disabled attribute but it wasn't possible, so I used this dirty CSS:

[disabled] {
  cursor: inherit;
}

[disabled]:not(.v-window-item) {
  cursor: default;
}