add loading spinner #2
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
<rebased onto main> |
|
Thoughts, @orangejulius @missinglink ? |
|
I like this. The animation is pretty cool, a bit more unique than most. It's also visible but subtle enough to stay out of the way. 👍 |
the spinner is shown as the user types (and requests are being made) and is hidden when a request comes back with results, as well as when an error occurs. to hide it on error required wrapping the user-supplied error callback in our own function. the color can be changed using the --loading-color variable.
|
I have rebased into main and added a CSS variable to customize the color of the loading spinner. Ready to merge if you think we should add it. |
|
Yeah it's much better with the spinner :) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
The spinner is shown as the user types (and requests are being made) and is hidden when a request comes back with results, as well as when an error occurs.
The spinner is an animated SVG from here (2nd row on the right): https://samherbert.net/svg-loaders/
I adjusted the animation duration to make it a bit faster. We can chose a different one of course, but I’d like it to be an animated SVG because they’re quite small and we can easily bundle them (as is shown in this PR).
autocomplete-loading-spinner.mov