search

steven-tey / precedent

An opinionated collection of components, hooks, and utilities for your Next.js project.
https://precedent.dev
MIT License
4.69k stars 409 forks source link

Your drop-down is broken on safari iOS #2

Closed mismosmi closed 1 year ago

mismosmi commented 1 year ago

https://user-images.githubusercontent.com/26325283/212402167-2c3f2381-984b-466f-a524-ad8b934d8f44.MOV

edgarasben commented 1 year ago

Some weird positioning even in Chromium (Arc) too.

image
steven-tey commented 1 year ago

@mismosmi looking into that right now! Thanks for the heads-up!

@edgarasben I can't repro this in Arc :hmmm:

edgarasben commented 1 year ago

@mismosmi looking into that right now! Thanks for the heads-up!

@edgarasben I can't repro this in Arc :hmmm:

It happens for me on the first hard-refresh only:

https://user-images.githubusercontent.com/725324/212412774-16fa1a60-b4f3-45c6-801d-d28bc2e53183.mov

steven-tey commented 1 year ago

@edgarasben Oooooh thanks for the info, I was able to repro! Will look into it!

amanzrx4 commented 1 year ago

There's some overflow issue as well. Is the project accepting PRs? @steven-tey

steven-tey commented 1 year ago

Yes it is! @amanzrx4 – feel free to PR! :)

steven-tey commented 1 year ago

@mismosmi @edgarasben both the dropdown z index issue + the Arc issue should be fixed now!

Turns out it was a super obscure Framer Motion bug lol so I switched to Tailwind animate: https://github.com/steven-tey/precedent/blob/main/pages/index.tsx#L81

Thanks again for reporting this!

edgarasben commented 1 year ago

@steven-tey the bug is still there! If you reload the page and quickly click selector WHILE page is still animating in, you will get the same problem.