Bugzilla

(In reply to Julien Wajsberg [:julienw] from comment #2)
> I think we need to add this to `#login-sort`:
> ```css
> background-position: right 3px center;
> ```
> (and of course have something for RTL too)
> 
> What do you think itiel? Do you see a better idea? Should we add some shared style for such compact select boxes?

Oof, this is annoying :(
I like your idea of adding a compact `select` class, but how compact is "compact"? Future UIs specs may require other spacing that may be somewhere between "normal" and "compact", etc...
I think to make this easier to fix for next time (hopefully there won't be a next time but we said it last time as well...), adding vars for the inline-start and inline-end paddings would allow overriding them without specifying the RTL variants (for the background position you mentioned above).
Of course the background position would need to be calculated according to this, maybe something like `calc((var(--select-padding-inline-end) - 12px /* = background-image size /*) / 2) to center the arrow in the end.

I'm not feeling well at the moment so I can't work on it soon-ish, if you're not up for the task bounce the needinfo back to me and I'll work on it when I can :)

(In reply to Julien Wajsberg [:julienw] from comment #2)
> I think we need to add this to `#login-sort`:
> ```css
> background-position: right 3px center;
> ```
> (and of course have something for RTL too)
> 
> What do you think itiel? Do you see a better idea? Should we add some shared style for such compact select boxes?

Oof, this is annoying :(
I like your idea of adding a compact `select` class, but how compact is "compact"? Future UIs specs may require other spacing that may be somewhere between "normal" and "compact", etc...
I think to make this easier to fix for next time (hopefully there won't be a next time but we said it last time as well...), adding vars for the inline-start and inline-end paddings would allow overriding them without specifying the RTL variants (for the background position you mentioned above).
Of course the background position would need to be calculated according to this, maybe something like `calc((var(--select-padding-inline-end) - 12px /* = background-image size /*) / 2)` to center the arrow in the end.

I'm not feeling well at the moment so I can't work on it soon-ish, if you're not up for the task bounce the needinfo back to me and I'll work on it when I can :)