feat(#714): show selected value on range questions#800
feat(#714): show selected value on range questions#800garethbowen wants to merge 3 commits intomainfrom
Conversation
🦋 Changeset detectedLatest commit: 415e8c7 The changes in this PR will be included in the next version bump. This PR includes changesets to release 1 package
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
|
@latin-panda This is ready for review. Screenshots and some explanation on the issue. Thanks! |
latin-panda
left a comment
latin-panda
left a comment
There was a problem hiding this comment.
This is a much-needed improvement! 🤩
| line-height: 1; | ||
| } | ||
|
|
||
| :deep(.p-slider-handle) { |
There was a problem hiding this comment.
Can we make the selected value 'pop' more? When it's at the very start or end of the slider, it’s harder to distinguish the selection from the labels at first glance. We can center the selected value, and shrinking the min/max numbers, that'd match Collect, for example:
There was a problem hiding this comment.
I also find the stationary selected value in the center of the range a little easier to use than when it's following the thumb.
| {{ start }} | ||
| </div> | ||
| <div class="range-value"> | ||
| {{ numberValue }} |
There was a problem hiding this comment.
Now that the selected value is showing, I've noticed a bit of a glitch:
Sometimes I need to tap the circle several times to select it. This happens in both Chrome and Firefox.
slider-issue.mp4
Is it a quick win we can include in this PR?
There was a problem hiding this comment.
I bet you're experiencing the issue @gareth pointed out at #777 (comment) Seeing this video makes me think it's more serious than I originally thought.
3 participants
Closes #714
I have verified this PR works in these browsers (latest versions):
What else has been done to verify that this works as intended?
Why is this the best possible solution? Were any other approaches considered?
How does this change affect users? Describe intentional changes to behavior and behavior that could have accidentally been affected by code changes. In other words, what are the regression risks?
Do we need any specific form for testing your changes? If so, please attach one.
What's changed