feat(searchbox): provide a loading indicator #2509
Closed
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
|
Waiting for the link :) |
|
Deploy preview ready! Built with commit a51b298 https://deploy-preview-2509--algolia-instantsearch.netlify.com |
|
Seems like the indicator shows up instantly, do you think it's something that people should add with a transition in css? |
|
I added a loader image, from https://github.com/SamHerbert/SVG-Loaders which is MIT |
Haroenv
previously requested changes
Oct 20, 2017
Haroenv
dismissed
their stale review
I take back my words, it does show up now, was throttling wrong
bobylito
commented
Oct 21, 2017
src/css/theme/_search-box.scss
Outdated
| @@ -48,7 +48,8 @@ | |||
| svg{ | |||
| visibility: hidden; | |||
| } | |||
| background: red; | |||
| background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="38" height="38"><defs><linearGradient id="a" x1="8.04%" x2="65.68%" y1="0%" y2="23.86%"><stop stop-color="%23BFC7D8" stop-opacity="0" offset="0%"/><stop stop-color="%23BFC7D8" stop-opacity=".63" offset="63.15%"/><stop stop-color="%23BFC7D8" offset="100%"/></linearGradient></defs><g fill="none" fill-rule="evenodd" transform="translate(1 1)"><path stroke="url(%23a)" stroke-width="2" d="M36 18c0-9.94-8.06-18-18-18"><animateTransform attributeName="transform" type="rotate" from="0 18 18" to="360 18 18" dur="0.9s" repeatCount="indefinite"/></path><circle cx="36" cy="18" r="1" fill="%23BFC7D8"><animateTransform attributeName="transform" type="rotate" from="0 18 18" to="360 18 18" dur="0.9s" repeatCount="indefinite"/></circle></g></svg>'); | |||
Looks good :D |
bobylito
force-pushed
the
feat/searchbox-loading-indicator
branch
from
036778e
to
23b79ec
Compare
This was referenced Nov 3, 2017
|
Closing in favor of #2569 |
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.
When the requests are stalled by the network, it is important to let the user know.
This is an early opening of the PR so that I can start gathering feedback. Current questions:
https://deploy-preview-2509--algolia-instantsearch.netlify.com/v2/dev-novel/?selectedStory=SearchBox.With%20loading%20indicator (to test in bad condition, you should set your Chrome console to slow 3g)
fixes #2315