Skip to content

[Dialog]: Top-right corner shifts to the right when resizing in RTL mode #12310

@duygu-rmdn

Description

@duygu-rmdn

Bug Description

When resizing a ui5-dialog in RTL mode, the dialog’s top-right corner should remain fixed. However, after resizing, the dialog shifts unexpectedly and moves further to the right, instead of staying anchored in place.

Affected Component

ui5-dialog

Expected Behaviour

The dialog should stay fixed at the top-right corner while resizing in RTL mode.

Isolated Example

https://ui5.github.io/webcomponents/play/#eyJpbmRleC5odG1sIjp7Im5hbWUiOiJpbmRleC5odG1sIiwiY29udGVudCI6IjwhLS0gcGxheWdyb3VuZC1mb2xkIC0tPlxuPCFET0NUWVBFIGh0bWw-XG48aHRtbCBsYW5nPVwiZW5cIj5cblxuXG5cbjxoZWFkPlxuICAgIFxuICAgIDxzdHlsZT5cbiAgICAgICo6bm90KDpkZWZpbmVkKSB7XG4gICAgICAgIGRpc3BsYXk6IG5vbmU7XG4gICAgICB9XG5cbiAgICBodG1sIHtcbiAgICAgIGZvcmNlZC1jb2xvci1hZGp1c3Q6IG5vbmU7XG4gICAgfVxuICAgIDwvc3R5bGU-XG5cbiAgICBcbiAgICA8c3R5bGU-XG4gICAgICAqOm5vdCg6ZGVmaW5lZCkge1xuICAgICAgICBkaXNwbGF5OiBub25lO1xuICAgICAgfVxuXG4gICAgaHRtbCB7XG4gICAgICBmb3JjZWQtY29sb3ItYWRqdXN0OiBub25lO1xuICAgIH1cbiAgICA8L3N0eWxlPlxuXG4gICAgPG1ldGEgY2hhcnNldD1cIlVURi04XCI-XG4gICAgPG1ldGEgbmFtZT1cInZpZXdwb3J0XCIgY29udGVudD1cIndpZHRoPWRldmljZS13aWR0aCwgaW5pdGlhbC1zY2FsZT0xLjBcIj5cbiAgICA8dGl0bGU-U2FtcGxlPC90aXRsZT5cbjwvaGVhZD5cblxuPGJvZHkgc3R5bGU9XCJiYWNrZ3JvdW5kLWNvbG9yOiB2YXIoLS1zYXBCYWNrZ3JvdW5kQ29sb3IpOyBoZWlnaHQ6IDQ1MHB4O1wiPlxuICAgIDwhLS0gcGxheWdyb3VuZC1mb2xkLWVuZCAtLT5cblxuICAgIDx1aTUtYnV0dG9uIGlkPVwiZGlhbG9nT3BlbmVyXCI-T3BlbiBEaWFsb2c8L3VpNS1idXR0b24-XG5cbiAgPGRpdiBkaXI9XCJydGxcIj5cbiAgICA8dWk1LWRpYWxvZyBpZD1cImRpYWxvZ1wiIGhlYWRlci10ZXh0PVwiRHJhZ2dhYmxlL1Jlc2l6YWJsZSBkaWFsb2dcIiBkcmFnZ2FibGUgcmVzaXphYmxlPlxuICAgICAgICA8cD5Nb3ZlIHRoaXMgZGlhbG9nIGFyb3VuZCB0aGUgc2NyZWVuIGJ5IGRyYWdnaW5nIGl0IGJ5IGl0cyBoZWFkZXIuPC9wPlxuICAgICAgICA8cD5SZXNpemUgdGhpcyBkaWFsb2cgYnkgZHJhZ2dpbmcgaXQgYnkgaXRzIHJlc2l6ZSBoYW5kbGUuPC9wPlxuICAgICAgICA8cD5UaGVzZSBmZWF0dXJlcyBhcmUgYXZhaWxhYmxlIG9ubHkgb24gRGVza3RvcC48L3A-XG4gICAgICAgIDx1aTUtdG9vbGJhciBzbG90PVwiZm9vdGVyXCI-XG4gICAgICAgICAgICA8dWk1LXRvb2xiYXItYnV0dG9uIGNsYXNzPVwiZGlhbG9nQ2xvc2VyXCIgZGVzaWduPVwiRW1waGFzaXplZFwiIHRleHQ9XCJPS1wiPjwvdWk1LXRvb2xiYXItYnV0dG9uPlxuICAgICAgICA8L3VpNS10b29sYmFyPlxuICAgIDwvdWk1LWRpYWxvZz5cbiAgPC9kaXY-XG4gICAgPCEtLSBwbGF5Z3JvdW5kLWZvbGQgLS0-XG4gICAgPHNjcmlwdCB0eXBlPVwibW9kdWxlXCIgc3JjPVwibWFpbi5qc1wiPjwvc2NyaXB0PlxuPC9ib2R5PlxuXG48L2h0bWw-XG48IS0tIHBsYXlncm91bmQtZm9sZC1lbmQgLS0-XG4ifSwibWFpbi5qcyI6eyJuYW1lIjoibWFpbi5qcyIsImNvbnRlbnQiOiIvKiBwbGF5Z3JvdW5kLWhpZGUgKi9cbmltcG9ydCBcIi4vcGxheWdyb3VuZC1zdXBwb3J0LmpzXCI7XG4vKiBwbGF5Z3JvdW5kLWhpZGUtZW5kICovXG5pbXBvcnQgXCJAdWk1L3dlYmNvbXBvbmVudHMvZGlzdC9EaWFsb2cuanNcIjtcbmltcG9ydCBcIkB1aTUvd2ViY29tcG9uZW50cy9kaXN0L0J1dHRvbi5qc1wiO1xuaW1wb3J0IFwiQHVpNS93ZWJjb21wb25lbnRzL2Rpc3QvVG9vbGJhci5qc1wiO1xuaW1wb3J0IFwiQHVpNS93ZWJjb21wb25lbnRzL2Rpc3QvVG9vbGJhckJ1dHRvbi5qc1wiO1xuXG52YXIgZGlhbG9nT3BlbmVyID0gZG9jdW1lbnQuZ2V0RWxlbWVudEJ5SWQoXCJkaWFsb2dPcGVuZXJcIik7XG52YXIgZGlhbG9nID0gZG9jdW1lbnQuZ2V0RWxlbWVudEJ5SWQoXCJkaWFsb2dcIik7XG52YXIgZGlhbG9nQ2xvc2VycyA9IFsuLi5kaWFsb2cucXVlcnlTZWxlY3RvckFsbChcIi5kaWFsb2dDbG9zZXJcIildO1xuXG5kaWFsb2dPcGVuZXIuYWNjZXNzaWJpbGl0eUF0dHJpYnV0ZXMgPSB7XG4gICAgaGFzUG9wdXA6IFwiZGlhbG9nXCIsXG4gICAgY29udHJvbHM6IGRpYWxvZy5pZCxcbn07XG5kaWFsb2dPcGVuZXIuYWRkRXZlbnRMaXN0ZW5lcihcImNsaWNrXCIsICgpID0-IHtcbiAgICBkaWFsb2cub3BlbiA9IHRydWU7XG59KTtcbmRpYWxvZ0Nsb3NlcnMuZm9yRWFjaChidG4gPT4ge1xuICAgIGJ0bi5hZGRFdmVudExpc3RlbmVyKFwiY2xpY2tcIiwgKCkgPT4ge1xuICAgICAgICBkaWFsb2cub3BlbiA9IGZhbHNlO1xuICAgIH0pO1xufSkifX0

Steps to Reproduce

  1. Open the following sample: Playground Sample

  2. Resize the dialog by dragging from the corner.

Log Output, Stack Trace or Screenshots

No response

Priority

Low

UI5 Web Components Version

latest

Browser

Chrome

Operating System

No response

Additional Context

No response

Organization

No response

Declaration

  • I’m not disclosing any internal or sensitive information.

Metadata

Metadata

Assignees

Labels

Type

Projects

Status

Completed

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions