Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

bug(cdk/overlay): panel 'pointer-events' can not be overridden by panelClass #21656

Closed
jbedard opened this issue Jan 21, 2021 · 2 comments · Fixed by #21666
Closed

bug(cdk/overlay): panel 'pointer-events' can not be overridden by panelClass #21656

jbedard opened this issue Jan 21, 2021 · 2 comments · Fixed by #21666
Assignees
Labels
area: cdk/overlay P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent

Comments

@jbedard
Copy link

jbedard commented Jan 21, 2021

Expected Behavior

I'd like to be able to completely disable pointer-events on an overlay. The .cdk-overlay-pane is the only element that doesn't have pointer-events: none, and there is the panelClass feature to add more styling to that so I'd assume that's the way to do it.

Actual Behavior

_togglePointerEvents overrides pointer-events in the style attribute 100% of the time. The .cdk-overlay-pane already sets pointer-events: auto so I think _togglePointerEvents can set pointer-events: none when necessary but otherwise drop the inline one and let the css do whatever it wants?

Environment

  • Angular: 11
  • CDK/Material: 11
@jbedard jbedard added needs triage This issue needs to be triaged by the team area: cdk/overlay labels Jan 21, 2021
@jbedard
Copy link
Author

jbedard commented Jan 21, 2021

If we agree this is an issue/valid-request I think the fix would be pretty trivial and I can do it. I think simply changing 'auto' to '' in _togglePointerEvents would fix it?

@crisbeto crisbeto added has pr P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent and removed needs triage This issue needs to be triaged by the team labels Jan 21, 2021
@crisbeto crisbeto self-assigned this Jan 21, 2021
crisbeto added a commit to crisbeto/material2 that referenced this issue Jan 21, 2021
We set `pointer-events: auto` on the overlay when it is attached and then `none` while it's
detaching which ends up overriding any other styles the user might have. These changes
reset to `''` instead.

Fixes angular#21656.
andrewseguin pushed a commit that referenced this issue Jan 25, 2021
We set `pointer-events: auto` on the overlay when it is attached and then `none` while it's
detaching which ends up overriding any other styles the user might have. These changes
reset to `''` instead.

Fixes #21656.
andrewseguin pushed a commit that referenced this issue Jan 25, 2021
We set `pointer-events: auto` on the overlay when it is attached and then `none` while it's
detaching which ends up overriding any other styles the user might have. These changes
reset to `''` instead.

Fixes #21656.

(cherry picked from commit 9e87050)
wagnermaciel pushed a commit to wagnermaciel/components that referenced this issue Jan 26, 2021
We set `pointer-events: auto` on the overlay when it is attached and then `none` while it's
detaching which ends up overriding any other styles the user might have. These changes
reset to `''` instead.

Fixes angular#21656.
mmalerba pushed a commit to mmalerba/components that referenced this issue Jan 29, 2021
We set `pointer-events: auto` on the overlay when it is attached and then `none` while it's
detaching which ends up overriding any other styles the user might have. These changes
reset to `''` instead.

Fixes angular#21656.
wagnermaciel pushed a commit to wagnermaciel/components that referenced this issue Feb 8, 2021
We set `pointer-events: auto` on the overlay when it is attached and then `none` while it's
detaching which ends up overriding any other styles the user might have. These changes
reset to `''` instead.

Fixes angular#21656.
wagnermaciel pushed a commit to wagnermaciel/components that referenced this issue Feb 8, 2021
We set `pointer-events: auto` on the overlay when it is attached and then `none` while it's
detaching which ends up overriding any other styles the user might have. These changes
reset to `''` instead.

Fixes angular#21656.
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Feb 25, 2021
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
area: cdk/overlay P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants