search

SAP / ui5-webcomponents

UI5 Web Components - the enterprise-flavored sugar on top of native APIs! Build SAP Fiori user interfaces with the technology of your choice.
https://sap.github.io/ui5-webcomponents/
Apache License 2.0
1.51k stars 263 forks source link

[Popover | UDEx | 1.24.9]: Popover Arrow is misplaced when Box next to top/bottom #9886

Open calmon opened 1 week ago

calmon commented 1 week ago

Bug Description

Popover Component Arrow is missplaced as soon as the box doesn't have enough space.

Affected Component

Popover

Expected Behaviour

Expect: The Arrow is alligned to the mid of the button Instead it's either bottom or top (depending the popup box is close to top/bottom), see screenshot

Isolated Example

No response

Steps to Reproduce

  1. Check out: https://sap.github.io/ui5-webcomponents/v1/components/Popover/
  2. Give the button (id="btn") some margin-top: 50px
  3. click the button

Expect: The Arrow is alligned to the mid of the button Instead it's either bottom or top (depending the popup box is close to top/bottom), see screenshot

Log Output, Stack Trace or Screenshots

image

Priority

None

UI5 Web Components Version

1.24.9 but it's also in 2.2.0

Browser

Chrome

Operating System

MacOS

Additional Context

No response

Organization

No response

Declaration

IlianaB commented 1 week ago

Hello @ui5-webcomponents-topic-rd, please have a look at this issue. It seems the Popover arrow is misplaced, when you add to its opener margin-top or margin-bottom, which move it to close to the top/bottom of the container (as reported). For me, the arrow seems misplaced (not at the center) even without additional margins.

Regards, Iliana