Add reduced motion variant styles

[sarayourfriend]

Fixes #18

Removes the "real time" search behavior and animation when the client has indicated that they prefer reduced motion. In that case, the search waits for them to "submit", as most searches these days do (the behavior will be familiar).

Additionally, increases the debounce timeout for when real time search is enabled and keeps the "submit" event for these clients as well so that if someone beats the timeout, they still see a responsive search.

I also added instructions in the README with a suggestion for how to run the app locally, hopefully saving everyone some time in the future :slightly_smiling_face:

[ColinEspinas]

Thanks for the contribution, I find this change interesting as this would also kind of fix #20 by just waiting for the user to submit. I'll come back to this once I have more feedback on the whole "wait for submit vs realtime updates" situation.

To test this I was serving the app locally using python's http.server module. For this to work I had to move the assets and the config.js into the src directory. Is there a better way to run the app locally that doesn't require those changes?

I just use the liveserver extension on VSCode, it works by serving the root of the repository and just navigating to the /src route. I would agree that this is not a great setup. We are already looking into changing the technologies we use for the front-end and the extension. As this pure vanilla front-end is great for a prototype but not ideal for contributors to engage with.

I will probably talk about it more on element, join us if you've got some time to chat.

[sarayourfriend]

just navigating to the /src route

Oh dear, that's quite obvious now :facepalm: I was serving the src directory specifically instead of the root of the repo :sweat_smile:

For the attributes: I think they are not necessary and wouldn't ever be used in a context where this page actually loads on the browser, given the rendering depends entirely on client side JS. If it was an SSR'd page then the form would make the input work even if JavaScript wasn't enabled. Given that's not the case I'll remove those attributes.

[sarayourfriend]

We discussed this briefly in #mwmbl:matrix.org chat and decided that an alternative approach to try would be to only wait for submit when reduced motion is enabled but also increase the debounce timeout for "real time search" higher than 100ms. I'll work on implementing that later today.

[sarayourfriend]

@ColinEspinas changes are up, at your leisure :grin: