Popup content will be blurred on background of blurring Modal

[eGust]

Steps

1. Modal dimmer='blurring'
2. Modal.Content contains a Popup

Expected Result

While the Popup is triggered, it's content should show up on the same layer of the triggered component.

Actual Result

The content showed on background layer which is being blurred.

Version

0.67.2

Testcase

http://codepen.io/eGust/pen/zZXomK

[levithomason]

This appears to be a CSS issue, please post on https://github.com/Semantic-Org/Semantic-UI.

[semireg]

Quick fix for a globals css file:

.blurring.dimmed.dimmable > :not(.dimmer).popup {
  filter: none;
}

[OleksandrDanylchenko]

Quick fix for a globals css file:

.blurring.dimmed.dimmable > :not(.dimmer).popup {
  filter: none;
}

Thanks, it worked for me

[motiwalam]

The css fix didn't work for me, but adding a custom wrapper with filter: 'none' through the popper prop did.

<Popup
   ...
   popper={<div style={{ filter: 'none' }}></div>}
   ...
/>