Problem/Motivation

In RTL, the Media Library remove button misaligns its positioning under the edit icon after an AJAX operation (adding, editing or deleting) is triggered.

Steps to reproduce

1. Open any edit form that contains a Media Library widget (e.g., a Node or Paragraph edit page) in an RTL language (Arabic).

2. Inspect the Media Library item's remove button (or observe its position). Note that the remove button aligns correctly on initial page load.

3. Trigger an AJAX action by clicking Edit or Remove on an existing media item, or by adding a new image to the Media Library widget.

4. Observe the remove button's alignment. The button shifts/misaligns because Drupal dynamically injects Claro's media_library.css into the , overriding the initial RTL positioning.

Proposed resolution

Add "left: auto;" to the selector ".media-library-item__remove.button:first-child "

Issue fork root-3621320

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

About issue forks

Comments

reemsaleem created an issue. See original summary.

reemsaleem opened merge request !18

ahmad-alyasaki’s picture

ahmad-alyasaki commented
Status: Active » Fixed

Now that this issue is closed, review the contribution record.

As a contributor, attribute any organization that helped you, or if you volunteered your own time.

Maintainers, credit people who helped resolve this issue.

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.