[ResponsivePopover]: it is no way to styling pointer

[gagarin880120]

Describe the bug When I try to style ResponsivePopover component, styles are not applied to pointer. When I try to style elements, which are under shadow-root (try to style exactly pointer via styled-components), I couldn't do this.

Isolated Example Please provide an isolated example if possible by forking this codesandbox. https://codesandbox.io/s/confident-mountain-c494j?file=/src/App.js

Expected behavior Pointer should match the border and shadow as the rest of the popover

Screenshots

UI5 Web Components for React Information @ui5/webcomponents version: 1.0.0-rc.15 @ui5/webcomponents-react version: 0.18.9 Operating System: Windows10 Browser: Google Chrome

Additional context Add any other context about the problem here.

[MarcusNotheis]

Thanks for reporting! I'll forward this issue to our UI5 Web Components Colleagues as the affected component is developed in their repository.

[ilhan007]

Hello @SAP/ui5-webcomponents-topic-rd this has not been dispatched until now, but it concerns the Responsive Popover and looks like a consulting (that might lead to some refactoring).

[TeodorTaushanov]

Hi @gagarin880120,

In the Popover we're using the box-shadow, so in your case you can override the "--sapContent_Shadow2" css parameter like:

"--sapContent_Shadow2": "0 0 0 0.0625rem red, 0 0.625rem 1.875rem 0 rgba(0,0,0,0.3)"

https://codesandbox.io/s/runtime-bird-ffqglo?file=/src/App.js

Best, Teo