search

mwmbl / front-end-original

A front-end for the mwmbl search engine written in vanilla javascript
https://mwmbl.github.io/front-end/
GNU Affero General Public License v3.0
13 stars 3 forks source link

Respect reduced motion settings #18

Closed sarayourfriend closed 2 years ago

sarayourfriend commented 2 years ago

While the minimalist homepage is quite pleasant, the movement on it can be jarring for some folks. For these cases there is the prefers-reduced-motion media query that can be used to develop alternative (usually much more minimal to no) animations.

Originally I had overcomplicated the potential solution (you can see it in the revisions of this issue). There is a simple fix though: wait until the user submits the query, just like other forms. At this point, move the search bar. With reduced motion enabled, pop the search bar up to the top without a transition. This will solve the movement and will also remove the possibility that the movement happens while you are typing, as in the video below.

https://user-images.githubusercontent.com/24264157/178134795-6124b694-efc6-4200-a439-eaf3c32050a5.mp4

Anyway, love the project! I will be following it closely. If you ever want to pop over to Openverse we're also doing a non-profit search engine thing, though admittedly with a specific niche and goal in mind.

Also, if you're happy to accept a PR and any have suggestions for which solution you'd like to see implemented, I'd be glad to take a go at it :slightly_smiling_face:

ColinEspinas commented 2 years ago

Adding support for prefers-reduced-motion is definitely something we would want to implement. You are free to submit any PR to the project concerning this feature or any other idea.

Thanks for this issue!