adobe/spectrum-css

[Picker][RTL] Spinner margins are wrong

Rocss opened this issue · 0 comments

Description

If you're using the Picker in RTL direction, the spinner has a margin added between the spinner and the menu icon.
This margin should actually be between the spinner and the text.

Steps to reproduce

  1. Go to https://opensource.adobe.com/spectrum-css/preview/?path=/story/components-picker--default&args=isLoading:!true&globals=textDirection:rtl
  2. Observe the space between the menu icon and the spinner is bigger than it should be.

Expected behavior

The margin-inline-start property should be applied for the space between the spinner and the text. However, because of the direction: ltr property set on the spinner, this margin is applied wrong.

Screenshots

Screenshot 2024-02-28 at 12 10 31

Invalid icon placement, for reference:
Screenshot 2024-02-28 at 12 14 26

Environment

  • Version of the impacted component(s):
  • Browser(s) and OS(s):

Additional context

Tracked in https://jira.corp.adobe.com/browse/CSS-701