Few minor issue with dropdowns

[Don]

Hello,

I notice some minor align issue with dropdowns.

1. On the user page the user notification dropdown header.
   

2. Same place but the dropdown and only on mobile.
   

   

3. On mobile the dropdown position not correct on few place.
   

4. Top pages dropdown arrow position on Safari
   

5. Top pages after click on hover
   

[awesomerobot (Kris)]

We just merged a fix here

UX: Select-kit update alignment fixes

This covers everything except

@Don

On mobile the dropdown position not correct on few place.

https://d11a6trkgmumsb.cloudfront.net/original/3X/5/e/5e5e40b39afb6456541c530dd8599b6aceb9619a.mp4

I think this has to do with popper @j.jaffeux? not sure how to approach that

[j.jaffeux (Joffrey Jaffeux)]

@awesomerobot

@Don

On mobile the dropdown position not correct on few place.

https://d11a6trkgmumsb.cloudfront.net/original/3X/5/e/5e5e40b39afb6456541c530dd8599b6aceb9619a.mp4

I think this has to do with popper @j.jaffeux? not sure how to approach that

I can’t repro this. On what device do you repro this? This is in safari or DiscourseHUB? (I can’t repro on any of them FWIW).

[Don]

This is on Android 10 Chrome 92.0.4515.166

[j.jaffeux (Joffrey Jaffeux)]

I have only Chrome 91 available, but no repro on Android 10/11 so far.

[Don]

Ahh ok I found it I think. It cause the phone Display size settings. I use it on small size. Now I set it to default and works fine. This is happening on Small Display Size only.

[j.jaffeux (Joffrey Jaffeux)]

Ok I see, we can repro, will have a look, but it’s going to be low priority.

[Don]

Hello,

The last issue with dropdown (what I reported before) has been fixed now.

@Don

• On mobile the dropdown position not correct on few place.

https://d11a6trkgmumsb.cloudfront.net/original/3X/5/e/5e5e40b39afb6456541c530dd8599b6aceb9619a.mp4

I believe the fix in @pmusaraj huge commit: UX: Normalize sizing for inputs, buttons, dropdowns (#14226) · discourse/discourse@24e71ac · GitHub

Thank you for everyone!